Refactor investment check to use dynamic user ID; enhance Portfolio component with new card layout and add QuestionMarkIcon component

This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2024-10-30 22:03:03 +07:00
parent 8cf2a031ca
commit e8de157612
3 changed files with 57 additions and 23 deletions

View File

@ -5,7 +5,7 @@ async function checkForInvest(supabase: SupabaseClient, userId: string) {
let { count, error } = await supabase
.from("investment_deal")
.select("*", { count: "exact" })
.eq("investor_id", "8as1761d2");
.eq("investor_id", userId);
if (error) {
console.error(error);
return false;

View File

@ -14,6 +14,8 @@ import {
} from "./hook";
import CountUpComponent from "@/components/countUp";
import { RecentFunds } from "@/components/recent-funds";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import QuestionMarkIcon from "@/components/icon/questionMark";
export default async function Portfolio({
params,
@ -21,7 +23,9 @@ export default async function Portfolio({
params: { uid: string };
}) {
const supabase = createSupabaseClient();
await checkForInvest(supabase, params.uid);
// if user hasn't invest in anything
if (!(await checkForInvest(supabase, params.uid))) {
}
const { data: deals, error: investorDealError } = await getInvestorDeal(
supabase,
params.uid
@ -67,27 +71,41 @@ export default async function Portfolio({
<Overview graphType="bar" data={fourYearData}></Overview>
<Overview graphType="bar" data={dayOfWeekData}></Overview>
</div>
<div className="flex flex-cols-3 w-96">
<div className="">
<h1>Project tag</h1>
<PieChart
data={tagCount.map(
(item: { name: string; count: number }) => item.count
)}
labels={tagCount.map(
(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>
<div className="flex flex-cols-3 w-96 gap-5">
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-md font-bold">
Categories of Invested Projects
</CardTitle>
<QuestionMarkIcon />
</CardHeader>
<CardContent className="mt-5">
<PieChart
data={tagCount.map(
(item: { name: string; count: number }) => item.count
)}
labels={tagCount.map(
(item: { name: string; count: number }) => item.name
)}
header="Total"
/>
</CardContent>
</Card>
<Card>
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-md font-bold">
Categories of Invested Projects
</CardTitle>
<QuestionMarkIcon />
</CardHeader>
<CardContent className="mt-5">
<PieChart
data={Object.values(countedBusinessType)}
labels={Object.keys(countedBusinessType)}
header="Total"
/>
</CardContent>
</Card>
<RecentFunds />
</div>
</div>

View File

@ -0,0 +1,16 @@
export default function QuestionMarkIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
height="18px"
width="18px"
version="1.1"
id="_x32_"
viewBox="0 0 512 512"
>
<g>
<path d="M256,0C114.616,0,0,114.612,0,256s114.616,256,256,256s256-114.612,256-256S397.385,0,256,0z M207.678,378.794 c0-17.612,14.281-31.893,31.893-31.893c17.599,0,31.88,14.281,31.88,31.893c0,17.595-14.281,31.884-31.88,31.884 C221.959,410.678,207.678,396.389,207.678,378.794z M343.625,218.852c-3.596,9.793-8.802,18.289-14.695,25.356 c-11.847,14.148-25.888,22.718-37.442,29.041c-7.719,4.174-14.533,7.389-18.769,9.769c-2.905,1.604-4.479,2.95-5.256,3.826 c-0.768,0.926-1.029,1.306-1.496,2.826c-0.273,1.009-0.558,2.612-0.558,5.091c0,6.868,0,12.512,0,12.512 c0,6.472-5.248,11.728-11.723,11.728h-28.252c-6.475,0-11.732-5.256-11.732-11.728c0,0,0-5.645,0-12.512 c0-6.438,0.752-12.744,2.405-18.777c1.636-6.008,4.215-11.718,7.508-16.694c6.599-10.083,15.542-16.802,23.984-21.48 c7.401-4.074,14.723-7.455,21.516-11.281c6.789-3.793,12.843-7.91,17.302-12.372c2.988-2.975,5.31-6.05,7.087-9.52 c2.335-4.628,3.955-10.067,3.992-18.389c0.012-2.463-0.698-5.702-2.632-9.405c-1.926-3.686-5.066-7.694-9.264-11.29 c-8.45-7.248-20.843-12.545-35.054-12.521c-16.285,0.058-27.186,3.876-35.587,8.62c-8.36,4.776-11.029,9.595-11.029,9.595 c-4.268,3.718-10.603,3.85-15.025,0.314l-21.71-17.397c-2.719-2.173-4.322-5.438-4.396-8.926c-0.063-3.479,1.425-6.81,4.061-9.099 c0,0,6.765-10.43,22.451-19.38c15.62-8.992,36.322-15.488,61.236-15.429c20.215,0,38.839,5.562,54.268,14.661 c15.434,9.148,27.897,21.744,35.851,36.876c5.281,10.074,8.525,21.43,8.533,33.38C349.211,198.042,347.248,209.058,343.625,218.852 z" />
</g>
</svg>
);
}