feat: scroll to top on change

packages/website/package.json

@@ -26,6 +26,7 @@
     "markdown-to-jsx": "^7.5.0",
     "nanostores": "^0.11.3",
     "react": "^18.3.1",
+    "react-device-detect": "^2.2.3",
     "react-dom": "^18.3.1",
     "react-promise-suspense": "^0.3.4",
     "three": "^0.169.0",

packages/website/src/components/TierList/Tile.tsx

@@ -42,6 +42,8 @@ export function TierListTile(props: TierListTileProps) {
 
       lastPosition.current = { x: event.clientX, y: event.clientY };
 
+      window.scrollTo({ behavior: 'smooth', top: 124 });
+
       window.addEventListener('pointermove', handlePointerMove);
       window.addEventListener('pointerup', handlePointerUp);
 

packages/website/src/components/TierList/URLManager.tsx

@@ -1,7 +1,10 @@
+import { fetchTankDefinitions } from '@blitzkit/core';
 import { useEffect } from 'react';
 import { generateTierListParams } from '../../core/blitzkit/generateTierListParams';
 import { TierList } from '../../stores/tierList';
 
+const tankDefinitions = await fetchTankDefinitions();
+
 export function URLManager() {
   const tanks = TierList.use((state) => state.tanks);
   const mutateTierList = TierList.useMutation();
@@ -12,7 +15,10 @@ export function URLManager() {
     params.forEach((value, key) => {
       if (key.startsWith('row-')) {
         const index = Number.parseInt(key.slice(4), 10);
-        const values = value.split(',').map(parseInt).filter(Boolean);
+        const values = value
+          .split(',')
+          .map(Number)
+          .filter((id) => id in tankDefinitions.tanks);
 
         mutateTierList((draft) => {
           draft.tanks[index] = values;