From 4e8febd49112d2d5e661cf37e5dd72ea0c604a15 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 12:53:11 -0700
Subject: [PATCH 01/12] Began refactoring loadout equipping page

---
 .../loadouts/components/EquipLoadout.tsx      | 46 +++++----
 src/features/loadouts/types/index.ts          |  2 +-
 src/features/loadouts/util/armorEquipper.ts   | 55 ++++++-----
 src/features/loadouts/util/equipper.ts        | 17 +---
 .../loadouts/util/subclassEquipper.ts         | 97 +++++++++++++------
 5 files changed, 132 insertions(+), 85 deletions(-)

diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index 4b21625..2ebf26e 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -6,7 +6,7 @@ import ArmorIcon from '../../../components/ArmorIcon';
 import { CheckRounded, Close } from '@mui/icons-material';
 import { STATUS } from '../constants';
 import { ArmorEquipper } from '../util/armorEquipper';
-import { DestinyArmor, Plug, SubclassConfig } from '../../../types/d2l-types';
+import { DestinyArmor, SubclassConfig } from '../../../types/d2l-types';
 import React from 'react';
 import { SubclassEquipper } from '../util/subclassEquipper';
 import { ManifestArmorStatMod, ManifestPlug } from '../../../types/manifest-types';
@@ -16,7 +16,7 @@ const EquipLoadout: React.FC = () => {
   const [processing, setProcessing] = useState<any[]>([]);
   const [equipStep, setEquipStep] = useState<string>('');
   const [open, setOpen] = useState<boolean>(false);
-  const [results, setResults] = useState<EquipResult[]>([]);
+  const [results, setResults] = useState<EquipResult[][]>([]);
   const [equipping, setEquipping] = useState<boolean>(false);
 
   const onEquipLoadout = async () => {
@@ -36,7 +36,7 @@ const EquipLoadout: React.FC = () => {
       setEquipping(true);
       const armorEquipper = new ArmorEquipper();
       const tempEquipped: any[] = [];
-      const tempResults: EquipResult[] = [];
+      const tempResults: EquipResult[][] = [];
 
       await armorEquipper.setCharacter(loadout.characterId);
 
@@ -84,7 +84,7 @@ const EquipLoadout: React.FC = () => {
   const processArmor = async (
     tempEquipped: DestinyArmor[],
     equipper: ArmorEquipper,
-    tempResults: EquipResult[],
+    tempResults: EquipResult[][],
     armor: DestinyArmor,
     armorMods: { [key: number]: ManifestPlug | ManifestArmorStatMod }
   ) => {
@@ -101,7 +101,7 @@ const EquipLoadout: React.FC = () => {
   const processSubclass = async (
     tempEquipped: any[],
     equipper: SubclassEquipper,
-    tempResults: EquipResult[],
+    tempResults: EquipResult[][],
     subclassConfig: SubclassConfig
   ) => {
     tempEquipped.push(subclassConfig.subclass);
@@ -188,7 +188,7 @@ const EquipLoadout: React.FC = () => {
                         <Tooltip title={'Equipped'}>
                           <Badge
                             badgeContent={
-                              results[index].operationsStatus[0] === 'Success' ? (
+                              results[index][0].operationsStatus === 'Success' ? (
                                 <CheckRounded sx={{ fontSize: 50, color: 'green' }} />
                               ) : (
                                 <Close sx={{ fontSize: 50, color: 'red' }} />
@@ -201,19 +201,25 @@ const EquipLoadout: React.FC = () => {
                         </Tooltip>
                       </Grid>
                       <Grid item md={9}>
-                        {results[index].status === STATUS.SUCCESS
-                          ? 'Success'
-                          : results[index]?.operationsStatus
-                              .slice(1)
-                              .map((error) => (
-                                <Tooltip title={error}>
-                                  {error === 'Success' ? (
-                                    <CheckRounded sx={{ fontSize: 56, color: 'green' }} />
-                                  ) : (
-                                    <Close sx={{ fontSize: 56, color: 'red' }} />
-                                  )}
-                                </Tooltip>
-                              ))}
+                        {results[index][0].status === STATUS.SUCCESS ? (
+                          <h3 style={{ color: 'green' }}>Mods Successfully Inserted</h3>
+                        ) : (
+                          results[index].slice(1).map((result) => (
+                            <Tooltip title={result.operationsStatus}>
+                              {result.status === STATUS.SUCCESS ? (
+                                <>
+                                  <CheckRounded sx={{ fontSize: 56, color: 'green' }} />
+                                  {result.subject.name}
+                                </>
+                              ) : (
+                                <>
+                                  <Close sx={{ fontSize: 56, color: 'red' }} />
+                                  {result.subject.name}
+                                </>
+                              )}
+                            </Tooltip>
+                          ))
+                        )}
                       </Grid>
                     </Fragment>
                   ) : (
@@ -236,7 +242,7 @@ const EquipLoadout: React.FC = () => {
               ) : (
                 <Fragment>
                   <Grid item md={12} textAlign="center">
-                    {equipStep}
+                    <h3>{equipStep}</h3>
                   </Grid>
                   <Grid item md={3} textAlign="center">
                     <Button
diff --git a/src/features/loadouts/types/index.ts b/src/features/loadouts/types/index.ts
index 89ce8c8..2d9134e 100644
--- a/src/features/loadouts/types/index.ts
+++ b/src/features/loadouts/types/index.ts
@@ -4,6 +4,6 @@ export type EquipStatus = STATUS.SUCCESS | STATUS.FAIL;
 
 export type EquipResult = {
   status: EquipStatus;
-  operationsStatus: string[];
+  operationsStatus: string;
   subject: any;
 };
diff --git a/src/features/loadouts/util/armorEquipper.ts b/src/features/loadouts/util/armorEquipper.ts
index 4d5efc8..783909e 100644
--- a/src/features/loadouts/util/armorEquipper.ts
+++ b/src/features/loadouts/util/armorEquipper.ts
@@ -5,7 +5,7 @@ import {
   insertSocketPlugFreeRequest,
   transferItemRequest,
 } from '../../../lib/bungie_api/requests';
-import { DestinyArmor, Plug } from '../../../types/d2l-types';
+import { DestinyArmor } from '../../../types/d2l-types';
 import { ManifestPlug, ManifestArmorStatMod } from '../../../types/manifest-types';
 import { STATUS } from '../constants';
 import { Equipper } from './equipper';
@@ -65,7 +65,11 @@ export class ArmorEquipper extends Equipper {
   }
 
   public async equipArmor(armor: DestinyArmor): Promise<void> {
-    this.result.subject = armor;
+    const result = {
+      status: STATUS.SUCCESS,
+      operationsStatus: '',
+      subject: armor,
+    };
 
     // if armor not in character inventory, transfer first
     if (armor.location !== ITEM_LOCATIONS.CHARACTER_INVENTORY) {
@@ -80,8 +84,8 @@ export class ArmorEquipper extends Equipper {
           this.characterId
         ).catch((error) => {
           if (error.response) {
-            this.result.status = STATUS.FAIL;
-            this.result.operationsStatus[0] = error.response.data.ErrorStatus.replace(
+            result.status = STATUS.FAIL;
+            result.operationsStatus = error.response.data.ErrorStatus.replace(
               /([a-z])([A-Z])/g,
               '$1 $2'
             );
@@ -98,8 +102,8 @@ export class ArmorEquipper extends Equipper {
         this.characterId
       ).catch((error) => {
         if (error.response) {
-          this.result.status = STATUS.FAIL;
-          this.result.operationsStatus[0] = error.response.data.ErrorStatus.replace(
+          result.status = STATUS.FAIL;
+          result.operationsStatus = error.response.data.ErrorStatus.replace(
             /([a-z])([A-Z])/g,
             '$1 $2'
           );
@@ -110,8 +114,8 @@ export class ArmorEquipper extends Equipper {
     // equip
     const response = await equipItemRequest(armor.instanceHash, this.characterId).catch((error) => {
       if (error.response) {
-        this.result.status = STATUS.FAIL;
-        this.result.operationsStatus[0] = error.response.data.ErrorStatus.replace(
+        result.status = STATUS.FAIL;
+        result.operationsStatus = error.response.data.ErrorStatus.replace(
           /([a-z])([A-Z])/g,
           '$1 $2'
         );
@@ -119,31 +123,39 @@ export class ArmorEquipper extends Equipper {
     });
 
     if (response)
-      this.result.operationsStatus[0] = response.data.ErrorStatus.replace(
-        /([a-z])([A-Z])/g,
-        '$1 $2'
-      );
+      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+    this.result.push(result);
   }
 
   public async equipArmorMods(mods: {
     [key: number]: ManifestPlug | ManifestArmorStatMod;
   }): Promise<void> {
-    if (this.result.subject) {
+    const armor = this.result[0].subject;
+
+    if (armor) {
       for (let i = 0; i < 5; i++) {
-        if (i === 4 && this.result.subject.artifice === false) continue;
+        const result = {
+          status: STATUS.SUCCESS,
+          operationsStatus: '',
+          subject: mods[i],
+        };
+
+        if (i === 4 && armor.artifice === false) continue;
 
         const response = await insertSocketPlugFreeRequest(
-          this.result.subject.instanceHash,
+          armor.instanceHash,
           {
             plugItemHash: String(mods[i].itemHash),
             socketArrayType: 0,
-            socketIndex: i === 4 && this.result.subject.artifice === true ? 11 : i,
+            socketIndex: i === 4 && armor.artifice === true ? 11 : i,
           },
           this.characterId
         ).catch((error) => {
           if (error.response) {
-            this.result.status = STATUS.FAIL;
-            this.result.operationsStatus[i + 1] = error.response.data.ErrorStatus.replace(
+            result.status = error.response.data.ErrorCode === 1679 ? STATUS.SUCCESS : STATUS.FAIL;
+            this.result[0].status = result.status;
+            result.operationsStatus = error.response.data.ErrorStatus.replace(
               /([a-z])([A-Z])/g,
               '$1 $2'
             );
@@ -151,10 +163,9 @@ export class ArmorEquipper extends Equipper {
         });
 
         if (response)
-          this.result.operationsStatus[i + 1] = response?.data.ErrorStatus.replace(
-            /([a-z])([A-Z])/g,
-            '$1 $2'
-          );
+          result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+        this.result.push(result);
       }
     }
   }
diff --git a/src/features/loadouts/util/equipper.ts b/src/features/loadouts/util/equipper.ts
index ed66ac2..9ef29aa 100644
--- a/src/features/loadouts/util/equipper.ts
+++ b/src/features/loadouts/util/equipper.ts
@@ -1,35 +1,26 @@
-import { STATUS } from '../constants';
 import { EquipResult } from '../types';
 
 export abstract class Equipper {
   protected characterId: number;
 
-  protected result: EquipResult;
+  protected result: EquipResult[];
 
   public constructor() {
     this.characterId = -1;
-    this.result = {
-      status: STATUS.SUCCESS,
-      operationsStatus: [],
-      subject: undefined,
-    };
+    this.result = [];
   }
 
   public setCharacter(characterId: number): void {
     this.characterId = characterId;
   }
 
-  public getResult(): EquipResult {
+  public getResult(): EquipResult[] {
     const temp = this.result;
     this.reset();
     return temp;
   }
 
   public reset(): void {
-    this.result = {
-      status: STATUS.SUCCESS,
-      operationsStatus: [],
-      subject: undefined,
-    };
+    this.result = [];
   }
 }
diff --git a/src/features/loadouts/util/subclassEquipper.ts b/src/features/loadouts/util/subclassEquipper.ts
index 899d194..5dd3435 100644
--- a/src/features/loadouts/util/subclassEquipper.ts
+++ b/src/features/loadouts/util/subclassEquipper.ts
@@ -1,18 +1,22 @@
 import { equipItemRequest, insertSocketPlugFreeRequest } from '../../../lib/bungie_api/requests';
-import { Plug, Subclass } from '../../../types/d2l-types';
+import { Subclass } from '../../../types/d2l-types';
 import { ManifestAspect, ManifestPlug, ManifestStatPlug } from '../../../types/manifest-types';
 import { STATUS } from '../constants';
 import { Equipper } from './equipper';
 
 export class SubclassEquipper extends Equipper {
   public async equipSubclass(subclass: Subclass) {
-    this.result.subject = subclass;
+    const result = {
+      status: STATUS.SUCCESS,
+      operationsStatus: '',
+      subject: subclass,
+    };
 
     const response = await equipItemRequest(subclass.instanceId, this.characterId).catch(
       (error) => {
         if (error.response) {
-          this.result.status = STATUS.FAIL;
-          this.result.operationsStatus[0] = error.response.data.ErrorStatus.replace(
+          result.status = STATUS.FAIL;
+          result.operationsStatus = error.response.data.ErrorStatus.replace(
             /([a-z])([A-Z])/g,
             '$1 $2'
           );
@@ -21,15 +25,24 @@ export class SubclassEquipper extends Equipper {
     );
 
     if (response)
-      this.result.operationsStatus[0] = response.data.ErrorStatus.replace(
-        /([a-z])([A-Z])/g,
-        '$1 $2'
-      );
+      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+    this.result.push(result);
   }
 
   public async equipSubclassAbility(ability: ManifestPlug, socketArrayIndex: number) {
+    const subclass = this.result[0].subject;
+
+    if (!subclass) return;
+
+    const result = {
+      status: STATUS.SUCCESS,
+      operationsStatus: '',
+      subject: ability,
+    };
+
     const response = await insertSocketPlugFreeRequest(
-      this.result.subject.instanceId,
+      subclass.instanceId,
       {
         plugItemHash: String(ability.itemHash),
         socketArrayType: 0,
@@ -38,22 +51,34 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        this.result.status = STATUS.FAIL;
-        this.result.operationsStatus.push(
-          error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
+        result.status = STATUS.FAIL;
+        this.result[0].status = result.status;
+        result.operationsStatus = error.response.data.ErrorStatus.replace(
+          /([a-z])([A-Z])/g,
+          '$1 $2'
         );
       }
     });
 
     if (response)
-      this.result.operationsStatus.push(
-        response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
-      );
+      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+    this.result.push(result);
   }
 
   public async equipSubclassAspect(aspect: ManifestAspect, socketArrayIndex: number) {
+    const subclass = this.result[0].subject;
+
+    if (!subclass) return;
+
+    const result = {
+      status: STATUS.SUCCESS,
+      operationsStatus: '',
+      subject: aspect,
+    };
+
     const response = await insertSocketPlugFreeRequest(
-      this.result.subject.instanceId,
+      subclass.instanceId,
       {
         plugItemHash: String(aspect.itemHash),
         socketArrayType: 0,
@@ -62,22 +87,34 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        this.result.status = STATUS.FAIL;
-        this.result.operationsStatus.push(
-          error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
+        result.status = STATUS.FAIL;
+        this.result[0].status = result.status;
+        result.operationsStatus = error.response.data.ErrorStatus?.replace(
+          /([a-z])([A-Z])/g,
+          '$1 $2'
         );
       }
     });
 
     if (response)
-      this.result.operationsStatus.push(
-        response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
-      );
+      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+    this.result.push(result);
   }
 
   public async equipSubclassFragments(fragment: ManifestStatPlug, socketArrayIndex: number) {
+    const subclass = this.result[0].subject;
+
+    if (!subclass) return;
+
+    const result = {
+      status: STATUS.SUCCESS,
+      operationsStatus: '',
+      subject: fragment,
+    };
+
     const response = await insertSocketPlugFreeRequest(
-      this.result.subject.instanceId,
+      subclass.instanceId,
       {
         plugItemHash: String(fragment.itemHash),
         socketArrayType: 0,
@@ -86,16 +123,18 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        this.result.status = STATUS.FAIL;
-        this.result.operationsStatus.push(
-          error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
+        result.status = STATUS.FAIL;
+        this.result[0].status = result.status;
+        result.operationsStatus = error.response.data.ErrorStatus?.replace(
+          /([a-z])([A-Z])/g,
+          '$1 $2'
         );
       }
     });
 
     if (response)
-      this.result.operationsStatus.push(
-        response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2')
-      );
+      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+    this.result.push(result);
   }
 }

From e9f7a79669009358f45c5d51a95262d26f82f9c4 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 13:50:54 -0700
Subject: [PATCH 02/12] update dependencies

---
 package-lock.json | 76 +++++++++++++++++++++++++++--------------------
 1 file changed, 44 insertions(+), 32 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 74a8690..dcef099 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1945,9 +1945,9 @@
       "peer": true
     },
     "node_modules/@babel/runtime": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.0.tgz",
-      "integrity": "sha512-7dRy4DwXwtzBrPbZflqxnvfxLF8kdZXPkhymtDeFoFqE6ldzjQFgYTtYIFARcLEYDrqfBfYcZt1WqFxRoyC9Rw==",
+      "version": "7.25.4",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.4.tgz",
+      "integrity": "sha512-DSgLeL/FNcpXuzav5wfYvHCGvynXkJbn3Zvc3823AEe9nPwW9IK4UoCSS5yGymmQzN0pCPvivtgS6/8U2kkm1w==",
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -2561,6 +2561,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/@eslint/eslintrc/node_modules/type-fest": {
+      "version": "0.20.2",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
+      "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@eslint/js": {
       "version": "8.57.0",
       "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz",
@@ -5251,9 +5263,9 @@
       }
     },
     "node_modules/axios": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.4.tgz",
-      "integrity": "sha512-DukmaFRnY6AzAALSH4J2M3k6PkaC+MfaAGdEERRWcC9q3/TWQwLpHR8ZRLKTdQ3aBDL64EdluRDjJqKw+BPZEw==",
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.5.tgz",
+      "integrity": "sha512-fZu86yCo+svH3uqJ/yTdQ0QHpQu5oL+/QE+QPSv6BZSkDAoky9vytxp7u5qk83OJFS3kEBcesWni9WTZAv3tSw==",
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.0",
@@ -6546,9 +6558,9 @@
       }
     },
     "node_modules/eslint-plugin-react-refresh": {
-      "version": "0.4.10",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.10.tgz",
-      "integrity": "sha512-I39s6G9We7ZxbCRxTTM5XX4KJV2cfWhFbHF4kTuL0ygdEVdQXtCNGqUQ43sBOCbTC/N6dEZXoQKFHr8gp1VHrQ==",
+      "version": "0.4.11",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.11.tgz",
+      "integrity": "sha512-wrAKxMbVr8qhXTtIKfXqAn5SAtRZt0aXxe5P23Fh4pUAdC6XEsybGLB8P0PI4j1yYqOgUEUlzKAGDfo7rJOjcw==",
       "dev": true,
       "peerDependencies": {
         "eslint": ">=7"
@@ -6696,6 +6708,18 @@
         "node": ">=8"
       }
     },
+    "node_modules/eslint/node_modules/type-fest": {
+      "version": "0.20.2",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
+      "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/espree": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
@@ -7067,9 +7091,9 @@
       }
     },
     "node_modules/framer-motion": {
-      "version": "11.3.29",
-      "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.3.29.tgz",
-      "integrity": "sha512-uyDuUOeOElJEA3kbkbyoTNEf75Jih1EUg0ouLKYMlGDdt/LaJPmO+FyOGAGxM2HwKhHcAoKFNveR5A8peb7yhw==",
+      "version": "11.3.30",
+      "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.3.30.tgz",
+      "integrity": "sha512-9VmqGe9OIjfMoCcs+ZsKXlv6JaG5QagKX2F1uSbkG3Z33wgjnz60Kw+CngC1M49rDYau+Y9aL+8jGagAwrbVyw==",
       "dependencies": {
         "tslib": "^2.4.0"
       },
@@ -11776,15 +11800,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/stacktrace-parser/node_modules/type-fest": {
-      "version": "0.7.1",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.7.1.tgz",
-      "integrity": "sha512-Ne2YiiGN8bmrmJJEuTWTLJR32nh/JdL1+PSicowtNb0WFpn59GK8/lfD61bVtzguz7b3PBt74nxpv/Pw5po5Rg==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/statuses": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
@@ -12160,9 +12175,9 @@
       "peer": true
     },
     "node_modules/tslib": {
-      "version": "2.6.3",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
-      "integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ=="
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.7.0.tgz",
+      "integrity": "sha512-gLXCKdN1/j47AiHiOkJN69hJmcbGTHI0ImLmbYLHykhgeN0jVGola9yVjFgzCUklsZQMW55o+dW7IXv3RCXDzA=="
     },
     "node_modules/type-check": {
       "version": "0.4.0",
@@ -12186,15 +12201,12 @@
       }
     },
     "node_modules/type-fest": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
-      "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
-      "dev": true,
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.7.1.tgz",
+      "integrity": "sha512-Ne2YiiGN8bmrmJJEuTWTLJR32nh/JdL1+PSicowtNb0WFpn59GK8/lfD61bVtzguz7b3PBt74nxpv/Pw5po5Rg==",
+      "peer": true,
       "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "node": ">=8"
       }
     },
     "node_modules/typed-array-buffer": {

From d7444ca5da6a0d7e3c31ebb27704f9ee37a3a96d Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 14:00:35 -0700
Subject: [PATCH 03/12] Fixed casing issues

---
 src/app/routes/Dashboard.tsx                    | 2 +-
 src/features/armor-optimization/NumberBoxes.tsx | 2 +-
 src/features/armor-optimization/StatsTable.tsx  | 2 +-
 src/lib/bungie_api/Constants.ts                 | 1 -
 4 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/app/routes/Dashboard.tsx b/src/app/routes/Dashboard.tsx
index 153e2aa..c331f65 100644
--- a/src/app/routes/Dashboard.tsx
+++ b/src/app/routes/Dashboard.tsx
@@ -20,7 +20,7 @@ import ArmorCustomization from '../../features/armor/components/ArmorCustomizati
 import { resetLoadout, updateLoadoutCharacter, updateSubclass } from '../../store/LoadoutReducer';
 import { ManifestSubclass } from '../../types/manifest-types';
 import SubclassCustomizationWrapper from '../../features/subclass/SubclassCustomizationWrapper';
-import { updateManifest } from '../../lib/bungie_api/Manifest';
+import { updateManifest } from '../../lib/bungie_api/manifest';
 
 const PageContainer = styled('div')({
   display: 'flex',
diff --git a/src/features/armor-optimization/NumberBoxes.tsx b/src/features/armor-optimization/NumberBoxes.tsx
index b614c6b..57c10e4 100644
--- a/src/features/armor-optimization/NumberBoxes.tsx
+++ b/src/features/armor-optimization/NumberBoxes.tsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { styled } from '@mui/material/styles';
 import { Box, Paper, Grid, ButtonBase } from '@mui/material';
-import { STATS } from '../../lib/bungie_api/Constants';
+import { STATS } from '../../lib/bungie_api/constants';
 
 const ContainerWithBorder = styled(Paper)(({ theme }) => ({
   border: `1px solid ${theme.palette.divider}`,
diff --git a/src/features/armor-optimization/StatsTable.tsx b/src/features/armor-optimization/StatsTable.tsx
index 706369e..4845842 100644
--- a/src/features/armor-optimization/StatsTable.tsx
+++ b/src/features/armor-optimization/StatsTable.tsx
@@ -11,7 +11,7 @@ import {
   updateRequiredStatMods,
 } from '../../store/LoadoutReducer';
 import ArmorIcon from '../../components/ArmorIcon';
-import { STAT_MOD_HASHES, STATS } from '../../lib/bungie_api/Constants';
+import { STAT_MOD_HASHES, STATS } from '../../lib/bungie_api/constants';
 import { db } from '../../store/db';
 import { ManifestArmorStatMod } from '../../types/manifest-types';
 
diff --git a/src/lib/bungie_api/Constants.ts b/src/lib/bungie_api/Constants.ts
index ed370c4..4c41821 100644
--- a/src/lib/bungie_api/Constants.ts
+++ b/src/lib/bungie_api/Constants.ts
@@ -1,4 +1,3 @@
-import { Stats } from 'fs';
 import { ManifestPlug, ManifestAspect, ManifestStatPlug } from '../../types/manifest-types';
 
 export enum API_CREDENTIALS {

From 593b6033dcb85fa24dc83afc9bac672c822f0f80 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 17:26:41 -0700
Subject: [PATCH 04/12] Fix type errors

---
 .../armor/components/LoadoutArmor.tsx         |  3 +-
 .../loadouts/components/EquipLoadout.tsx      | 35 +++++-----
 src/features/loadouts/util/armorEquipper.ts   |  7 +-
 .../loadouts/util/subclassEquipper.ts         | 13 +++-
 src/features/profile/destiny-profile.ts       | 50 ++++++++++++++
 src/lib/bungie_api/Constants.ts               |  1 +
 src/store/LoadoutReducer.tsx                  | 69 +++++++++++++++----
 7 files changed, 138 insertions(+), 40 deletions(-)

diff --git a/src/features/armor/components/LoadoutArmor.tsx b/src/features/armor/components/LoadoutArmor.tsx
index ab0b466..49fe22e 100644
--- a/src/features/armor/components/LoadoutArmor.tsx
+++ b/src/features/armor/components/LoadoutArmor.tsx
@@ -68,9 +68,10 @@ const LoadoutArmor: React.FC = () => {
             <Box width={81} height={81}>
               Required Mods:
             </Box>
-            {requiredMods.map((mod) => (
+            {requiredMods.map((mod, index) => (
               <Box
                 className="armor-mod-slot"
+                key={index}
                 style={{
                   backgroundImage: `url(${mod.icon})`,
                 }}
diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index 2ebf26e..d678e7a 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -201,25 +201,22 @@ const EquipLoadout: React.FC = () => {
                         </Tooltip>
                       </Grid>
                       <Grid item md={9}>
-                        {results[index][0].status === STATUS.SUCCESS ? (
-                          <h3 style={{ color: 'green' }}>Mods Successfully Inserted</h3>
-                        ) : (
-                          results[index].slice(1).map((result) => (
-                            <Tooltip title={result.operationsStatus}>
-                              {result.status === STATUS.SUCCESS ? (
-                                <>
-                                  <CheckRounded sx={{ fontSize: 56, color: 'green' }} />
-                                  {result.subject.name}
-                                </>
-                              ) : (
-                                <>
-                                  <Close sx={{ fontSize: 56, color: 'red' }} />
-                                  {result.subject.name}
-                                </>
-                              )}
-                            </Tooltip>
-                          ))
-                        )}
+                        {results[index].slice(1).map((result) => (
+                          <Tooltip title={result.operationsStatus}>
+                            <Badge
+                              badgeContent={
+                                results[index][0].status === STATUS.SUCCESS ? (
+                                  <CheckRounded sx={{ fontSize: 50, color: 'green' }} />
+                                ) : (
+                                  <Close sx={{ fontSize: 50, color: 'red' }} />
+                                )
+                              }
+                              anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
+                            >
+                              <img src={result.subject.icon} />
+                            </Badge>
+                          </Tooltip>
+                        ))}
                       </Grid>
                     </Fragment>
                   ) : (
diff --git a/src/features/loadouts/util/armorEquipper.ts b/src/features/loadouts/util/armorEquipper.ts
index 783909e..b30ad47 100644
--- a/src/features/loadouts/util/armorEquipper.ts
+++ b/src/features/loadouts/util/armorEquipper.ts
@@ -1,4 +1,4 @@
-import { BUCKET_HASH, ITEM_LOCATIONS } from '../../../lib/bungie_api/constants';
+import { BUCKET_HASH, ERRORS, ITEM_LOCATIONS } from '../../../lib/bungie_api/constants';
 import {
   equipItemRequest,
   getCharacterInventoryRequest,
@@ -153,7 +153,10 @@ export class ArmorEquipper extends Equipper {
           this.characterId
         ).catch((error) => {
           if (error.response) {
-            result.status = error.response.data.ErrorCode === 1679 ? STATUS.SUCCESS : STATUS.FAIL;
+            result.status =
+              error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
+                ? STATUS.SUCCESS
+                : STATUS.FAIL;
             this.result[0].status = result.status;
             result.operationsStatus = error.response.data.ErrorStatus.replace(
               /([a-z])([A-Z])/g,
diff --git a/src/features/loadouts/util/subclassEquipper.ts b/src/features/loadouts/util/subclassEquipper.ts
index 5dd3435..fc49273 100644
--- a/src/features/loadouts/util/subclassEquipper.ts
+++ b/src/features/loadouts/util/subclassEquipper.ts
@@ -1,3 +1,4 @@
+import { ERRORS } from '../../../lib/bungie_api/constants';
 import { equipItemRequest, insertSocketPlugFreeRequest } from '../../../lib/bungie_api/requests';
 import { Subclass } from '../../../types/d2l-types';
 import { ManifestAspect, ManifestPlug, ManifestStatPlug } from '../../../types/manifest-types';
@@ -51,7 +52,9 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        result.status = STATUS.FAIL;
+        error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
+          ? STATUS.SUCCESS
+          : STATUS.FAIL;
         this.result[0].status = result.status;
         result.operationsStatus = error.response.data.ErrorStatus.replace(
           /([a-z])([A-Z])/g,
@@ -87,7 +90,9 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        result.status = STATUS.FAIL;
+        error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
+          ? STATUS.SUCCESS
+          : STATUS.FAIL;
         this.result[0].status = result.status;
         result.operationsStatus = error.response.data.ErrorStatus?.replace(
           /([a-z])([A-Z])/g,
@@ -123,7 +128,9 @@ export class SubclassEquipper extends Equipper {
       this.characterId
     ).catch((error) => {
       if (error.response) {
-        result.status = STATUS.FAIL;
+        error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
+          ? STATUS.SUCCESS
+          : STATUS.FAIL;
         this.result[0].status = result.status;
         result.operationsStatus = error.response.data.ErrorStatus?.replace(
           /([a-z])([A-Z])/g,
diff --git a/src/features/profile/destiny-profile.ts b/src/features/profile/destiny-profile.ts
index c2cccd5..b93cce5 100644
--- a/src/features/profile/destiny-profile.ts
+++ b/src/features/profile/destiny-profile.ts
@@ -160,6 +160,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1078080765,
@@ -170,6 +172,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1078080765,
@@ -180,6 +184,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1078080765,
@@ -190,6 +196,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 4173924323,
@@ -200,6 +208,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
           ],
           gauntletMods: [
@@ -212,6 +222,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3820147479,
@@ -222,6 +234,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3820147479,
@@ -232,6 +246,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3820147479,
@@ -242,6 +258,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 4173924323,
@@ -252,6 +270,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
           ],
           chestArmorMods: [
@@ -264,6 +284,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1803434835,
@@ -274,6 +296,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1803434835,
@@ -284,6 +308,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 1803434835,
@@ -294,6 +320,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 4173924323,
@@ -304,6 +332,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
           ],
           legArmorMods: [
@@ -316,6 +346,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 2269836811,
@@ -326,6 +358,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 2269836811,
@@ -336,6 +370,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 2269836811,
@@ -346,6 +382,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 4173924323,
@@ -356,6 +394,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
           ],
           classArmorMods: [
@@ -368,6 +408,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3200810407,
@@ -378,6 +420,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3200810407,
@@ -388,6 +432,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 3200810407,
@@ -398,6 +444,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
             {
               itemHash: 4173924323,
@@ -408,6 +456,8 @@ export async function getProfileData(): Promise<ProfileData> {
               isOwned: false,
               name: '',
               icon: '',
+              energyCost: 0,
+              collectibleHash: 0,
             },
           ],
           characterId: characterData[key].characterId,
diff --git a/src/lib/bungie_api/Constants.ts b/src/lib/bungie_api/Constants.ts
index 4c41821..8889624 100644
--- a/src/lib/bungie_api/Constants.ts
+++ b/src/lib/bungie_api/Constants.ts
@@ -62,6 +62,7 @@ export const STATS: string[] = [
 export enum ERRORS {
   INVALID_EQUIP_LOCATION = 1671,
   CANNOT_FIND_ITEM = 1623,
+  SOCKET_ALREADY_CONTAINS_PLUG = 1679,
 }
 
 export enum STAT_MOD_HASHES {
diff --git a/src/store/LoadoutReducer.tsx b/src/store/LoadoutReducer.tsx
index 0dec289..3f2b23c 100644
--- a/src/store/LoadoutReducer.tsx
+++ b/src/store/LoadoutReducer.tsx
@@ -1,18 +1,7 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
-import { Character, DamageType, DestinyArmor, Loadout, Plug, Subclass } from '../types/d2l-types';
-import {
-  DAMAGE_TYPE,
-  EMPTY_ASPECT,
-  EMPTY_FRAGMENT,
-  EMPTY_MANIFEST_PLUG,
-} from '../lib/bungie_api/constants';
-import { ManifestArmorStatMod, ManifestPlug } from '../types/manifest-types';
-
-const EMPTY_PLUG: Plug = {
-  plugItemHash: '',
-  socketArrayType: 0,
-  socketIndex: -1,
-};
+import { Character, DamageType, DestinyArmor, Loadout, Subclass } from '../types/d2l-types';
+import { EMPTY_ASPECT, EMPTY_FRAGMENT, EMPTY_MANIFEST_PLUG } from '../lib/bungie_api/constants';
+import { ManifestArmorMod, ManifestArmorStatMod } from '../types/manifest-types';
 
 export interface InitialState {
   loadout: Loadout;
@@ -125,6 +114,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1078080765,
@@ -135,6 +126,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1078080765,
@@ -145,6 +138,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1078080765,
@@ -155,6 +150,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 4173924323,
@@ -165,6 +162,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
     ],
     gauntletMods: [
@@ -177,6 +176,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3820147479,
@@ -187,6 +188,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3820147479,
@@ -197,6 +200,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3820147479,
@@ -207,6 +212,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 4173924323,
@@ -217,6 +224,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
     ],
     chestArmorMods: [
@@ -229,6 +238,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1803434835,
@@ -239,6 +250,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1803434835,
@@ -249,6 +262,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 1803434835,
@@ -259,6 +274,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 4173924323,
@@ -269,6 +286,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
     ],
     legArmorMods: [
@@ -281,6 +300,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 2269836811,
@@ -291,6 +312,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 2269836811,
@@ -301,6 +324,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 2269836811,
@@ -311,6 +336,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 4173924323,
@@ -321,6 +348,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
     ],
     classArmorMods: [
@@ -333,6 +362,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3200810407,
@@ -343,6 +374,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3200810407,
@@ -353,6 +386,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 3200810407,
@@ -363,6 +398,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
       {
         itemHash: 4173924323,
@@ -373,6 +410,8 @@ const initialState: InitialState = {
         isOwned: false,
         name: '',
         icon: '',
+        energyCost: 0,
+        collectibleHash: 0,
       },
     ],
     characterId: 0,
@@ -418,7 +457,7 @@ export const loadoutConfigSlice = createSlice({
       action: PayloadAction<{
         armorType: string;
         slot: number;
-        plug: ManifestPlug | ManifestArmorStatMod;
+        plug: ManifestArmorMod | ManifestArmorStatMod;
       }>
     ) => {
       switch (action.payload.armorType) {

From 9f8bffbb57f452259876d80d6cab3ef8ffe45891 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 17:40:50 -0700
Subject: [PATCH 05/12] Refactored characters to only keep track of unlocked
 SubclassConfigs

---
 src/features/profile/destiny-profile.ts | 484 ++----------------------
 src/store/LoadoutReducer.tsx            |   1 -
 src/types/d2l-types.ts                  |   3 +-
 3 files changed, 39 insertions(+), 449 deletions(-)

diff --git a/src/features/profile/destiny-profile.ts b/src/features/profile/destiny-profile.ts
index b93cce5..8aee6f5 100644
--- a/src/features/profile/destiny-profile.ts
+++ b/src/features/profile/destiny-profile.ts
@@ -54,441 +54,6 @@ export async function getProfileData(): Promise<ProfileData> {
           classItem: [],
         },
         subclasses: {},
-        equippedLoadout: {
-          helmet: {
-            intellect: 0,
-            discipline: 0,
-            resilience: 0,
-            mobility: 0,
-            strength: 0,
-            recovery: 0,
-            instanceHash: '',
-            itemHash: '',
-            artifice: undefined,
-            masterwork: false,
-            exotic: undefined,
-            class: undefined,
-            type: '',
-            socket: undefined,
-            location: 0,
-            icon: '',
-            name: '',
-          },
-          gauntlets: {
-            intellect: 0,
-            discipline: 0,
-            resilience: 0,
-            mobility: 0,
-            strength: 0,
-            recovery: 0,
-            instanceHash: '',
-            itemHash: '',
-            artifice: undefined,
-            masterwork: false,
-            exotic: undefined,
-            class: undefined,
-            type: '',
-            socket: undefined,
-            location: 0,
-            icon: '',
-            name: '',
-          },
-          chestArmor: {
-            intellect: 0,
-            discipline: 0,
-            resilience: 0,
-            mobility: 0,
-            strength: 0,
-            recovery: 0,
-            instanceHash: '',
-            itemHash: '',
-            artifice: undefined,
-            masterwork: false,
-            exotic: undefined,
-            class: undefined,
-            type: '',
-            socket: undefined,
-            location: 0,
-            icon: '',
-            name: '',
-          },
-          legArmor: {
-            intellect: 0,
-            discipline: 0,
-            resilience: 0,
-            mobility: 0,
-            strength: 0,
-            recovery: 0,
-            instanceHash: '',
-            itemHash: '',
-            artifice: undefined,
-            masterwork: false,
-            exotic: undefined,
-            class: undefined,
-            type: '',
-            socket: undefined,
-            location: 0,
-            icon: '',
-            name: '',
-          },
-          classArmor: {
-            intellect: 0,
-            discipline: 0,
-            resilience: 0,
-            mobility: 0,
-            strength: 0,
-            recovery: 0,
-            instanceHash: '',
-            itemHash: '',
-            artifice: undefined,
-            masterwork: false,
-            exotic: undefined,
-            class: undefined,
-            type: '',
-            socket: undefined,
-            location: 0,
-            icon: '',
-            name: '',
-          },
-          helmetMods: [
-            {
-              itemHash: 1980618587,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1078080765,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1078080765,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1078080765,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 4173924323,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-          ],
-          gauntletMods: [
-            {
-              itemHash: 1980618587,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3820147479,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3820147479,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3820147479,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 4173924323,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-          ],
-          chestArmorMods: [
-            {
-              itemHash: 1980618587,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1803434835,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1803434835,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 1803434835,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 4173924323,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-          ],
-          legArmorMods: [
-            {
-              itemHash: 1980618587,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 2269836811,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 2269836811,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 2269836811,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 4173924323,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-          ],
-          classArmorMods: [
-            {
-              itemHash: 1980618587,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3200810407,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3200810407,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 3200810407,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-            {
-              itemHash: 4173924323,
-              perkName: '',
-              perkDescription: '',
-              perkIcon: '',
-              category: 0,
-              isOwned: false,
-              name: '',
-              icon: '',
-              energyCost: 0,
-              collectibleHash: 0,
-            },
-          ],
-          characterId: characterData[key].characterId,
-          subclassConfig: {
-            subclass: {
-              instanceId: '',
-              screenshot: '',
-              damageType: 0,
-              isOwned: false,
-              class: '',
-              itemHash: 0,
-              name: '',
-              icon: '',
-            },
-            damageType: 1,
-            super: EMPTY_MANIFEST_PLUG,
-            aspects: [EMPTY_ASPECT, EMPTY_ASPECT],
-            fragments: [
-              EMPTY_FRAGMENT,
-              EMPTY_FRAGMENT,
-              EMPTY_FRAGMENT,
-              EMPTY_FRAGMENT,
-              EMPTY_FRAGMENT,
-            ],
-            classAbility: null,
-            meleeAbility: null,
-            movementAbility: null,
-            grenade: null,
-          },
-          requiredStatMods: [],
-        },
       };
 
       // iterate character's equipped items
@@ -530,16 +95,30 @@ export async function getProfileData(): Promise<ProfileData> {
                 screenshot: subclass.icon,
                 isOwned: subclass.isOwned,
               };
-              character.subclasses[subclass.damageType] = s;
+
+              character.subclasses[subclass.damageType] = {
+                subclass: s,
+                damageType: 1,
+                super: EMPTY_MANIFEST_PLUG,
+                aspects: [EMPTY_ASPECT, EMPTY_ASPECT],
+                fragments: [
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                ],
+                classAbility: null,
+                meleeAbility: null,
+                movementAbility: null,
+                grenade: null,
+              };
 
               // set equipped loadout subclass config
-              character.equippedLoadout.subclassConfig.subclass = s;
-              character.equippedLoadout.subclassConfig.damageType =
-                subclass.damageType as DamageType;
               const subclassSockets = itemComponents.sockets.data[item.itemInstanceId]?.sockets;
 
               /*if (subclassSockets) {
-                character.equippedLoadout.subclassConfig.classAbility = {
+                character.subclasses[subclass.damageType].classAbility = {
                   plugItemHash: subclassSockets[0].plugHash,
                   socketArrayType: 0,
                   socketIndex: 1,
@@ -620,28 +199,24 @@ export async function getProfileData(): Promise<ProfileData> {
           case BUCKET_HASH.HELMET: {
             const helmet = await buildDestinyArmor(itemComponents, item, character.class, 'helmet');
             character.armor.helmet.push(helmet);
-            character.equippedLoadout.helmet = helmet;
             continue;
           }
 
           case BUCKET_HASH.GAUNTLETS: {
             const arms = await buildDestinyArmor(itemComponents, item, character.class, 'arms');
             character.armor.arms.push(arms);
-            character.equippedLoadout.gauntlets = arms;
             continue;
           }
 
           case BUCKET_HASH.CHEST_ARMOR: {
             const chest = await buildDestinyArmor(itemComponents, item, character.class, 'chest');
             character.armor.chest.push(chest);
-            character.equippedLoadout.chestArmor = chest;
             continue;
           }
 
           case BUCKET_HASH.LEG_ARMOR: {
             const legs = await buildDestinyArmor(itemComponents, item, character.class, 'legs');
             character.armor.legs.push(legs);
-            character.equippedLoadout.legArmor = legs;
             continue;
           }
 
@@ -653,7 +228,6 @@ export async function getProfileData(): Promise<ProfileData> {
               'class'
             );
             character.armor.classItem.push(classItem);
-            character.equippedLoadout.classArmor = classItem;
             continue;
           }
         }
@@ -670,7 +244,7 @@ export async function getProfileData(): Promise<ProfileData> {
             const subclass = await subclassQuery.first();
 
             if (subclass) {
-              character.subclasses[subclass.damageType] = {
+              const s: Subclass = {
                 instanceId: item.itemInstanceId,
                 itemHash: subclass.itemHash,
                 damageType: subclass.damageType,
@@ -680,6 +254,24 @@ export async function getProfileData(): Promise<ProfileData> {
                 screenshot: subclass.icon,
                 isOwned: subclass.isOwned,
               };
+
+              character.subclasses[subclass.damageType] = {
+                subclass: s,
+                damageType: 1,
+                super: EMPTY_MANIFEST_PLUG,
+                aspects: [EMPTY_ASPECT, EMPTY_ASPECT],
+                fragments: [
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                  EMPTY_FRAGMENT,
+                ],
+                classAbility: null,
+                meleeAbility: null,
+                movementAbility: null,
+                grenade: null,
+              };
             }
             continue;
           }
diff --git a/src/store/LoadoutReducer.tsx b/src/store/LoadoutReducer.tsx
index 3f2b23c..bb755f3 100644
--- a/src/store/LoadoutReducer.tsx
+++ b/src/store/LoadoutReducer.tsx
@@ -544,7 +544,6 @@ export const loadoutConfigSlice = createSlice({
     },
     updateLoadoutCharacter: (state, action: PayloadAction<Character>) => {
       state.loadout.characterId = action.payload.id;
-      state.loadout.subclassConfig = action.payload.equippedLoadout.subclassConfig;
     },
     resetLoadout: () => initialState,
   },
diff --git a/src/types/d2l-types.ts b/src/types/d2l-types.ts
index 56cd071..e6e0eef 100644
--- a/src/types/d2l-types.ts
+++ b/src/types/d2l-types.ts
@@ -82,8 +82,7 @@ export type Character = {
   class: CharacterClass;
   emblem?: Emblem;
   armor: ArmorBySlot;
-  subclasses: { [key: number]: Subclass };
-  equippedLoadout: Loadout;
+  subclasses: { [key: number]: SubclassConfig | undefined };
 };
 
 export type Emblem = {

From a57c306128e68a890fa1bdb275e0352dc455937f Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sat, 24 Aug 2024 17:57:46 -0700
Subject: [PATCH 06/12] Added empty armor plug constants

---
 .../subclass/SubclassCustomizationWrapper.tsx |   2 +-
 src/lib/bungie_api/Constants.ts               | 317 +++++++++++++++++
 src/store/LoadoutReducer.tsx                  | 322 +-----------------
 3 files changed, 329 insertions(+), 312 deletions(-)

diff --git a/src/features/subclass/SubclassCustomizationWrapper.tsx b/src/features/subclass/SubclassCustomizationWrapper.tsx
index d7d8132..4e37cea 100644
--- a/src/features/subclass/SubclassCustomizationWrapper.tsx
+++ b/src/features/subclass/SubclassCustomizationWrapper.tsx
@@ -3,7 +3,7 @@ import AbilitiesModification from './AbilitiesModification';
 import './SubclassCustomizationWrapper.css';
 import { Button, Box } from '@mui/material';
 import { styled } from '@mui/material/styles';
-import { ManifestSubclass } from '../types/manifest-types';
+import { ManifestSubclass } from '../../types/manifest-types';
 
 interface SubclassCustomizationWrapperProps {
   onBackClick: () => void;
diff --git a/src/lib/bungie_api/Constants.ts b/src/lib/bungie_api/Constants.ts
index 8889624..99864df 100644
--- a/src/lib/bungie_api/Constants.ts
+++ b/src/lib/bungie_api/Constants.ts
@@ -59,6 +59,323 @@ export const STATS: string[] = [
   'strength',
 ];
 
+export module EMPTY_SOCKETS {
+  export const HELMET = [
+    {
+      itemHash: 1980618587,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2487827355,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/80d2e1a2a76fdea2752beb141084dcf8.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1078080765,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1078080765,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1078080765,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 4173924323,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 3773173029,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/20133fd6a0df6abaa14bbe5bb3e19856.png',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+  ];
+
+  export const GAUNTLETS = [
+    {
+      itemHash: 1980618587,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2487827355,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/80d2e1a2a76fdea2752beb141084dcf8.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3820147479,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3820147479,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3820147479,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 4173924323,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 3773173029,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/20133fd6a0df6abaa14bbe5bb3e19856.png',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+  ];
+
+  export const CHEST_ARMOR = [
+    {
+      itemHash: 1980618587,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2487827355,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/80d2e1a2a76fdea2752beb141084dcf8.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1803434835,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1803434835,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 1803434835,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 4173924323,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 3773173029,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/20133fd6a0df6abaa14bbe5bb3e19856.png',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+  ];
+
+  export const LEG_ARMOR = [
+    {
+      itemHash: 1980618587,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2487827355,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/80d2e1a2a76fdea2752beb141084dcf8.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 2269836811,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 2269836811,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 2269836811,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 4173924323,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 3773173029,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/20133fd6a0df6abaa14bbe5bb3e19856.png',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+  ];
+
+  export const CLASS_ARMOR = [
+    {
+      itemHash: 1980618587,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2487827355,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/80d2e1a2a76fdea2752beb141084dcf8.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3200810407,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3200810407,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 3200810407,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 2912171003,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/5af87586c92c673aa783543d8fd2d8fd.jpg',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+    {
+      itemHash: 4173924323,
+      perkName: '',
+      perkDescription: '',
+      perkIcon: '',
+      category: 3773173029,
+      isOwned: true,
+      name: 'Empty Mod Socket',
+      icon: 'https://bungie.net/common/destiny2_content/icons/20133fd6a0df6abaa14bbe5bb3e19856.png',
+      energyCost: 0,
+      collectibleHash: -1,
+    },
+  ];
+}
+
 export enum ERRORS {
   INVALID_EQUIP_LOCATION = 1671,
   CANNOT_FIND_ITEM = 1623,
diff --git a/src/store/LoadoutReducer.tsx b/src/store/LoadoutReducer.tsx
index bb755f3..50282cb 100644
--- a/src/store/LoadoutReducer.tsx
+++ b/src/store/LoadoutReducer.tsx
@@ -1,6 +1,11 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { Character, DamageType, DestinyArmor, Loadout, Subclass } from '../types/d2l-types';
-import { EMPTY_ASPECT, EMPTY_FRAGMENT, EMPTY_MANIFEST_PLUG } from '../lib/bungie_api/constants';
+import {
+  EMPTY_ASPECT,
+  EMPTY_FRAGMENT,
+  EMPTY_MANIFEST_PLUG,
+  EMPTY_SOCKETS,
+} from '../lib/bungie_api/constants';
 import { ManifestArmorMod, ManifestArmorStatMod } from '../types/manifest-types';
 
 export interface InitialState {
@@ -104,316 +109,11 @@ const initialState: InitialState = {
       name: '',
     },
     requiredStatMods: [],
-    helmetMods: [
-      {
-        itemHash: 1980618587,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1078080765,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1078080765,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1078080765,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 4173924323,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-    ],
-    gauntletMods: [
-      {
-        itemHash: 1980618587,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3820147479,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3820147479,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3820147479,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 4173924323,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-    ],
-    chestArmorMods: [
-      {
-        itemHash: 1980618587,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1803434835,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1803434835,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 1803434835,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 4173924323,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-    ],
-    legArmorMods: [
-      {
-        itemHash: 1980618587,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 2269836811,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 2269836811,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 2269836811,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 4173924323,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-    ],
-    classArmorMods: [
-      {
-        itemHash: 1980618587,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3200810407,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3200810407,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 3200810407,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-      {
-        itemHash: 4173924323,
-        perkName: '',
-        perkDescription: '',
-        perkIcon: '',
-        category: 0,
-        isOwned: false,
-        name: '',
-        icon: '',
-        energyCost: 0,
-        collectibleHash: 0,
-      },
-    ],
+    helmetMods: EMPTY_SOCKETS.HELMET,
+    gauntletMods: EMPTY_SOCKETS.GAUNTLETS,
+    chestArmorMods: EMPTY_SOCKETS.CHEST_ARMOR,
+    legArmorMods: EMPTY_SOCKETS.LEG_ARMOR,
+    classArmorMods: EMPTY_SOCKETS.CLASS_ARMOR,
     characterId: 0,
     subclassConfig: {
       subclass: {

From 824c3297170642751b761648b6faf353f1d6464e Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 13:19:04 -0700
Subject: [PATCH 07/12] Changed equipping screen to use animations

---
 .../loadouts/components/EquipLoadout.tsx      | 192 ++++++++++--------
 src/features/loadouts/components/FadeIn.tsx   |  23 +++
 .../loadouts/components/LoadingBorder.tsx     |  45 ++++
 src/features/loadouts/types/index.ts          |   2 +-
 src/features/loadouts/util/armorEquipper.ts   |  92 ++++-----
 .../loadouts/util/subclassEquipper.ts         |  43 ++--
 6 files changed, 228 insertions(+), 169 deletions(-)
 create mode 100644 src/features/loadouts/components/FadeIn.tsx
 create mode 100644 src/features/loadouts/components/LoadingBorder.tsx

diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index d678e7a..ddae79f 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -1,16 +1,16 @@
-import { Backdrop, Badge, Box, Button, Grid, LinearProgress, Paper, Tooltip } from '@mui/material';
+import { Backdrop, Box, Button, Container, Grid, Paper, Tooltip } from '@mui/material';
 import { store } from '../../../store';
-import { Fragment, useState } from 'react';
+import { useState } from 'react';
 import { EquipResult } from '../types';
-import ArmorIcon from '../../../components/ArmorIcon';
-import { CheckRounded, Close } from '@mui/icons-material';
 import { STATUS } from '../constants';
 import { ArmorEquipper } from '../util/armorEquipper';
 import { DestinyArmor, SubclassConfig } from '../../../types/d2l-types';
 import React from 'react';
 import { SubclassEquipper } from '../util/subclassEquipper';
-import { ManifestArmorStatMod, ManifestPlug } from '../../../types/manifest-types';
+import { ManifestArmorMod, ManifestArmorStatMod } from '../../../types/manifest-types';
 import { DAMAGE_TYPE } from '../../../lib/bungie_api/constants';
+import LoadingBorder from './LoadingBorder';
+import FadeIn from './FadeIn';
 
 const EquipLoadout: React.FC = () => {
   const [processing, setProcessing] = useState<any[]>([]);
@@ -86,7 +86,7 @@ const EquipLoadout: React.FC = () => {
     equipper: ArmorEquipper,
     tempResults: EquipResult[][],
     armor: DestinyArmor,
-    armorMods: { [key: number]: ManifestPlug | ManifestArmorStatMod }
+    armorMods: { [key: number]: ManifestArmorMod | ManifestArmorStatMod }
   ) => {
     tempEquipped.push(armor);
     setProcessing(tempEquipped);
@@ -160,108 +160,130 @@ const EquipLoadout: React.FC = () => {
       </Button>
       <Backdrop open={open} sx={{ color: '#fff', zIndex: (theme) => theme.zIndex.drawer + 1 }}>
         <Paper
-          elevation={1}
+          elevation={5}
           sx={{
-            display: 'flex',
-            position: 'absolute',
-            width: '25vw',
-            height: '95vh',
-            backgroundColor: '#1c1c21',
+            width: '100%',
+            height: '87%',
+            backgroundColor: 'rgba(40,40,40,0.8)',
+            borderTop: '8px solid rgba(100,100,100,1.0)',
+            borderRadius: '0',
             color: 'white',
           }}
         >
-          <Grid
-            container
-            spacing={2}
-            justifyContent="space-between"
-            alignItems="flex-end"
-            paddingTop={1}
-            paddingLeft={1}
-            paddingBottom={4}
-          >
-            <Fragment>
+          <Grid container height="100%">
+            {equipping ? (
+              false
+            ) : (
+              <Grid item md={12} lg={12} textAlign="center">
+                <FadeIn>
+                  <h2>{equipStep}</h2>
+                </FadeIn>
+              </Grid>
+            )}
+            <Grid container item md={12} lg={12} spacing={2} py={4}>
               {processing.map((item, index) => (
-                <Fragment>
+                <>
                   {results[index] !== undefined ? (
-                    <Fragment>
+                    <>
+                      <Grid item md={2} lg={2} />
                       <Grid item md={2}>
-                        <Tooltip title={'Equipped'}>
-                          <Badge
-                            badgeContent={
-                              results[index][0].operationsStatus === 'Success' ? (
-                                <CheckRounded sx={{ fontSize: 50, color: 'green' }} />
-                              ) : (
-                                <Close sx={{ fontSize: 50, color: 'red' }} />
-                              )
+                        <FadeIn duration={1000}>
+                          <Tooltip
+                            title={
+                              results[index][0].status === STATUS.SUCCESS
+                                ? 'Equipped'
+                                : results[index][0].message
                             }
-                            anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
                           >
-                            <ArmorIcon armor={item} size={64}></ArmorIcon>
-                          </Badge>
-                        </Tooltip>
-                      </Grid>
-                      <Grid item md={9}>
-                        {results[index].slice(1).map((result) => (
-                          <Tooltip title={result.operationsStatus}>
-                            <Badge
-                              badgeContent={
-                                results[index][0].status === STATUS.SUCCESS ? (
-                                  <CheckRounded sx={{ fontSize: 50, color: 'green' }} />
-                                ) : (
-                                  <Close sx={{ fontSize: 50, color: 'red' }} />
-                                )
-                              }
-                              anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}
-                            >
-                              <img src={result.subject.icon} />
-                            </Badge>
+                            <img
+                              src={results[index][0].subject.icon}
+                              width={72}
+                              height={72}
+                              style={{
+                                border: `4px solid ${
+                                  results[index][0].status === STATUS.SUCCESS ? 'green' : 'red'
+                                }`,
+                                borderRadius: '5px',
+                              }}
+                            />
                           </Tooltip>
+                        </FadeIn>
+                      </Grid>
+                      <Grid item container md={8} gap={2}>
+                        {results[index].slice(1).map((result, index) => (
+                          <Grid item md="auto">
+                            <FadeIn delay={100 * index} duration={1000}>
+                              <Tooltip title={result.message}>
+                                <img
+                                  src={result.subject.icon}
+                                  width={72}
+                                  height={72}
+                                  style={{
+                                    border: `4px solid ${
+                                      result.status === STATUS.SUCCESS ? 'green' : 'red'
+                                    }`,
+                                    borderRadius: '5px',
+                                  }}
+                                />
+                              </Tooltip>
+                            </FadeIn>
+                          </Grid>
                         ))}
                       </Grid>
-                    </Fragment>
+                    </>
                   ) : (
-                    <Grid container item justifyContent="center" spacing={3}>
+                    <Grid container item alignItems="flex-start" spacing={1} height="100%">
                       <Grid item md={12} textAlign="center">
-                        <ArmorIcon armor={item} size={64} />
-                      </Grid>
-                      <Grid item md={4}>
-                        <LinearProgress color="inherit" />
+                        <LoadingBorder armor={item} size={64} />
                       </Grid>
-                      <Grid item md={12} textAlign="center">
+                      <Grid item md={12} textAlign="center" height="100%">
                         {equipStep}
                       </Grid>
                     </Grid>
                   )}
-                </Fragment>
+                </>
               ))}
-              {equipping ? (
-                false
-              ) : (
-                <Fragment>
-                  <Grid item md={12} textAlign="center">
-                    <h3>{equipStep}</h3>
-                  </Grid>
-                  <Grid item md={3} textAlign="center">
-                    <Button
-                      onClick={() => {
-                        setOpen(false);
-                        setResults([]);
-                        setProcessing([]);
-                        setEquipStep('');
-                      }}
-                    >
-                      Back
-                    </Button>
+            </Grid>
+            {equipping ? (
+              false
+            ) : (
+              <>
+                <Grid
+                  item
+                  container
+                  md={12}
+                  textAlign="center"
+                  alignItems="flex-end"
+                  justifyContent="space-betwen"
+                  sx={{ backgroundColor: 'rgba(0,0,0,0.8)' }}
+                >
+                  <Grid item md={4}>
+                    <FadeIn delay={200}>
+                      <Button
+                        onClick={() => {
+                          setOpen(false);
+                          setResults([]);
+                          setProcessing([]);
+                          setEquipStep('');
+                        }}
+                      >
+                        Back
+                      </Button>
+                    </FadeIn>
                   </Grid>
-                  <Grid item md={3} textAlign="center">
-                    <Button>Share</Button>
+                  <Grid item md={4}>
+                    <FadeIn delay={400}>
+                      <Button>Share</Button>
+                    </FadeIn>
                   </Grid>
-                  <Grid item md={3} textAlign="center">
-                    <Button>Save in-game</Button>
+                  <Grid item md={4}>
+                    <FadeIn delay={600}>
+                      <Button>Save in-game</Button>
+                    </FadeIn>
                   </Grid>
-                </Fragment>
-              )}
-            </Fragment>
+                </Grid>
+              </>
+            )}
           </Grid>
         </Paper>
       </Backdrop>
diff --git a/src/features/loadouts/components/FadeIn.tsx b/src/features/loadouts/components/FadeIn.tsx
new file mode 100644
index 0000000..76d4ae0
--- /dev/null
+++ b/src/features/loadouts/components/FadeIn.tsx
@@ -0,0 +1,23 @@
+import React, { ReactNode } from 'react';
+import { useSpring, animated } from 'react-spring';
+
+const FadeIn: React.FC<{ children: ReactNode; duration?: number; delay?: number }> = (props: {
+  children: ReactNode;
+  duration?: number;
+  delay?: number;
+}) => {
+  const [opacity, api] = useSpring(
+    () => ({
+      from: { opacity: '0' },
+      delay: props.delay ? props.delay : 0,
+      to: { opacity: '1' },
+
+      config: { duration: props.duration ? props.duration : 2000, tension: 120, friction: 14 },
+    }),
+    []
+  );
+
+  return <animated.div style={opacity}>{props.children}</animated.div>;
+};
+
+export default FadeIn;
diff --git a/src/features/loadouts/components/LoadingBorder.tsx b/src/features/loadouts/components/LoadingBorder.tsx
new file mode 100644
index 0000000..3a2f07a
--- /dev/null
+++ b/src/features/loadouts/components/LoadingBorder.tsx
@@ -0,0 +1,45 @@
+import React from 'react';
+import { useSpring, animated } from 'react-spring';
+import { styled } from '@mui/system';
+import { DestinyArmor } from '../../../types/d2l-types';
+
+const DefaultIconContainer = styled(animated.img)({
+  borderRadius: '5px',
+  padding: '2px',
+  alignItems: 'center',
+  justifyContent: 'center',
+  marginRight: '5px',
+});
+
+interface LoadingBorderProps {
+  armor: DestinyArmor;
+  size?: number;
+}
+
+const LoadingBorder: React.FC<LoadingBorderProps> = ({ armor, size }) => {
+  const [border, api] = useSpring(
+    () => ({
+      from: { border: '3px solid rgba(195, 195, 195, 0)' },
+      to: async (next) => {
+        await next({ border: '3px solid rgba(195, 195, 195, 1)' });
+        await next({ border: '3px solid rgba(195, 195, 195, 0)' });
+      },
+      loop: true,
+
+      config: { duration: 2000, tension: 120, friction: 14 },
+    }),
+    []
+  );
+
+  return (
+    <DefaultIconContainer
+      src={armor.icon}
+      alt={armor.name}
+      width={size}
+      height={size}
+      style={border}
+    />
+  );
+};
+
+export default LoadingBorder;
diff --git a/src/features/loadouts/types/index.ts b/src/features/loadouts/types/index.ts
index 2d9134e..e723dfb 100644
--- a/src/features/loadouts/types/index.ts
+++ b/src/features/loadouts/types/index.ts
@@ -4,6 +4,6 @@ export type EquipStatus = STATUS.SUCCESS | STATUS.FAIL;
 
 export type EquipResult = {
   status: EquipStatus;
-  operationsStatus: string;
+  message: string;
   subject: any;
 };
diff --git a/src/features/loadouts/util/armorEquipper.ts b/src/features/loadouts/util/armorEquipper.ts
index b30ad47..e924ab6 100644
--- a/src/features/loadouts/util/armorEquipper.ts
+++ b/src/features/loadouts/util/armorEquipper.ts
@@ -6,7 +6,7 @@ import {
   transferItemRequest,
 } from '../../../lib/bungie_api/requests';
 import { DestinyArmor } from '../../../types/d2l-types';
-import { ManifestPlug, ManifestArmorStatMod } from '../../../types/manifest-types';
+import { ManifestArmorStatMod, ManifestArmorMod } from '../../../types/manifest-types';
 import { STATUS } from '../constants';
 import { Equipper } from './equipper';
 
@@ -67,7 +67,7 @@ export class ArmorEquipper extends Equipper {
   public async equipArmor(armor: DestinyArmor): Promise<void> {
     const result = {
       status: STATUS.SUCCESS,
-      operationsStatus: '',
+      message: '',
       subject: armor,
     };
 
@@ -85,10 +85,7 @@ export class ArmorEquipper extends Equipper {
         ).catch((error) => {
           if (error.response) {
             result.status = STATUS.FAIL;
-            result.operationsStatus = error.response.data.ErrorStatus.replace(
-              /([a-z])([A-Z])/g,
-              '$1 $2'
-            );
+            result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
           }
         });
       }
@@ -103,10 +100,7 @@ export class ArmorEquipper extends Equipper {
       ).catch((error) => {
         if (error.response) {
           result.status = STATUS.FAIL;
-          result.operationsStatus = error.response.data.ErrorStatus.replace(
-            /([a-z])([A-Z])/g,
-            '$1 $2'
-          );
+          result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
         }
       });
     }
@@ -115,61 +109,55 @@ export class ArmorEquipper extends Equipper {
     const response = await equipItemRequest(armor.instanceHash, this.characterId).catch((error) => {
       if (error.response) {
         result.status = STATUS.FAIL;
-        result.operationsStatus = error.response.data.ErrorStatus.replace(
-          /([a-z])([A-Z])/g,
-          '$1 $2'
-        );
+        result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
       }
     });
 
-    if (response)
-      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    if (response) {
+      result.status = STATUS.SUCCESS;
+      result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    }
 
     this.result.push(result);
   }
 
   public async equipArmorMods(mods: {
-    [key: number]: ManifestPlug | ManifestArmorStatMod;
+    [key: number]: ManifestArmorMod | ManifestArmorStatMod;
   }): Promise<void> {
     const armor = this.result[0].subject;
 
-    if (armor) {
-      for (let i = 0; i < 5; i++) {
-        const result = {
-          status: STATUS.SUCCESS,
-          operationsStatus: '',
-          subject: mods[i],
-        };
-
-        if (i === 4 && armor.artifice === false) continue;
-
-        const response = await insertSocketPlugFreeRequest(
-          armor.instanceHash,
-          {
-            plugItemHash: String(mods[i].itemHash),
-            socketArrayType: 0,
-            socketIndex: i === 4 && armor.artifice === true ? 11 : i,
-          },
-          this.characterId
-        ).catch((error) => {
-          if (error.response) {
-            result.status =
-              error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
-                ? STATUS.SUCCESS
-                : STATUS.FAIL;
-            this.result[0].status = result.status;
-            result.operationsStatus = error.response.data.ErrorStatus.replace(
-              /([a-z])([A-Z])/g,
-              '$1 $2'
-            );
-          }
-        });
+    if (!armor) return;
 
-        if (response)
-          result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    for (let i = 0; i < 5; i++) {
+      const result = {
+        status: STATUS.SUCCESS,
+        message: '',
+        subject: mods[i],
+      };
 
-        this.result.push(result);
-      }
+      if (i === 4 && armor.artifice === false) continue;
+
+      const response = await insertSocketPlugFreeRequest(
+        armor.instanceHash,
+        {
+          plugItemHash: String(mods[i].itemHash),
+          socketArrayType: 0,
+          socketIndex: i === 4 && armor.artifice === true ? 11 : i,
+        },
+        this.characterId
+      ).catch((error) => {
+        if (error.response) {
+          result.status =
+            error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
+              ? STATUS.SUCCESS
+              : STATUS.FAIL;
+          result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+        }
+      });
+
+      if (response) result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+
+      this.result.push(result);
     }
   }
 }
diff --git a/src/features/loadouts/util/subclassEquipper.ts b/src/features/loadouts/util/subclassEquipper.ts
index fc49273..8699533 100644
--- a/src/features/loadouts/util/subclassEquipper.ts
+++ b/src/features/loadouts/util/subclassEquipper.ts
@@ -9,7 +9,7 @@ export class SubclassEquipper extends Equipper {
   public async equipSubclass(subclass: Subclass) {
     const result = {
       status: STATUS.SUCCESS,
-      operationsStatus: '',
+      message: '',
       subject: subclass,
     };
 
@@ -17,16 +17,12 @@ export class SubclassEquipper extends Equipper {
       (error) => {
         if (error.response) {
           result.status = STATUS.FAIL;
-          result.operationsStatus = error.response.data.ErrorStatus.replace(
-            /([a-z])([A-Z])/g,
-            '$1 $2'
-          );
+          result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
         }
       }
     );
 
-    if (response)
-      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    if (response) result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
 
     this.result.push(result);
   }
@@ -38,7 +34,7 @@ export class SubclassEquipper extends Equipper {
 
     const result = {
       status: STATUS.SUCCESS,
-      operationsStatus: '',
+      message: '',
       subject: ability,
     };
 
@@ -55,16 +51,11 @@ export class SubclassEquipper extends Equipper {
         error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
           ? STATUS.SUCCESS
           : STATUS.FAIL;
-        this.result[0].status = result.status;
-        result.operationsStatus = error.response.data.ErrorStatus.replace(
-          /([a-z])([A-Z])/g,
-          '$1 $2'
-        );
+        result.message = error.response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
       }
     });
 
-    if (response)
-      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    if (response) result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
 
     this.result.push(result);
   }
@@ -76,7 +67,7 @@ export class SubclassEquipper extends Equipper {
 
     const result = {
       status: STATUS.SUCCESS,
-      operationsStatus: '',
+      message: '',
       subject: aspect,
     };
 
@@ -93,16 +84,11 @@ export class SubclassEquipper extends Equipper {
         error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
           ? STATUS.SUCCESS
           : STATUS.FAIL;
-        this.result[0].status = result.status;
-        result.operationsStatus = error.response.data.ErrorStatus?.replace(
-          /([a-z])([A-Z])/g,
-          '$1 $2'
-        );
+        result.message = error.response.data.ErrorStatus?.replace(/([a-z])([A-Z])/g, '$1 $2');
       }
     });
 
-    if (response)
-      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    if (response) result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
 
     this.result.push(result);
   }
@@ -114,7 +100,7 @@ export class SubclassEquipper extends Equipper {
 
     const result = {
       status: STATUS.SUCCESS,
-      operationsStatus: '',
+      message: '',
       subject: fragment,
     };
 
@@ -131,16 +117,11 @@ export class SubclassEquipper extends Equipper {
         error.response.data.ErrorCode === ERRORS.SOCKET_ALREADY_CONTAINS_PLUG
           ? STATUS.SUCCESS
           : STATUS.FAIL;
-        this.result[0].status = result.status;
-        result.operationsStatus = error.response.data.ErrorStatus?.replace(
-          /([a-z])([A-Z])/g,
-          '$1 $2'
-        );
+        result.message = error.response.data.ErrorStatus?.replace(/([a-z])([A-Z])/g, '$1 $2');
       }
     });
 
-    if (response)
-      result.operationsStatus = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
+    if (response) result.message = response.data.ErrorStatus.replace(/([a-z])([A-Z])/g, '$1 $2');
 
     this.result.push(result);
   }

From 4ec2d3f8ce45fa9af2b4a281b0b4dafd64132734 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 13:23:15 -0700
Subject: [PATCH 08/12] Fixed failing to update isOwned for new tables

---
 src/features/profile/destiny-profile.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/features/profile/destiny-profile.ts b/src/features/profile/destiny-profile.ts
index 8aee6f5..75b048d 100644
--- a/src/features/profile/destiny-profile.ts
+++ b/src/features/profile/destiny-profile.ts
@@ -479,6 +479,16 @@ export async function getProfileData(): Promise<ProfileData> {
               .where('itemHash')
               .equals(plug.plugItemHash)
               .modify({ isOwned: true });
+
+            await db.manifestSubclassAspectsDef
+              .where('itemHash')
+              .equals(plug.plugItemHash)
+              .modify({ isOwned: true });
+
+            await db.manifestSubclassFragmentsDef
+              .where('itemHash')
+              .equals(plug.plugItemHash)
+              .modify({ isOwned: true });
           }
         }
       }

From 8c371acb97e1d16c42da1a2c1a2d28c09e62eb7f Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 13:31:48 -0700
Subject: [PATCH 09/12] Fixed type check error

---
 src/app/routes/Dashboard.tsx | 14 ++++++++++----
 src/store/LoadoutReducer.tsx | 35 ++++++++++++++++++++---------------
 2 files changed, 30 insertions(+), 19 deletions(-)

diff --git a/src/app/routes/Dashboard.tsx b/src/app/routes/Dashboard.tsx
index c331f65..2ba374c 100644
--- a/src/app/routes/Dashboard.tsx
+++ b/src/app/routes/Dashboard.tsx
@@ -9,7 +9,13 @@ import { updateProfileData } from '../../store/ProfileReducer';
 import { useDispatch, useSelector } from 'react-redux';
 import { generatePermutations } from '../../features/armor-optimization/generate-permutations';
 import { filterPermutations } from '../../features/armor-optimization/filter-permutations';
-import { DestinyArmor, Character, FilteredPermutation, DamageType } from '../../types/d2l-types';
+import {
+  DestinyArmor,
+  Character,
+  FilteredPermutation,
+  DamageType,
+  SubclassConfig,
+} from '../../types/d2l-types';
 import StatsTable from '../../features/armor-optimization/StatsTable';
 import { RootState } from '../../store';
 import HeaderComponent from '../../components/HeaderComponent';
@@ -199,11 +205,11 @@ export const Dashboard: React.FC = () => {
 
   const handleSubclassSelect = (subclass: ManifestSubclass) => {
     setSelectedSubclass(subclass);
-    if (selectedCharacter) {
+
+    if (selectedCharacter && subclass.damageType in selectedCharacter.subclasses) {
       dispatch(
         updateSubclass({
-          damageType: subclass.damageType as DamageType,
-          subclass: selectedCharacter.subclasses[subclass.damageType],
+          subclass: selectedCharacter.subclasses[subclass.damageType]?.subclass,
         })
       );
     }
diff --git a/src/store/LoadoutReducer.tsx b/src/store/LoadoutReducer.tsx
index 50282cb..a774371 100644
--- a/src/store/LoadoutReducer.tsx
+++ b/src/store/LoadoutReducer.tsx
@@ -193,21 +193,26 @@ export const loadoutConfigSlice = createSlice({
       state.loadout.legArmorMods = initialState.loadout.legArmorMods;
       state.loadout.classArmorMods = initialState.loadout.classArmorMods;
     },
-    updateSubclass: (
-      state,
-      action: PayloadAction<{ damageType: DamageType; subclass: Subclass }>
-    ) => {
-      state.loadout.subclassConfig = {
-        subclass: action.payload.subclass,
-        damageType: action.payload.damageType,
-        super: EMPTY_MANIFEST_PLUG,
-        aspects: [EMPTY_ASPECT, EMPTY_ASPECT],
-        fragments: [EMPTY_FRAGMENT, EMPTY_FRAGMENT, EMPTY_FRAGMENT, EMPTY_FRAGMENT, EMPTY_FRAGMENT],
-        classAbility: null,
-        meleeAbility: null,
-        movementAbility: null,
-        grenade: null,
-      };
+    updateSubclass: (state, action: PayloadAction<{ subclass: Subclass | undefined }>) => {
+      if (action.payload.subclass !== undefined) {
+        state.loadout.subclassConfig = {
+          subclass: action.payload.subclass,
+          damageType: action.payload.subclass.damageType as DamageType,
+          super: EMPTY_MANIFEST_PLUG,
+          aspects: [EMPTY_ASPECT, EMPTY_ASPECT],
+          fragments: [
+            EMPTY_FRAGMENT,
+            EMPTY_FRAGMENT,
+            EMPTY_FRAGMENT,
+            EMPTY_FRAGMENT,
+            EMPTY_FRAGMENT,
+          ],
+          classAbility: null,
+          meleeAbility: null,
+          movementAbility: null,
+          grenade: null,
+        };
+      }
     },
     updateSubclassMods: (state, action: PayloadAction<{ category: string; mods: any[] }>) => {
       const { category, mods } = action.payload;

From 1286ec062378e20dfb7b4622bbe0780fb864ae02 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 13:36:51 -0700
Subject: [PATCH 10/12] Additional formatting in EquipLoadout

---
 src/features/loadouts/components/EquipLoadout.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index ddae79f..44ec557 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -174,7 +174,13 @@ const EquipLoadout: React.FC = () => {
             {equipping ? (
               false
             ) : (
-              <Grid item md={12} lg={12} textAlign="center">
+              <Grid
+                item
+                md={12}
+                lg={12}
+                textAlign="center"
+                sx={{ backgroundColor: 'rgba(48,48,48,0.8)' }}
+              >
                 <FadeIn>
                   <h2>{equipStep}</h2>
                 </FadeIn>

From 612ed8df2f85bca10f9b9d4d85afe2002159239b Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 14:21:58 -0700
Subject: [PATCH 11/12] Fix equipping screen layout

---
 src/features/loadouts/components/EquipLoadout.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index 44ec557..47b5b61 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -186,13 +186,13 @@ const EquipLoadout: React.FC = () => {
                 </FadeIn>
               </Grid>
             )}
-            <Grid container item md={12} lg={12} spacing={2} py={4}>
+            <Grid container item md={12} lg={12} spacing={3} py={4}>
               {processing.map((item, index) => (
                 <>
                   {results[index] !== undefined ? (
                     <>
                       <Grid item md={2} lg={2} />
-                      <Grid item md={2}>
+                      <Grid item md={1}>
                         <FadeIn duration={1000}>
                           <Tooltip
                             title={
@@ -215,7 +215,7 @@ const EquipLoadout: React.FC = () => {
                           </Tooltip>
                         </FadeIn>
                       </Grid>
-                      <Grid item container md={8} gap={2}>
+                      <Grid item container md={9} gap={2}>
                         {results[index].slice(1).map((result, index) => (
                           <Grid item md="auto">
                             <FadeIn delay={100 * index} duration={1000}>

From c5f5ebf7b207a5c1186154e16b7ebe35857dbc45 Mon Sep 17 00:00:00 2001
From: dragoni7 <sdgibson18@outlook.com>
Date: Sun, 25 Aug 2024 15:57:32 -0700
Subject: [PATCH 12/12] Tweaked formatting

---
 .../loadouts/components/EquipLoadout.tsx      | 70 +++++++++----------
 .../loadouts/components/LoadingBorder.tsx     |  1 -
 2 files changed, 33 insertions(+), 38 deletions(-)

diff --git a/src/features/loadouts/components/EquipLoadout.tsx b/src/features/loadouts/components/EquipLoadout.tsx
index 47b5b61..05ff0e1 100644
--- a/src/features/loadouts/components/EquipLoadout.tsx
+++ b/src/features/loadouts/components/EquipLoadout.tsx
@@ -209,7 +209,6 @@ const EquipLoadout: React.FC = () => {
                                 border: `4px solid ${
                                   results[index][0].status === STATUS.SUCCESS ? 'green' : 'red'
                                 }`,
-                                borderRadius: '5px',
                               }}
                             />
                           </Tooltip>
@@ -228,7 +227,6 @@ const EquipLoadout: React.FC = () => {
                                     border: `4px solid ${
                                       result.status === STATUS.SUCCESS ? 'green' : 'red'
                                     }`,
-                                    borderRadius: '5px',
                                   }}
                                 />
                               </Tooltip>
@@ -253,42 +251,40 @@ const EquipLoadout: React.FC = () => {
             {equipping ? (
               false
             ) : (
-              <>
-                <Grid
-                  item
-                  container
-                  md={12}
-                  textAlign="center"
-                  alignItems="flex-end"
-                  justifyContent="space-betwen"
-                  sx={{ backgroundColor: 'rgba(0,0,0,0.8)' }}
-                >
-                  <Grid item md={4}>
-                    <FadeIn delay={200}>
-                      <Button
-                        onClick={() => {
-                          setOpen(false);
-                          setResults([]);
-                          setProcessing([]);
-                          setEquipStep('');
-                        }}
-                      >
-                        Back
-                      </Button>
-                    </FadeIn>
-                  </Grid>
-                  <Grid item md={4}>
-                    <FadeIn delay={400}>
-                      <Button>Share</Button>
-                    </FadeIn>
-                  </Grid>
-                  <Grid item md={4}>
-                    <FadeIn delay={600}>
-                      <Button>Save in-game</Button>
-                    </FadeIn>
-                  </Grid>
+              <Grid
+                item
+                container
+                md={12}
+                textAlign="center"
+                alignItems="flex-end"
+                justifyContent="space-betwen"
+                sx={{ backgroundColor: 'rgba(0,0,0,0.8)' }}
+              >
+                <Grid item md={4}>
+                  <FadeIn delay={200}>
+                    <Button
+                      onClick={() => {
+                        setOpen(false);
+                        setResults([]);
+                        setProcessing([]);
+                        setEquipStep('');
+                      }}
+                    >
+                      Back
+                    </Button>
+                  </FadeIn>
+                </Grid>
+                <Grid item md={4}>
+                  <FadeIn delay={400}>
+                    <Button>Share</Button>
+                  </FadeIn>
                 </Grid>
-              </>
+                <Grid item md={4}>
+                  <FadeIn delay={600}>
+                    <Button>Save in-game</Button>
+                  </FadeIn>
+                </Grid>
+              </Grid>
             )}
           </Grid>
         </Paper>
diff --git a/src/features/loadouts/components/LoadingBorder.tsx b/src/features/loadouts/components/LoadingBorder.tsx
index 3a2f07a..ece4b6b 100644
--- a/src/features/loadouts/components/LoadingBorder.tsx
+++ b/src/features/loadouts/components/LoadingBorder.tsx
@@ -4,7 +4,6 @@ import { styled } from '@mui/system';
 import { DestinyArmor } from '../../../types/d2l-types';
 
 const DefaultIconContainer = styled(animated.img)({
-  borderRadius: '5px',
   padding: '2px',
   alignItems: 'center',
   justifyContent: 'center',