diff --git a/src/app/reputation/page.tsx b/src/app/reputation/page.tsx new file mode 100644 index 0000000..7518a9b --- /dev/null +++ b/src/app/reputation/page.tsx @@ -0,0 +1,30 @@ +import { getMockReputationScore } from "@/lib/reputation"; +import ReputationScoreCard from "@/components/ReputationScoreCard"; +import ReviewHistory from "@/components/ReviewHistory"; + +export default function ReputationPage() { + const score = getMockReputationScore(); + + return ( +
+ {/* Page Header */} +
+

Reputation Dashboard

+

+ View your aggregate reputation score and browse through provider reviews. +

+
+ + {/* Layout: Score Card + Review History */} +
+ +
+

Review History

+ +
+
+
+ ); +} \ No newline at end of file diff --git a/src/components/ReputationScoreCard.tsx b/src/components/ReputationScoreCard.tsx new file mode 100644 index 0000000..69e1e4c --- /dev/null +++ b/src/components/ReputationScoreCard.tsx @@ -0,0 +1,111 @@ +"use client"; + +import { HiStar } from "react-icons/hi"; +import Card from "@/components/ui/Card"; +import type { ReputationScore } from "@/lib/reputation"; + +interface ReputationScoreCardProps { + score: ReputationScore; +} + +function StarRating({ value, max = 5 }: { value: number; max?: number }) { + const full = Math.floor(value); + const hasHalf = value - full >= 0.25; + const stars = []; + + for (let i = 1; i <= max; i++) { + if (i <= full) { + stars.push( +