chore: yarn upgrade

package.json

@@ -2,7 +2,7 @@
   "name": "stream_ui",
   "version": "0.1.0",
   "dependencies": {
-    "@emoji-mart/data": "^1.1.2",
+    "@emoji-mart/data": "^1.2.1",
     "@emoji-mart/react": "^1.1.1",
     "@noble/curves": "^1.2.0",
     "@scure/base": "^1.1.3",
@@ -20,29 +20,29 @@
     "classnames": "^2.3.2",
     "emoji-mart": "^5.5.2",
     "flag-icons": "^6.11.0",
-    "hls.js": "^1.4.6",
-    "marked": "^9.1.2",
+    "hls.js": "^1.5.8",
+    "marked": "^12.0.2",
     "qr-code-styling": "^1.6.0-rc.1",
-    "react": "^18.2.0",
+    "react": "^18.3.1",
     "react-confetti": "^6.1.0",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dom": "^18.2.0",
+    "react-dom": "^18.3.1",
     "react-helmet": "^6.1.0",
-    "react-intersection-observer": "^9.5.1",
-    "react-intl": "^6.4.4",
-    "react-router-dom": "^6.13.0",
+    "react-intersection-observer": "^9.10.2",
+    "react-intl": "^6.6.6",
+    "react-router-dom": "^6.23.1",
     "react-tag-input-component": "^2.0.2",
     "react-use-pip": "^1.5.0",
-    "recharts": "^2.9.3",
+    "recharts": "^2.12.7",
     "semantic-sdp": "^3.26.3",
-    "usehooks-ts": "^2.9.1",
+    "usehooks-ts": "^3.1.0",
     "web-vitals": "^2.1.0",
     "webrtc-adapter": "^8.2.3",
-    "workbox-core": "^7.0.0",
-    "workbox-precaching": "^7.0.0",
-    "workbox-routing": "^7.0.0",
-    "workbox-strategies": "^7.0.0"
+    "workbox-core": "^7.1.0",
+    "workbox-precaching": "^7.1.0",
+    "workbox-routing": "^7.1.0",
+    "workbox-strategies": "^7.1.0"
   },
   "scripts": {
     "start": "vite",
@@ -89,11 +89,11 @@
     "prettier": "^2.8.8",
     "prop-types": "^15.8.1",
     "rollup-plugin-visualizer": "^5.10.0",
-    "tailwindcss": "^3.3.5",
-    "typescript": "^5.2.2",
-    "vite": "^5.2.10",
-    "vite-plugin-pwa": "^0.17.2",
-    "vite-plugin-version-mark": "^0.0.10"
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.11",
+    "vite-plugin-pwa": "^0.20.0",
+    "vite-plugin-version-mark": "^0.0.13"
   },
   "packageManager": "yarn@4.1.1",
   "prettier": {

src/element/video-grid-sorted.tsx

@@ -145,7 +145,7 @@ function PopularCategories({ items }: { items: Array<TaggedNostrEvent> }) {
       </div>
       <div className="flex flex-wrap gap-4">
         {categories.map(a => (
-          <Link to={`/category/${a.gameId}`} className="xl:w-[180px] lg:w-[170px] max-lg:w-[calc(33.3%-0.75rem)]">
+          <Link key={a.gameId} to={`/category/${a.gameId}`} className="xl:w-[180px] lg:w-[170px] max-lg:w-[calc(33.3%-0.75rem)]">
             <CategoryTile gameId={a.gameId} showFooterTitle={true}>
               <div className="flex gap-2 flex-wrap">
                 <CategoryZaps gameId={a.gameId} />