diff --git a/bun.lockb b/bun.lockb index 55a6527fb..0deb31d57 100644 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/package.json b/package.json index 385a6130c..eb7837365 100644 --- a/package.json +++ b/package.json @@ -37,10 +37,10 @@ "devDependencies": { "@types/lodash-es": "^4.17.12", "@types/bun": "latest", - "@types/node": "^22.5.5", + "@types/node": "^22.5.4", "esbuild": "^0.19.12", "prettier": "^3.3.3", "prisma": "^5.19.1", - "typescript": "^5.6.2" + "typescript": "^5.5.4" } } diff --git a/packages/core/src/blitzkit/index.ts b/packages/core/src/blitzkit/index.ts index 6523d0f8f..21a33644a 100644 --- a/packages/core/src/blitzkit/index.ts +++ b/packages/core/src/blitzkit/index.ts @@ -24,7 +24,7 @@ export * from './gameDefinitions'; // export * from './isExplosive'; // export * from './linkBlitzAndDiscord'; // export * from './mapDefinitions'; -export * from './modelDefinitions'; +// export * from './modelDefinitions'; // export * from './normalizeBoundingBox'; // export * from './parseBkni'; // export * from './patientFetch'; @@ -40,7 +40,7 @@ export * from './superCompress'; export * from './superDecompress'; export * from './tankDefinitions'; // export * from './tankIcon'; -export * from './tankNames'; +// export * from './tankNames'; // export * from './unionBoundingBox'; // export * from './uniqueGuns'; // export * from './unwrapBlitzkitResponse'; diff --git a/packages/website-legacy/package.json b/packages/website-legacy/package.json index 51412eebe..56aed9621 100644 --- a/packages/website-legacy/package.json +++ b/packages/website-legacy/package.json @@ -32,10 +32,10 @@ "zustand": "^4.5.5" }, "devDependencies": { + "@types/react-dom": "^18", "@types/lodash": "^4.17.7", "@types/three": "^0.160.0", "@vanilla-extract/next-plugin": "^2.4.5", - "@types/react": "^18.3.5", - "@types/react-dom": "^18" + "@types/react": "^18.3.5" } } diff --git a/packages/website/src/components/TankSearch/constants.tsx b/packages/website-legacy/src/app/tools/tankopedia/components/TankSearch/constants.tsx similarity index 100% rename from packages/website/src/components/TankSearch/constants.tsx rename to packages/website-legacy/src/app/tools/tankopedia/components/TankSearch/constants.tsx diff --git a/packages/website/src/components/TankSearch/index.tsx b/packages/website-legacy/src/app/tools/tankopedia/components/TankSearch/index.tsx similarity index 89% rename from packages/website/src/components/TankSearch/index.tsx rename to packages/website-legacy/src/app/tools/tankopedia/components/TankSearch/index.tsx index c55bf6be3..0717dd230 100644 --- a/packages/website/src/components/TankSearch/index.tsx +++ b/packages/website-legacy/src/app/tools/tankopedia/components/TankSearch/index.tsx @@ -1,29 +1,37 @@ import { - type TankDefinition, TANK_CLASSES, + TankDefinition, gameDefinitions, modelDefinitions, + normalizeBoundingBox, + resolveDpm, resolveNearPenetration, tankDefinitions, tankDefinitionsArray, tankNames, + unionBoundingBox, } from '@blitzkit/core'; -import { useStore } from '@nanostores/react'; -import { type FlexProps, Callout, Flex, Link } from '@radix-ui/themes'; +import { Callout, Flex, FlexProps, Link, Text } from '@radix-ui/themes'; +import { go } from 'fuzzysort'; import { times } from 'lodash-es'; -import { memo, use, useEffect, useMemo, useState } from 'react'; -import { Fragment } from 'react/jsx-runtime'; -import { filterTank } from '../../core/blitzkit/filterTank'; -import { resolveReload } from '../../core/blitzkit/resolveReload'; -import { useAdExempt } from '../../hooks/useAdExempt'; -import { $tankFilters } from '../../stores/tankFilters'; +import { Fragment, memo, use, useEffect, useMemo, useState } from 'react'; +import { AdMidSectionResponsive } from '../../../../../components/AdMidSectionResponsive'; +import { ExperimentIcon } from '../../../../../components/ExperimentIcon'; +import { filterTank } from '../../../../../core/blitzkit/filterTank'; +import { resolveReload } from '../../../../../core/blitzkit/resolveReload'; +import { useAdExempt } from '../../../../../hooks/useAdExempt'; +import * as TankFilters from '../../../../../stores/tankFilters'; import { SORT_NAMES, SORT_UNITS, -} from '../../stores/tankopediaPersistent/constants'; -import { $tankopediaSort } from '../../stores/tankopediaSort'; -import { AdMidSectionResponsive } from '../AdMidSectionResponsive'; -import { ExperimentIcon } from '../ExperimentIcon'; +} from '../../../../../stores/tankopediaPersistent/constants'; +import * as TankopediaSort from '../../../../../stores/tankopediaSort'; +import { FilterControl } from '../FilterControl'; +import { NoResults } from '../NoResults'; +import { SearchBar } from '../SearchBar'; +import { SkeletonTankCard } from '../SkeletonTankCard'; +import { TankCard } from '../TankCard'; +import { TankCardWrapper } from '../TankCardWrapper'; import { treeTypeOrder } from './constants'; type TankSearchProps = Omit & { @@ -43,16 +51,16 @@ export const TankSearch = memo( const awaitedTankDefinitions = use(tankDefinitions); const awaitedTanksDefinitionsArray = use(tankDefinitionsArray); const awaitedTankNames = use(tankNames); - const tankFilters = useStore($tankFilters); - const tankopediaSort = useStore($tankopediaSort); + const filters = TankFilters.use(); + const sort = TankopediaSort.use(); const tanksFiltered = useMemo(() => { - if (tankFilters.search === undefined) { + if (filters.search === undefined) { const filtered = awaitedTanksDefinitionsArray.filter((tank) => - filterTank(tankFilters, tank), + filterTank(filters, tank), ); let sorted: TankDefinition[]; - switch (tankopediaSort.by) { + switch (sort.by) { case 'meta.none': sorted = filtered .sort((a, b) => b.tier - a.tier) @@ -362,11 +370,9 @@ export const TankSearch = memo( break; } - return tankopediaSort.direction === 'ascending' - ? sorted - : sorted.reverse(); + return sort.direction === 'ascending' ? sorted : sorted.reverse(); } else { - const searchedRaw = go(tankFilters.search, awaitedTankNames, { + const searchedRaw = go(filters.search, awaitedTankNames, { keys: ['searchableName', 'searchableNameDeburr', 'camouflages'], }); const searchedTanks = searchedRaw.map( @@ -374,19 +380,19 @@ export const TankSearch = memo( ); return searchedTanks; } - }, [tankFilters, tankopediaSort]); + }, [filters, sort]); const [loadedRows, setLoadedRows] = useState(DEFAULT_LOADED_CARDS); const tanks = tanksFiltered.slice(0, loadedRows); useEffect(() => { setLoadedRows(DEFAULT_LOADED_CARDS); - }, [tankFilters, tankopediaSort]); + }, [filters, sort]); return ( - {!tankFilters.search && !tankFilters.searching && ( + {!filters.search && !filters.searching && ( )} @@ -407,18 +413,18 @@ export const TankSearch = memo( )} - {tankopediaSort.by !== 'meta.none' && ( + {sort.by !== 'meta.none' && ( - Sorting by {SORT_NAMES[tankopediaSort.by]} - {SORT_UNITS[tankopediaSort.by] === undefined + Sorting by {SORT_NAMES[sort.by]} + {SORT_UNITS[sort.by] === undefined ? '' - : ` (${SORT_UNITS[tankopediaSort.by]})`} - , {tankopediaSort.direction} + : ` (${SORT_UNITS[sort.by]})`} + , {sort.direction} )} - {tankFilters.testing === 'only' && ( + {filters.testing === 'only' && ( @@ -432,7 +438,7 @@ export const TankSearch = memo( )} - {!tankFilters.searching && ( + {!filters.searching && ( <> {tanks.length > 0 && ( @@ -471,7 +477,7 @@ export const TankSearch = memo( )} - {tankFilters.searching && ( + {filters.searching && ( {times(Math.round(10 + 10 * Math.random()), (index) => ( diff --git a/packages/website/package.json b/packages/website/package.json index 140b37fcb..08c09a1b5 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -26,8 +26,6 @@ "react-promise-suspense": "^0.3.4" }, "devDependencies": { - "@vanilla-extract/vite-plugin": "^4.0.15", - "@types/react": "^18.3.5", - "@types/react-dom": "^18" + "@vanilla-extract/vite-plugin": "^4.0.15" } } diff --git a/packages/website/src/pages/tools/tankopedia/index.astro b/packages/website/src/pages/tools/tankopedia/index.astro index 7cb8efebf..813aed701 100644 --- a/packages/website/src/pages/tools/tankopedia/index.astro +++ b/packages/website/src/pages/tools/tankopedia/index.astro @@ -1,10 +1,7 @@ --- -import { TankSearch } from '../../../components/TankSearch'; import ToolLayout from '../../../layouts/ToolLayout.astro'; --- - - diff --git a/packages/website/src/stores/tankFilters.ts b/packages/website/src/stores/tankFilters.ts index 92f428686..9686dae91 100644 --- a/packages/website/src/stores/tankFilters.ts +++ b/packages/website/src/stores/tankFilters.ts @@ -1,5 +1,6 @@ -import type { TankClass, Tier, TreeType } from '@blitzkit/core'; -import { map } from 'nanostores'; +import { TankClass, Tier, TreeType } from '@blitzkit/core'; +import { create } from 'zustand'; +import { createContextualSafeStore } from '../core/zustand/createContextualSafeStore'; export interface TankFilters { tiers: Tier[]; @@ -11,12 +12,15 @@ export interface TankFilters { searching: boolean; } -export const $tankFilters = map({ - tiers: [], - nations: [], - classes: [], - types: [], - testing: 'include', - search: undefined, - searching: false, -}); +export const { Provider, use, useMutation, useStore } = + createContextualSafeStore(() => + create()(() => ({ + tiers: [], + nations: [], + classes: [], + types: [], + testing: 'include', + search: undefined, + searching: false, + })), + ); diff --git a/packages/website/src/stores/tankopediaSort.ts b/packages/website/src/stores/tankopediaSort.ts index c90413272..6a7d6c6ef 100644 --- a/packages/website/src/stores/tankopediaSort.ts +++ b/packages/website/src/stores/tankopediaSort.ts @@ -1,5 +1,6 @@ -import { map } from 'nanostores'; -import type { +import { create } from 'zustand'; +import { createContextualSafeStore } from '../core/zustand/createContextualSafeStore'; +import { TankopediaSortBy, TankopediaSortDirection, } from './tankopediaPersistent'; @@ -9,7 +10,10 @@ export interface TankopediaSort { direction: TankopediaSortDirection; } -export const $tankopediaSort = map({ - by: 'meta.none', - direction: 'descending', -}); +export const { Provider, use, useMutation, useStore } = + createContextualSafeStore(() => + create()(() => ({ + by: 'meta.none', + direction: 'descending', + })), + );