AmirReza Jamali
72948a9b55
- Introduced DailyTrendChart component for visualizing daily scraped TED notices, documents, and translated notices. - Implemented StatisticsSection to display key metrics with animated counters and a days selector for data range. - Created utility function to convert API data into labeled points for chart rendering. - Updated dashboard index to include the new StatisticsSection, enhancing overall dashboard functionality and user experience. - Refactored existing trends chart to utilize the new DailyPoint type for consistency in data handling.
75 lines
2.0 KiB
TypeScript
75 lines
2.0 KiB
TypeScript
"use client";
|
|
|
|
import { ClosingSoonCard } from "./closing-soon";
|
|
import { CountryDistribution } from "./country-distribution";
|
|
import { DashboardHero } from "./hero";
|
|
import { NoticeTypeBreakdown } from "./notice-types";
|
|
import { RecentTenders } from "./recent-tenders";
|
|
import { StatisticsSection } from "./statistics-section";
|
|
import { TenderStatCards } from "./stat-cards";
|
|
import { TenderTrendsChart } from "./trends-chart";
|
|
import { useDashboardData } from "./use-dashboard-data";
|
|
|
|
export function TenderDashboard() {
|
|
const {
|
|
isPending,
|
|
total,
|
|
active,
|
|
closingSoon,
|
|
totalValue,
|
|
valueCurrency,
|
|
countries,
|
|
noticeTypes,
|
|
trend,
|
|
recent,
|
|
recentIsLoading,
|
|
closingSoonList,
|
|
} = useDashboardData();
|
|
|
|
return (
|
|
<div className="space-y-4 md:space-y-6 2xl:space-y-7.5">
|
|
<DashboardHero
|
|
total={total}
|
|
active={active}
|
|
closingSoon={closingSoon}
|
|
isLoading={isPending}
|
|
/>
|
|
|
|
<TenderStatCards
|
|
total={total}
|
|
active={active}
|
|
closingSoon={closingSoon}
|
|
totalValue={totalValue}
|
|
valueCurrency={valueCurrency}
|
|
trend={trend}
|
|
isLoading={isPending}
|
|
/>
|
|
|
|
<div className="grid grid-cols-12 gap-4 md:gap-6 2xl:gap-7.5">
|
|
<div className="col-span-12 xl:col-span-8">
|
|
<TenderTrendsChart data={trend} isLoading={isPending} />
|
|
</div>
|
|
<div className="col-span-12 xl:col-span-4">
|
|
<CountryDistribution countries={countries} isLoading={isPending} />
|
|
</div>
|
|
|
|
<div className="col-span-12 xl:col-span-5">
|
|
<NoticeTypeBreakdown
|
|
noticeTypes={noticeTypes}
|
|
isLoading={isPending}
|
|
/>
|
|
</div>
|
|
<div className="col-span-12 xl:col-span-7">
|
|
<ClosingSoonCard tenders={closingSoonList} isLoading={isPending} />
|
|
</div>
|
|
|
|
<div className="col-span-12">
|
|
<RecentTenders tenders={recent} isLoading={recentIsLoading} />
|
|
</div>
|
|
</div>
|
|
|
|
<StatisticsSection />
|
|
</div>
|
|
);
|
|
}
|