Merge pull request #92 from dragoni7/sort-filtered-permutations

Sort filtered permutations
dragoni7 · Sep 17, 2024 · 2511abc · 2511abc
2 parents f1b0350 + aeec534
commit 2511abc
Show file tree

Hide file tree

Showing 8 changed files with 354 additions and 308 deletions.
diff --git a/src/app/routes/Dashboard.tsx b/src/app/routes/Dashboard.tsx
@@ -18,10 +18,11 @@ import {
   DecodedLoadoutData,
   FilteredPermutation,
   FragmentStatModifications,
+  StatModifiers,
   StatName,
   SubclassConfig,
 } from '../../types/d2l-types';
-import StatsTable from '../../features/armor-optimization/StatsTable';
+import PermutationsList from '../../features/armor-optimization/PermutationsList';
 import HeaderComponent from '../../components/HeaderComponent';
 import { db } from '../../store/db';
 import {
@@ -53,6 +54,8 @@ import { updateProfileCharacters } from '../../store/ProfileReducer';
 import { getProfileData } from '../../util/profile-characters';
 import RefreshCharacters from '../../components/RefreshCharacters';
 import LogoutButton from '../../features/auth/LogoutButton';
+import useArtificeMods from '../../hooks/use-artifice-mods';
+import useStatMods from '../../hooks/use-stat-mods';
 
 const DashboardContent = styled(Grid)(({ theme }) => ({
   backgroundImage: `url(${greyBackground})`,
@@ -88,6 +91,9 @@ export const Dashboard: React.FC = () => {
   const [showAbilitiesModification, setShowAbilitiesModification] = useState(false);
   const [sharedLoadoutDto, setSharedLoadoutDto] = useState<SharedLoadoutDto | undefined>(undefined);
 
+  const statMods = useStatMods();
+  const artificeMods = useArtificeMods();
+
   const fragmentStatModifications = useMemo(() => {
     return fragments.reduce(
       (acc, fragment) => {
@@ -336,23 +342,24 @@ export const Dashboard: React.FC = () => {
 
   useEffect(() => {
     if (filteredPermutations && sharedLoadoutDto) {
-      openLoadoutCustomization(filteredPermutations[0]).catch(console.error);
+      openLoadoutCustomization(filteredPermutations[0]);
       localStorage.removeItem('lastShared');
     }
   }, [filteredPermutations, sharedLoadoutDto]);
 
-  async function openLoadoutCustomization(filteredPermutation: FilteredPermutation) {
+  function openLoadoutCustomization(filteredPermutation: FilteredPermutation) {
     dispatch(resetLoadoutArmorMods());
     dispatch(updateLoadoutArmor(filteredPermutation.permutation));
+    const allStatMods = statMods.concat(artificeMods);
     let requiredMods: { mod: ManifestArmorStatMod; equipped: boolean }[] = [];
 
     for (const [stat, costs] of Object.entries(filteredPermutation.modsArray)) {
       for (const cost of costs) {
-        const mod = await db.manifestArmorStatModDef
-          .where(stat + 'Mod')
-          .equals(cost)
-          .first();
-        if (mod !== undefined) requiredMods.push({ mod: mod, equipped: false });
+        const matchedStatMod = allStatMods.find(
+          (mod) => mod[(stat + 'Mod') as StatModifiers] === cost
+        );
+        if (matchedStatMod !== undefined)
+          requiredMods.push({ mod: matchedStatMod, equipped: false });
       }
     }
 
@@ -430,7 +437,7 @@ export const Dashboard: React.FC = () => {
             sx={{ width: '100vw', height: '100vh', overflowY: 'auto', paddingTop: '130px' }}
           >
             <DashboardContent item container md={12}>
-              <Grid item container direction="column" md={4.5} spacing={6} sx={{ marginTop: '3%' }}>
+              <Grid item container direction="column" md={4.5} spacing={6} sx={{ marginTop: '2%' }}>
                 <Grid item>
                   <SingleDiamondButton
                     subclasses={subclasses}
@@ -451,7 +458,7 @@ export const Dashboard: React.FC = () => {
                 direction="column"
                 justifyContent={'flex-start'}
                 alignItems={'center'}
-                sx={{ marginTop: '3%' }}
+                sx={{ marginTop: '1%' }}
               >
                 <Grid item>
                   <ExoticSelector
@@ -463,11 +470,11 @@ export const Dashboard: React.FC = () => {
                   <StatModifications />
                 </Grid>
               </Grid>
-              <Grid item md={4.5} sx={{ marginTop: '3%' }}>
+              <Grid item md={4.5} sx={{ marginTop: '1%' }}>
                 {generatingPermutations ? (
                   <p>Loading...</p>
                 ) : filteredPermutations ? (
-                  <StatsTable
+                  <PermutationsList
                     permutations={filteredPermutations}
                     onPermutationClick={openLoadoutCustomization}
                   />

diff --git a/src/features/armor-mods/components/ModCustomization.tsx b/src/features/armor-mods/components/ModCustomization.tsx
@@ -1,8 +1,8 @@
 import { RootState, store } from '../../../store';
 import ArmorConfig from './ArmorConfig';
 import { Grid, Stack, styled, Typography } from '@mui/material';
-import useArtificeMods from '../hooks/use-artifice-mods';
-import useStatMods from '../hooks/use-stat-mods';
+import useArtificeMods from '../../../hooks/use-artifice-mods';
+import useStatMods from '../../../hooks/use-stat-mods';
 import RequiredMod from './RequiredMod';
 import { useSelector } from 'react-redux';
 import { ManifestArmorMod, ManifestArmorStatMod } from '../../../types/manifest-types';