Add investment check and value counting functions; update Portfolio component to utilize new features

src/app/portfolio/[uid]/hook.ts

@@ -1,10 +1,40 @@
 import { SupabaseClient } from "@supabase/supabase-js";
 import { getProjectTag, getTagName } from "@/lib/data/query";
 
+async function checkForInvest(supabase: SupabaseClient, userId: string) {
+  let { count, error } = await supabase
+    .from("investment_deal")
+    .select("*", { count: "exact" })
+    .eq("investor_id", "8as1761d2");
+  if (error) {
+    console.error(error);
+    return false;
+  }
+  // if user already invest in something
+  if (count !== null && count > 0) {
+    return true;
+  }
+  return false;
+}
+
+function countValues(arr: { value: string }[][]): Record<string, number> {
+  const counts: Record<string, number> = {};
+
+  arr.forEach((subArray) => {
+    subArray.forEach((item) => {
+      const value = item.value;
+      counts[value] = (counts[value] || 0) + 1;
+    });
+  });
+
+  return counts;
+}
+
 async function getBusinessTypeName(
   supabase: SupabaseClient,
   projectId: number
 ) {
+  // step 1: get business id from project id
   let { data: project, error: projectError } = await supabase
     .from("project")
     .select("business_id")
@@ -13,6 +43,7 @@ async function getBusinessTypeName(
     console.error(projectError);
   }
 
+  //  step 2: get business type's id from business id
   let { data: business, error: businessError } = await supabase
     .from("business")
     .select("business_type")
@@ -20,7 +51,7 @@ async function getBusinessTypeName(
   if (businessError) {
     console.error(businessError);
   }
-
+  // step 3: get business type from its id
   let { data: business_type, error: businessTypeError } = await supabase
     .from("business_type")
     .select("value")
@@ -204,4 +235,6 @@ export {
   getInvestorProjectTag,
   countTags,
   getBusinessTypeName,
+  countValues,
+  checkForInvest,
 };

src/app/portfolio/[uid]/page.tsx

@@ -9,8 +9,11 @@ import {
   getInvestorProjectTag,
   countTags,
   getBusinessTypeName,
+  countValues,
+  checkForInvest,
 } from "./hook";
 import CountUpComponent from "@/components/countUp";
+import { RecentFunds } from "@/components/recent-funds";
 
 export default async function Portfolio({
   params,
@@ -18,6 +21,7 @@ export default async function Portfolio({
   params: { uid: string };
 }) {
   const supabase = createSupabaseClient();
+  await checkForInvest(supabase, params.uid);
   const { data: deals, error: investorDealError } = await getInvestorDeal(
     supabase,
     params.uid
@@ -38,14 +42,17 @@ export default async function Portfolio({
         )
       )
     : [];
-  console.log(businessType);
+  const countedBusinessType = countValues(
+    businessType.filter((item) => item !== null)
+  );
+  // console.log(countedBusinessType);
 
   // console.log(tagCount);
   return (
     <div>
       {/* {JSON.stringify(params.uid)} */}
       {/* {JSON.stringify(tagCount)} */}
-      {JSON.stringify(deals)}
+      {/* {JSON.stringify(deals)} */}
       {/* {JSON.stringify(dayOfWeekData)} */}
       {/* {JSON.stringify(overAllGraphData)} */}
       {/* {JSON.stringify(threeYearGraphData)} */}
@@ -60,16 +67,28 @@ export default async function Portfolio({
         <Overview graphType="bar" data={fourYearData}></Overview>
         <Overview graphType="bar" data={dayOfWeekData}></Overview>
       </div>
-      <div className="w-96">
+      <div className="flex flex-cols-3 w-96">
-        <PieChart
+        <div className="">
-          data={tagCount.map(
+          <h1>Project tag</h1>
-            (item: { name: string; count: number }) => item.count
+          <PieChart
-          )}
+            data={tagCount.map(
-          labels={tagCount.map(
+              (item: { name: string; count: number }) => item.count
-            (item: { name: string; count: number }) => item.name
+            )}
-          )}
+            labels={tagCount.map(
-          header="Total"
+              (item: { name: string; count: number }) => item.name
-        />
+            )}
+            header="Total"
+          />
+        </div>
+        <div className="">
+          <h1>Business Type</h1>
+          <PieChart
+            data={Object.values(countedBusinessType)}
+            labels={Object.keys(countedBusinessType)}
+            header="Total"
+          />
+        </div>
+        <RecentFunds />
       </div>
     </div>
   );