feat: select all

src/app/tools/tankopedia/components/TankSearch/index.tsx

@@ -1,4 +1,4 @@
-import { Callout, Flex, Text } from '@radix-ui/themes';
+import { Callout, Flex, Link, Text } from '@radix-ui/themes';
 import { go } from 'fuzzysort';
 import { times } from 'lodash';
 import { memo, use, useMemo } from 'react';
@@ -31,9 +31,11 @@ import { treeTypeOrder } from './constants';
 interface TankSearchProps {
   compact?: boolean;
   onSelect?: (tank: TankDefinition) => void;
+  onSelectAll?: (tanks: TankDefinition[]) => void;
 }
 
-export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
+export const TankSearch = memo<TankSearchProps>(
+  ({ compact, onSelect, onSelectAll }) => {
     const awaitedGameDefinitions = use(gameDefinitions);
     const awaitedModelDefinitions = use(modelDefinitions);
     const awaitedTankDefinitions = use(tankDefinitions);
@@ -78,7 +80,8 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
 
           case 'survivability.viewRange':
             sorted = filtered.sort(
-            (a, b) => a.turrets.at(-1)!.viewRange - b.turrets.at(-1)!.viewRange,
+              (a, b) =>
+                a.turrets.at(-1)!.viewRange - b.turrets.at(-1)!.viewRange,
             );
             break;
 
@@ -255,13 +258,11 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
           case 'fire.gunDepression':
             sorted = filtered.sort(
               (a, b) =>
-              awaitedModelDefinitions[a.id].turrets[a.turrets.at(-1)!.id].guns[
+                awaitedModelDefinitions[a.id].turrets[a.turrets.at(-1)!.id]
-                a.turrets.at(-1)!.guns.at(-1)!.id
+                  .guns[a.turrets.at(-1)!.guns.at(-1)!.id].pitch.max +
-              ].pitch.max +
                 (awaitedModelDefinitions[a.id].turretRotation?.pitch ?? 0) -
-              awaitedModelDefinitions[b.id].turrets[b.turrets.at(-1)!.id].guns[
+                awaitedModelDefinitions[b.id].turrets[b.turrets.at(-1)!.id]
-                b.turrets.at(-1)!.guns.at(-1)!.id
+                  .guns[b.turrets.at(-1)!.guns.at(-1)!.id].pitch.max -
-              ].pitch.max -
                 (awaitedModelDefinitions[b.id].turretRotation?.pitch ?? 0),
             );
             break;
@@ -269,19 +270,19 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
           case 'fire.gunElevation':
             sorted = filtered.sort(
               (a, b) =>
-              awaitedModelDefinitions[b.id].turrets[b.turrets.at(-1)!.id].guns[
+                awaitedModelDefinitions[b.id].turrets[b.turrets.at(-1)!.id]
-                b.turrets.at(-1)!.guns.at(-1)!.id
+                  .guns[b.turrets.at(-1)!.guns.at(-1)!.id].pitch.min +
-              ].pitch.min +
                 (awaitedModelDefinitions[b.id].turretRotation?.pitch ?? 0) -
-              awaitedModelDefinitions[a.id].turrets[a.turrets.at(-1)!.id].guns[
+                awaitedModelDefinitions[a.id].turrets[a.turrets.at(-1)!.id]
-                a.turrets.at(-1)!.guns.at(-1)!.id
+                  .guns[a.turrets.at(-1)!.guns.at(-1)!.id].pitch.min -
-              ].pitch.min -
                 (awaitedModelDefinitions[a.id].turretRotation?.pitch ?? 0),
             );
             break;
 
           case 'maneuverability.forwardsSpeed':
-          sorted = filtered.sort((a, b) => a.speed.forwards - b.speed.forwards);
+            sorted = filtered.sort(
+              (a, b) => a.speed.forwards - b.speed.forwards,
+            );
             break;
 
           case 'maneuverability.backwardsSpeed':
@@ -338,7 +339,9 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
             break;
         }
 
-      return filters.sort.direction === 'ascending' ? sorted : sorted.reverse();
+        return filters.sort.direction === 'ascending'
+          ? sorted
+          : sorted.reverse();
       } else {
         const searchedRaw = go(filters.search, awaitedTankNames, {
           key: 'combined',
@@ -359,8 +362,15 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
           <FilterControl compact={compact} />
         )}
 
+        {(filters.sort.by !== 'meta.none' || onSelectAll) && (
+          <Flex
+            py="2"
+            mt="2"
+            direction="column"
+            align="center"
+            justify="center"
+          >
             {filters.sort.by !== 'meta.none' && (
-        <Flex py="2" mt="2" justify="center">
               <Text color="gray">
                 Sorting by {SORT_NAMES[filters.sort.by]}
                 {SORT_UNITS[filters.sort.by] === undefined
@@ -368,6 +378,17 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
                   : ` (${SORT_UNITS[filters.sort.by]})`}
                 , {filters.sort.direction}
               </Text>
+            )}
+
+            {onSelectAll && (
+              <Link
+                underline="always"
+                href="#"
+                onClick={() => onSelectAll(tanks)}
+              >
+                Select all {tanks.length} tanks
+              </Link>
+            )}
           </Flex>
         )}
 
@@ -378,8 +399,8 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
                 <ExperimentIcon style={{ width: '1em', height: '1em' }} />
               </Callout.Icon>
               <Callout.Text>
-              Tanks in testing are subject to change and many not represent the
+                Tanks in testing are subject to change and many not represent
-              final product.
+                the final product.
               </Callout.Text>
             </Callout.Root>
           </Flex>
@@ -408,4 +429,5 @@ export const TankSearch = memo<TankSearchProps>(({ compact, onSelect }) => {
         )}
       </Flex>
     );
-});
+  },
+);