feat: search page

packages/website/src/hooks/useAdExempt.ts

@@ -5,17 +5,17 @@ import { $patreonLogin } from '../stores/patreonLogin';
 let cache: Record<string, boolean | Promise<boolean>> = {};
 
 export function useAdExempt() {
-  const patreonLogin = useStore($patreonLogin);
+  const patreon = useStore($patreonLogin);
   const [exempt, setExempt] = useState(false);
 
   useLayoutEffect(() => {
     (async () => {
-      if (!patreonLogin.token) return setExempt(false);
+      if (!patreon.token) return setExempt(false);
 
-      if (!(patreonLogin.token in cache)) {
-        cache[patreonLogin.token] = new Promise<boolean>(async (resolve) => {
+      if (!(patreon.token in cache)) {
+        cache[patreon.token] = new Promise<boolean>(async (resolve) => {
           const response = await fetch(
-            `/api/patreon/membership/${patreonLogin.token}`,
+            `/api/patreon/membership/${patreon.token}`,
             { cache: 'force-cache' },
           );
 
@@ -24,12 +24,12 @@ export function useAdExempt() {
           const json = await response.json();
           const exempt = typeof json === 'boolean' && json;
 
-          cache[patreonLogin.token] = exempt;
+          cache[patreon.token] = exempt;
           resolve(exempt);
         });
       }
 
-      setExempt(await cache[patreonLogin.token]);
+      setExempt(await cache[patreon.token]);
     })();
   }, []);
 

packages/website/src/hooks/useArmor.ts

@@ -1,6 +1,6 @@
 import { asset } from '@blitzkit/core';
-import { ObjectMap, useLoader } from '@react-three/fiber';
-import { GLTF, GLTFLoader } from 'three-stdlib';
+import { type ObjectMap, useLoader } from '@react-three/fiber';
+import { type GLTF, GLTFLoader } from 'three-stdlib';
 
 const cache: Record<
   number,

packages/website/src/hooks/useAveragesExclusionRatio.ts

@@ -1,10 +1,9 @@
 import { averageDefinitions, discoveredIdsDefinitions } from '@blitzkit/core';
-import { use } from 'react';
+
+const awaitedDiscoveredIdsDefinitions = await discoveredIdsDefinitions;
+const awaitedAverageDefinitions = await averageDefinitions;
 
 export function useAveragesExclusionRatio() {
-  const awaitedDiscoveredIdsDefinitions = use(discoveredIdsDefinitions);
-  const awaitedAverageDefinitions = use(averageDefinitions);
-
   return (
     awaitedDiscoveredIdsDefinitions.count /
     awaitedAverageDefinitions.samples.total

packages/website/src/hooks/useEccentricity.ts

@@ -1,6 +1,6 @@
 import { TankDefinition, tankDefinitions } from '@blitzkit/core';
 import { sumBy } from 'lodash-es';
-import { use, useMemo } from 'react';
+import { useMemo } from 'react';
 import * as Duel from '../stores/duel';
 
 export enum UseEccentricityMode {
@@ -8,8 +8,9 @@ export enum UseEccentricityMode {
   Class,
 }
 
+const awaitedTankDefinitions = await tankDefinitions;
+
 export function useEccentricity(mode: UseEccentricityMode) {
-  const awaitedTankDefinitions = use(tankDefinitions);
   const tank = Duel.use((state) => state.protagonist.tank);
   const similarTanks = useMemo(
     () =>

packages/website/src/hooks/useEquipment.ts

@@ -1,9 +1,10 @@
 import { equipmentDefinitions } from '@blitzkit/core';
-import { use, useMemo } from 'react';
+import { useMemo } from 'react';
 import * as Duel from '../stores/duel';
 
+const awaitedEquipmentDefinitions = await equipmentDefinitions;
+
 export function useEquipment(id: number, antagonist = false) {
-  const awaitedEquipmentDefinitions = use(equipmentDefinitions);
   const member = Duel.use(
     (state) => state[antagonist ? 'antagonist' : 'protagonist']!,
   );

packages/website/src/hooks/useModel.ts

@@ -1,7 +1,7 @@
 import { asset } from '@blitzkit/core';
-import { ObjectMap, useLoader } from '@react-three/fiber';
+import { type ObjectMap, useLoader } from '@react-three/fiber';
 import { Mesh, MeshStandardMaterial } from 'three';
-import { GLTF, GLTFLoader } from 'three-stdlib';
+import { type GLTF, GLTFLoader } from 'three-stdlib';
 
 const cache: Record<
   number,

packages/website/src/hooks/useOnScreen.ts

@@ -1,4 +1,4 @@
-import { RefObject, useEffect, useRef, useState } from 'react';
+import { type RefObject, useEffect, useRef, useState } from 'react';
 
 /**
  * Thanks GuCier!

packages/website/src/hooks/useStoreBoolean.ts

@@ -0,0 +1,10 @@
+import { type StoreKeys } from '@nanostores/react';
+import type { Store } from 'nanostores';
+import { useStoreKey } from './useStoreKey';
+
+export function useStoreBoolean<Type>(
+  store: Store<Type>,
+  key: StoreKeys<Store<Type>>,
+) {
+  return Boolean(useStoreKey(store, key));
+}

packages/website/src/hooks/useStoreKey.ts

@@ -0,0 +1,10 @@
+import { useStore, type StoreKeys } from '@nanostores/react';
+import type { Store } from 'nanostores';
+
+export function useStoreKey<Type, Key extends StoreKeys<Store<Type>>>(
+  store: Store<Type>,
+  key: Key,
+) {
+  const state = useStore(store, { keys: [key] });
+  return state[key];
+}

packages/website/src/hooks/useTankTransform.ts

@@ -1,5 +1,5 @@
 import { I_HAT, J_HAT, K_HAT } from '@blitzkit/core';
-import { RefObject, useEffect } from 'react';
+import { type RefObject, useEffect } from 'react';
 import { Euler, Group, Vector3 } from 'three';
 import { degToRad } from 'three/src/math/MathUtils';
 import { correctZYTuple } from '../core/blitz/correctZYTuple';