g/ember-market-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update page.tsx

Browse Source
This commit is contained in:
NotII
2025-03-28 22:36:45 +00:00
parent 56ef98bb52
commit 546e7bd245
1 changed files with 169 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
app/page.tsx
View File

@@ -6,13 +6,19 @@ import { fetchPlatformStats } from "@/lib/stats-service";
import { HomeNavbar } from "@/components/home-navbar"; import { HomeNavbar } from "@/components/home-navbar";
import { Suspense } from "react"; import { Suspense } from "react";
// Constants
const PY_20 = 20;
const PY_32 = 32;
const PX_6 = 6;
const PX_10 = 10;
// Format number with commas // Format number with commas
function formatNumber(num: number): string { function formatNumberValue(num: number): string {
return new Intl.NumberFormat().format(Math.round(num)); return new Intl.NumberFormat().format(Math.round(num));
} }
// Format currency // Format currency
function formatCurrency(amount: number): string { function formatCurrencyValue(amount: number): string {
return new Intl.NumberFormat('en-GB', { return new Intl.NumberFormat('en-GB', {
style: 'currency', style: 'currency',
currency: 'GBP', currency: 'GBP',
@@ -22,6 +28,7 @@ function formatCurrency(amount: number): string {
// This is a server component // This is a server component
export default async function Home() { export default async function Home() {
try {
const stats = await fetchPlatformStats(); const stats = await fetchPlatformStats();
return ( return (
@@ -60,19 +67,19 @@ export default async function Home() {
<div className="grid grid-cols-1 md:grid-cols-3 gap-8"> <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0"> <div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0">
<Package className="h-12 w-12 text-[#D53F8C] mb-4" /> <Package className="h-12 w-12 text-[#D53F8C] mb-4" />
<div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatNumber(stats.orders.completed)}+</div> <div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatNumberValue(stats.orders.completed)}+</div>
<div className="text-xl font-semibold text-white mb-1">Orders Processed</div> <div className="text-xl font-semibold text-white mb-1">Orders Processed</div>
<p className="text-sm text-gray-400">Successfully delivered to customers around the world</p> <p className="text-sm text-gray-400">Successfully delivered to customers around the world</p>
</div> </div>
<div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0"> <div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0">
<Users className="h-12 w-12 text-[#D53F8C] mb-4" /> <Users className="h-12 w-12 text-[#D53F8C] mb-4" />
<div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatNumber(stats.vendors.total)}+</div> <div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatNumberValue(stats.vendors.total)}+</div>
<div className="text-xl font-semibold text-white mb-1">Registered Vendors</div> <div className="text-xl font-semibold text-white mb-1">Registered Vendors</div>
<p className="text-sm text-gray-400">Trusted merchants selling on our platform</p> <p className="text-sm text-gray-400">Trusted merchants selling on our platform</p>
</div> </div>
<div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0"> <div className="flex flex-col items-center text-center p-6 rounded-md bg-[#1C1C1C] border-0">
<CreditCard className="h-12 w-12 text-[#D53F8C] mb-4" /> <CreditCard className="h-12 w-12 text-[#D53F8C] mb-4" />
<div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatCurrency(stats.transactions.volume)}</div> <div className="text-4xl font-bold text-[#D53F8C] mb-2">{formatCurrencyValue(stats.transactions.volume)}</div>
<div className="text-xl font-semibold text-white mb-1">Transaction Volume</div> <div className="text-xl font-semibold text-white mb-1">Transaction Volume</div>
<p className="text-sm text-gray-400">Securely processed by our platform</p> <p className="text-sm text-gray-400">Securely processed by our platform</p>
</div> </div>
@@ -180,9 +187,13 @@ export default async function Home() {
</p> </p>
</div> </div>
<div className="mt-10 text-center text-sm text-gray-500"> <div className="mt-10 text-center text-sm text-gray-500">
<p>© {new Date().getFullYear()} Ember. All rights reserved.</p> <p> {new Date().getFullYear()} Ember. All rights reserved.</p>
</div> </div>
</footer> </footer>
</div> </div>
); );
} catch (error) {
console.error(error);
return <div>Error loading page</div>;
}
} }