diff --git a/artifacts/ehsan-poc/src/lib/i18n/translations.ts b/artifacts/ehsan-poc/src/lib/i18n/translations.ts index 5a14e72..6579ed5 100644 --- a/artifacts/ehsan-poc/src/lib/i18n/translations.ts +++ b/artifacts/ehsan-poc/src/lib/i18n/translations.ts @@ -363,6 +363,14 @@ export const en = { referenceNumber: "Transaction Reference Number", refundNote: "To make refunds easy, please keep the transaction reference number.", copied: "Copied", + statsVisits: "Visits", + statsVisitsUnit: "visits", + statsLastDonation: "Last donation", + statsSecondUnit: "seconds ago", + statsBeneficiaries: "Beneficiaries", + statsOutOf: "of", + statsDonations: "Donations", + statsDonationsUnit: "donations", }, cart: { title: "Your Donation Cart", @@ -818,6 +826,14 @@ export const ar = { referenceNumber: "الرقم المرجعي للعملية", refundNote: "لتتم عملية الإسترداد بسهولة، نأمل حفظ الرقم المرجعي للعملية", copied: "تم النسخ", + statsVisits: "الزيارات", + statsVisitsUnit: "زيارة", + statsLastDonation: "آخر عملية تبرع قبل", + statsSecondUnit: "ثانية", + statsBeneficiaries: "عدد المستفيدين", + statsOutOf: "من أصل", + statsDonations: "عدد عمليات التبرع", + statsDonationsUnit: "عملية", }, cart: { title: "سلة تبرعاتك", diff --git a/artifacts/ehsan-poc/src/pages/donate.tsx b/artifacts/ehsan-poc/src/pages/donate.tsx index 3da8d6a..9365b74 100644 --- a/artifacts/ehsan-poc/src/pages/donate.tsx +++ b/artifacts/ehsan-poc/src/pages/donate.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useState, useMemo } from "react"; import { useForm } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; import { z } from "zod"; @@ -15,7 +15,7 @@ import { Input } from "@/components/ui/input"; import { Button } from "@/components/ui/button"; import { Card, CardContent } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; -import { Gift, Check, Copy, Info } from "lucide-react"; +import { Gift, Check, Copy, Info, Eye, Clock, Users, Radio } from "lucide-react"; import { Skeleton } from "@/components/ui/skeleton"; import { getNeedImage } from "../lib/needImages"; import { Riyal } from "@/components/Riyal"; @@ -47,6 +47,13 @@ const PATTERN_SVG = encodeURIComponent( ); const PATTERN_BG = `url("data:image/svg+xml,${PATTERN_SVG}")`; +// Stable per-case pseudo-random seed so POC stat values don't flicker on re-render. +function hashStr(s: string): number { + let h = 0; + for (let i = 0; i < s.length; i++) h = (h * 31 + s.charCodeAt(i)) >>> 0; + return h; +} + const schema = z.object({ donorName: z.string().min(2), donorPhone: z.string().min(10), @@ -111,6 +118,19 @@ export default function Donate() { defaultValues: { donorName: "", donorPhone: "", donorEmail: "" }, }); + // POC demo stats — stable per case (visits / last-donation time / beneficiaries + // are not stored by the API, so derive plausible values from the case id). + const stats = useMemo(() => { + const h = hashStr(params.id || "case"); + return { + visits: 8000 + (h % 15000), + donations: 1500 + ((h >> 3) % 22000), + beneficiaries: 5 + (h % 30), + totalBeneficiaries: 40, + lastDonationSeconds: 11 + (h % 49), + }; + }, [params.id]); + if (isLoading) { return (
{label}
++ {value} + {unit} +
+