mirror of
https://github.com/Sosokker/B2D-Ventures.git
synced 2025-12-19 14:04:06 +01:00
Update search result page ui
This commit is contained in:
parent
6c4987d6f4
commit
02e204d877
@ -1,12 +1,14 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { useSearchParams } from "next/navigation";
|
import { useSearchParams } from "next/navigation";
|
||||||
import { createClient, SupabaseClient } from "@supabase/supabase-js";
|
import { SupabaseClient } from "@supabase/supabase-js";
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
import { createSupabaseClient } from "@/lib/supabase/clientComponentClient";
|
import { createSupabaseClient } from "@/lib/supabase/clientComponentClient";
|
||||||
import { dehydrate, HydrationBoundary, QueryClient } from "@tanstack/react-query";
|
import { dehydrate, HydrationBoundary, QueryClient } from "@tanstack/react-query";
|
||||||
import { useQuery } from "@supabase-cache-helpers/postgrest-react-query";
|
import { useQuery } from "@supabase-cache-helpers/postgrest-react-query";
|
||||||
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
|
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
|
||||||
|
import { ExtendableCard } from "@/components/extendableCard";
|
||||||
|
import { Separator } from "@/components/ui/separator";
|
||||||
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||||
|
|
||||||
interface ProjectInvestmentDetail {
|
interface ProjectInvestmentDetail {
|
||||||
minInvestment: number;
|
minInvestment: number;
|
||||||
@ -19,6 +21,8 @@ interface Project {
|
|||||||
projectName: string;
|
projectName: string;
|
||||||
businessId: string;
|
businessId: string;
|
||||||
investmentCount: number;
|
investmentCount: number;
|
||||||
|
projectShortDescription: string;
|
||||||
|
publishedTime: string;
|
||||||
ProjectInvestmentDetail: ProjectInvestmentDetail[];
|
ProjectInvestmentDetail: ProjectInvestmentDetail[];
|
||||||
tags: string[];
|
tags: string[];
|
||||||
}
|
}
|
||||||
@ -42,6 +46,8 @@ function getProjects(client: SupabaseClient, businessIds: string[]) {
|
|||||||
id,
|
id,
|
||||||
projectName,
|
projectName,
|
||||||
businessId,
|
businessId,
|
||||||
|
publishedTime,
|
||||||
|
projectShortDescription,
|
||||||
ProjectInvestmentDetail (
|
ProjectInvestmentDetail (
|
||||||
minInvestment,
|
minInvestment,
|
||||||
totalInvestment,
|
totalInvestment,
|
||||||
@ -116,30 +122,59 @@ export default function Find() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
<div className="mt-10 mx-[15%]">
|
||||||
|
<h1 className="text-4xl font-bold">Result</h1>
|
||||||
|
|
||||||
|
<Separator className="my-4" />
|
||||||
|
|
||||||
{results.length === 0 && <p>No results found.</p>}
|
{results.length === 0 && <p>No results found.</p>}
|
||||||
{results.length > 0 && (
|
{results.length > 0 && (
|
||||||
<ul>
|
<ul>
|
||||||
{results.map((business) => (
|
{results.map((business) => (
|
||||||
<li key={business.id}>
|
<li key={business.id}>
|
||||||
<h2>{business.businessName}</h2>
|
{/* <h2>{business.businessName}</h2>
|
||||||
<p>Joined Date: {new Date(business.joinedDate).toLocaleDateString()}</p>
|
<p>Joined Date: {new Date(business.joinedDate).toLocaleDateString()}</p>
|
||||||
<ul>
|
|
||||||
{business.Projects.map((project) => (
|
{business.Projects.map((project) => (
|
||||||
<li key={project.id}>
|
<ExtendableCard
|
||||||
<h3>{project.projectName}</h3>
|
key={project.id}
|
||||||
<p>Investment Count: {project.investmentCount}</p>
|
name={project.projectName}
|
||||||
<p>Min Investment: ${project.ProjectInvestmentDetail[0]?.minInvestment}</p>
|
description={project.projectName}
|
||||||
<p>Total Investment: ${project.ProjectInvestmentDetail[0]?.totalInvestment}</p>
|
joinDate={project.projectName}
|
||||||
<p>Target Investment: ${project.ProjectInvestmentDetail[0]?.targetInvestment}</p>
|
location={"Bangkok"}
|
||||||
<p>Tags: {project.tags.join(", ")}</p>
|
minInvestment={project.ProjectInvestmentDetail[0]?.minInvestment}
|
||||||
</li>
|
totalInvestor={project.ProjectInvestmentDetail[0]?.totalInvestment}
|
||||||
|
totalRaised={project.ProjectInvestmentDetail[0]?.targetInvestment}
|
||||||
|
tags={null}
|
||||||
|
/>
|
||||||
|
))} */}
|
||||||
|
|
||||||
|
<Card className="w-full">
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>{business.businessName}</CardTitle>
|
||||||
|
<CardDescription>Joined Date: {new Date(business.joinedDate).toLocaleDateString()}</CardDescription>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
{business.Projects.map((project) => (
|
||||||
|
<ExtendableCard
|
||||||
|
key={project.id}
|
||||||
|
name={project.projectName}
|
||||||
|
description={project.projectName}
|
||||||
|
joinDate={project.projectName}
|
||||||
|
location={"Bangkok"}
|
||||||
|
minInvestment={project.ProjectInvestmentDetail[0]?.minInvestment}
|
||||||
|
totalInvestor={project.ProjectInvestmentDetail[0]?.totalInvestment}
|
||||||
|
totalRaised={project.ProjectInvestmentDetail[0]?.targetInvestment}
|
||||||
|
tags={null}
|
||||||
|
/>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</CardContent>
|
||||||
|
</Card>
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
)}
|
)}
|
||||||
<ReactQueryDevtools initialIsOpen={false} />
|
<ReactQueryDevtools initialIsOpen={false} />
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user