From 77384f6248df37bd14b7e532f10715513d950194 Mon Sep 17 00:00:00 2001 From: marshalfleet Date: Sat, 27 Jun 2026 18:21:30 +0100 Subject: [PATCH 1/2] feat: add Elite Tier badge for level 3 players --- __tests__/components/Badge.test.tsx | 24 ++++++++++++ __tests__/components/PlayerCard.test.tsx | 48 ++++++++++++++++++++++++ app/player/[id]/page.tsx | 18 ++++++++- components/PlayerCard.tsx | 8 +++- components/ui/Badge.tsx | 18 +++++++++ 5 files changed, 114 insertions(+), 2 deletions(-) create mode 100644 __tests__/components/Badge.test.tsx create mode 100644 __tests__/components/PlayerCard.test.tsx create mode 100644 components/ui/Badge.tsx diff --git a/__tests__/components/Badge.test.tsx b/__tests__/components/Badge.test.tsx new file mode 100644 index 00000000..944df246 --- /dev/null +++ b/__tests__/components/Badge.test.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import Badge from '@/components/ui/Badge'; + +describe('Badge', () => { + it('renders default variant correctly', () => { + render(Default Badge); + expect(screen.getByText('Default Badge')).toBeInTheDocument(); + expect(screen.getByText('Default Badge')).toHaveClass('bg-brand-green'); + }); + + it('renders elite variant with gold/amber styling', () => { + render(Elite Tier); + const badge = screen.getByText('Elite Tier'); + expect(badge).toBeInTheDocument(); + expect(badge).toHaveClass('bg-amber-500'); + expect(badge).toHaveClass('border-amber-300'); + }); + + it('applies custom className', () => { + render(Test); + expect(screen.getByText('Test')).toHaveClass('custom-class'); + }); +}); diff --git a/__tests__/components/PlayerCard.test.tsx b/__tests__/components/PlayerCard.test.tsx new file mode 100644 index 00000000..1bc29941 --- /dev/null +++ b/__tests__/components/PlayerCard.test.tsx @@ -0,0 +1,48 @@ +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import PlayerCard from '@/components/PlayerCard'; +import type { Player } from '@/types'; + +const mockPlayer: Player = { + id: '1', + wallet: 'GTESTWALLET', + vitals: { + name: 'Test Player', + age: 25, + position: 'ST', + region: 'Europe', + nationality: 'England', + }, + ipfsHash: 'test-hash', + progressLevel: 0, + milestones: [], + createdAt: 1234567890, +}; + +describe('PlayerCard', () => { + it('renders player information correctly', () => { + render(); + expect(screen.getByText('Test Player')).toBeInTheDocument(); + expect(screen.getByText('ST · Europe')).toBeInTheDocument(); + }); + + it('does not show Elite Tier badge for level 0', () => { + render(); + expect(screen.queryByText('Elite Tier')).not.toBeInTheDocument(); + }); + + it('does not show Elite Tier badge for level 1', () => { + render(); + expect(screen.queryByText('Elite Tier')).not.toBeInTheDocument(); + }); + + it('does not show Elite Tier badge for level 2', () => { + render(); + expect(screen.queryByText('Elite Tier')).not.toBeInTheDocument(); + }); + + it('shows Elite Tier badge for level 3', () => { + render(); + expect(screen.getByText('Elite Tier')).toBeInTheDocument(); + }); +}); diff --git a/app/player/[id]/page.tsx b/app/player/[id]/page.tsx index ad7cdc7c..c9919007 100644 --- a/app/player/[id]/page.tsx +++ b/app/player/[id]/page.tsx @@ -3,6 +3,7 @@ import { useEffect, useState } from "react"; import { useParams } from "next/navigation"; import { useWallet } from "@/hooks/useWallet"; import ProgressBar from "@/components/ProgressBar"; +import Badge from "@/components/ui/Badge"; import { getPlayer } from "@/lib/contract"; import { buildPayToContact } from "@/lib/contract"; import { ipfsUrl } from "@/lib/ipfs"; @@ -35,6 +36,16 @@ export default function PlayerProfile() { return (
+ {/* Elite Tier Banner */} + {player.progressLevel === 3 && ( +
+ + Elite Tier + +

Highest verifiable status achieved

+
+ )} + {/* Header */}
@@ -44,7 +55,12 @@ export default function PlayerProfile() { )}
-

{player.vitals.name}

+
+

{player.vitals.name}

+ {player.progressLevel === 3 && ( + Elite Tier + )} +

{player.vitals.position} · {player.vitals.region} · Age {player.vitals.age}

diff --git a/components/PlayerCard.tsx b/components/PlayerCard.tsx index 6c5bd1ad..32d03b1f 100644 --- a/components/PlayerCard.tsx +++ b/components/PlayerCard.tsx @@ -2,6 +2,7 @@ import Link from "next/link"; import type { Player } from "@/types"; import { PROGRESS_LABELS } from "@/types"; import ProgressBar from "./ProgressBar"; +import Badge from "./ui/Badge"; export default function PlayerCard({ player }: { player: Player }) { const { id, vitals, progressLevel, ipfsHash } = player; @@ -20,7 +21,12 @@ export default function PlayerCard({ player }: { player: Player }) {
-

{vitals.name}

+
+

{vitals.name}

+ {progressLevel === 3 && ( + Elite Tier + )} +

{vitals.position} · {vitals.region}

diff --git a/components/ui/Badge.tsx b/components/ui/Badge.tsx new file mode 100644 index 00000000..072c007f --- /dev/null +++ b/components/ui/Badge.tsx @@ -0,0 +1,18 @@ +export interface BadgeProps { + variant?: "default" | "elite"; + children: React.ReactNode; + className?: string; +} + +export default function Badge({ variant = "default", children, className = "" }: BadgeProps) { + const variants = { + default: "bg-brand-green text-black", + elite: "bg-amber-500 text-black border-2 border-amber-300", + }; + + return ( + + {children} + + ); +} From 98c4f0af2444a1ae5e2be6873990fb240f4e03b2 Mon Sep 17 00:00:00 2001 From: marshalfleet Date: Sat, 27 Jun 2026 20:58:27 +0100 Subject: [PATCH 2/2] chore: remove FarmersMarketplace embedded repo --- FarmersMarketplace | 1 - 1 file changed, 1 deletion(-) delete mode 160000 FarmersMarketplace diff --git a/FarmersMarketplace b/FarmersMarketplace deleted file mode 160000 index a53c7846..00000000 --- a/FarmersMarketplace +++ /dev/null @@ -1 +0,0 @@ -Subproject commit a53c78466b6932fc34f027f8d00f313a16e764ae