feat(frontend): add react spa with wishlist flows and public profile

apps/frontend/src/components/WishBadges/WishBadges.tsx

@@ -0,0 +1,51 @@
+import { Check, Sparkles, Archive, Trash2 } from 'lucide-react';
+import type { Wish } from '@family-wishlist/shared';
+import { cn } from '@/lib/cn';
+
+interface Props {
+  wish: Wish & { isNewForOwner?: boolean };
+  view: 'owner' | 'guest';
+  className?: string;
+}
+
+export function WishBadges({ wish, view, className }: Props) {
+  const badges: JSX.Element[] = [];
+
+  const isNew =
+    view === 'owner' ? wish.isNewForOwner === true : wish.isNewForGuest === true;
+  if (isNew && wish.status === 'ACTIVE') {
+    badges.push(
+      <span className="wish-badge wish-badge--new" key="new">
+        <Sparkles className="h-3 w-3" aria-hidden />
+        new
+      </span>,
+    );
+  }
+  if (wish.status === 'COMPLETED') {
+    badges.push(
+      <span className="wish-badge wish-badge--completed" key="done">
+        <Check className="h-3 w-3" aria-hidden />
+        fulfilled
+      </span>,
+    );
+  }
+  if (wish.status === 'ARCHIVED' && view === 'owner') {
+    badges.push(
+      <span className="wish-badge wish-badge--archived" key="arch">
+        <Archive className="h-3 w-3" aria-hidden />
+        archived
+      </span>,
+    );
+  }
+  if (wish.status === 'DELETED' && view === 'owner') {
+    badges.push(
+      <span className="wish-badge wish-badge--deleted" key="del">
+        <Trash2 className="h-3 w-3" aria-hidden />
+        trash
+      </span>,
+    );
+  }
+
+  if (badges.length === 0) return null;
+  return <div className={cn('flex flex-wrap gap-1.5', className)}>{badges}</div>;
+}