ayoub/nerdware
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(web): brand icons (Spotify/YouTube) via react-simple-icons

Browse source 
Add @icons-pack/react-simple-icons for brand logos lucide doesn't provide.
End-screen track recap now uses official SiSpotify (green) and SiYoutube (red)
icons instead of generic ones. Lucide stays for UI icons.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
AyoubBenziza 2026-06-10 17:35:20 +02:00
parent c0a4340bae
commit 3f36798207
3 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
apps/web/package.json
View file

@ -14,6 +14,7 @@
"dependencies": {
"@dicebear/core": "^10",
"@dicebear/styles": "^10",
"@icons-pack/react-simple-icons": "^13",
"@nerdware/shared": "workspace:*",
"@tanstack/react-query": "^5.101.0",
"@workspace/ui": "workspace:*",

9
apps/web/src/components/game-end-view.tsx
View file

@ -1,7 +1,8 @@
import { useState } from "react"
import { Link } from "wouter"
import { motion } from "framer-motion"
import { Check, ClipboardList, Crown, ExternalLink, Music, Music2 } from "lucide-react"
import { Check, ClipboardList, Crown, Music } from "lucide-react"
import { SiSpotify, SiYoutube } from "@icons-pack/react-simple-icons"
import type { BlindtestTrackInfo, PlayerScore, RoomSnapshot } from "@nerdware/shared"
import { Button } from "@workspace/ui/components/button"
import { useRoomStore } from "@/store/room"
@ -276,13 +277,13 @@ function TracksRecap({ tracks }: { tracks: BlindtestTrackInfo[] }) {
rel="noreferrer"
title="Chercher sur Spotify"
>
<Button size="icon-sm" className="bg-green-600 hover:bg-green-500">
<Music2 />
<Button size="icon-sm" variant="secondary">
<SiSpotify color="default" />
</Button>
</a>
<a href={t.url} target="_blank" rel="noreferrer" title="Ouvrir sur YouTube">
<Button size="icon-sm" variant="secondary">
<ExternalLink />
<SiYoutube color="default" />
</Button>
</a>
</li>

3
bun.lock
View file

@ -40,6 +40,7 @@
"dependencies": {
"@dicebear/core": "^10",
"@dicebear/styles": "^10",
"@icons-pack/react-simple-icons": "^13",
"@nerdware/shared": "workspace:*",
"@tanstack/react-query": "^5.101.0",
"@workspace/ui": "workspace:*",
@ -295,6 +296,8 @@
"@humanwhocodes/retry": ["@humanwhocodes/retry@0.4.3", "", {}, "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ=="],
"@icons-pack/react-simple-icons": ["@icons-pack/react-simple-icons@13.13.0", "", { "peerDependencies": { "react": "^16.13 || ^17 || ^18 || ^19" } }, "sha512-B5HhQMIpcSH4z8IZ8HFhD59CboHceKYMpPC9kAwGyKntvPdyJJv26DLu4Z1wAjcCLyrJhf11tMhiQGom9Rxb9g=="],
"@inquirer/ansi": ["@inquirer/ansi@1.0.2", "", {}, "sha512-S8qNSZiYzFd0wAcyG5AXCvUHC5Sr7xpZ9wZ2py9XR88jUz8wooStVx5M6dRzczbBWjic9NP7+rY0Xi7qqK/aMQ=="],
"@inquirer/checkbox": ["@inquirer/checkbox@4.3.2", "", { "dependencies": { "@inquirer/ansi": "^1.0.2", "@inquirer/core": "^10.3.2", "@inquirer/figures": "^1.0.15", "@inquirer/type": "^3.0.10", "yoctocolors-cjs": "^2.1.3" }, "peerDependencies": { "@types/node": ">=18" }, "optionalPeers": ["@types/node"] }, "sha512-VXukHf0RR1doGe6Sm4F0Em7SWYLTHSsbGfJdS9Ja2bX5/D5uwVOEjr07cncLROdBvmnvCATYEWlHqYmXv2IlQA=="],