basic enchantment filtering in crafting menus

chrisinajar · Jan 23, 2024 · 27c4c05 · 27c4c05
1 parent 4a5ba70
commit 27c4c05
Show file tree

Hide file tree

Showing 3 changed files with 143 additions and 33 deletions.
diff --git a/src/game/crafting/destroy-items.tsx b/src/game/crafting/destroy-items.tsx
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from "react";
 
+import Grid from "@mui/material/Grid";
 import FormControl from "@mui/material/FormControl";
 import InputLabel from "@mui/material/InputLabel";
 import Select from "@mui/material/Select";
@@ -18,6 +19,8 @@ import {
   addSpaces,
   isItemEquipped,
   itemSorter,
+  itemImprovesCrafting,
+  EnchantmentNames,
 } from "src/helpers";
 
 export function DestroyItems({
@@ -28,26 +31,43 @@ export function DestroyItems({
   disabled: boolean;
 }): JSX.Element {
   let [value, setValue] = useState<string>("");
+  let [selectedEnchantment, setSelectedEnchantment] = useState<string>("");
+  const hasImprovedCrafting = !!hero.inventory.find((item) =>
+    itemImprovesCrafting(item.baseItem),
+  );
   const [destroyItemMutation, { loading }] = useDestroyItemMutation();
-  const destroyableItems = hero.inventory
-    .filter((item) => {
-      if (item.type === InventoryItemType.Quest) {
-        return false;
-      }
-      if (isItemEquipped(hero, item)) {
-        return false;
-      }
+  const destroyableItems = hero.inventory.filter((item) => {
+    if (item.type === InventoryItemType.Quest) {
+      return false;
+    }
+    if (isItemEquipped(hero, item)) {
+      return false;
+    }
 
-      return !!item.enchantment;
-    })
+    return !!item.enchantment;
+  });
+  const filteredItems = destroyableItems
+    .filter(
+      (item) =>
+        selectedEnchantment === "" || item.enchantment === selectedEnchantment,
+    )
     .sort(itemSorter);
+
+  const destroyableEnchantments: EnchantmentType[] = [
+    ...new Set(
+      destroyableItems
+        .filter((item) => !isItemEquipped(hero, item))
+        .map((item) => item.enchantment),
+    ),
+  ];
+
   const label = "Select item to destroy";
 
-  let selectedItem = destroyableItems.find((item) => item.id === value);
+  let selectedItem = filteredItems.find((item) => item.id === value);
 
   if (!selectedItem && value.length) {
-    if (destroyableItems.length) {
-      selectedItem = destroyableItems[0];
+    if (filteredItems.length) {
+      selectedItem = filteredItems[0];
       value = selectedItem.id;
     } else {
       value = "";
@@ -81,15 +101,15 @@ export function DestroyItems({
           onChange={(e) => {
             const itemId = e.target.value;
             const inventoryItem = hero.inventory.find(
-              (item) => item.id === itemId
+              (item) => item.id === itemId,
             );
             if (!inventoryItem) {
               return;
             }
             setValue(itemId);
           }}
         >
-          {destroyableItems.map((item) => {
+          {filteredItems.map((item) => {
             return (
               <MenuItem
                 key={item.id}
@@ -116,6 +136,39 @@ export function DestroyItems({
           {!selectedItem && "Select Item"}
         </Button>
       </FormControl>
+      <br />
+      <br />
+      {hasImprovedCrafting && (
+        <FormControl fullWidth>
+          <InputLabel id="filter-select-label">
+            Filter by enchantment
+          </InputLabel>
+          <Select
+            id="filter-select"
+            labelId="filter-select-label"
+            value={selectedEnchantment || ""}
+            label="Filter by enchantment"
+            onChange={(e) => {
+              const itemId = e.target.value;
+              const inventoryItem = hero.inventory.find(
+                (item) => item.enchantment === itemId,
+              );
+              if (!inventoryItem) {
+                return;
+              }
+              setSelectedEnchantment(itemId);
+            }}
+          >
+            {destroyableEnchantments.map((enchantment) => {
+              return (
+                <MenuItem key={enchantment} value={enchantment}>
+                  {EnchantmentNames[enchantment]}
+                </MenuItem>
+              );
+            })}
+          </Select>
+        </FormControl>
+      )}
     </React.Fragment>
   );
 }
diff --git a/src/game/crafting/disenchant-items.tsx b/src/game/crafting/disenchant-items.tsx
@@ -19,6 +19,8 @@ import {
   addSpaces,
   isItemEquipped,
   itemSorter,
+  itemImprovesCrafting,
+  EnchantmentNames,
 } from "src/helpers";
 
 export function DisenchantItems({
@@ -28,26 +30,42 @@ export function DisenchantItems({
   hero: Hero;
   disabled: boolean;
 }): JSX.Element {
+  let [selectedEnchantment, setSelectedEnchantment] = useState<string>("");
   let [value, setValue] = useState<string>("");
+  const hasImprovedCrafting = !!hero.inventory.find((item) =>
+    itemImprovesCrafting(item.baseItem),
+  );
   const [disenchantItemMutation, { loading }] = useDisenchantItemMutation();
-  const disenchantableItems = hero.inventory
-    .filter((item) => {
-      if (item.type === InventoryItemType.Quest) {
-        return false;
-      }
-      if (isItemEquipped(hero, item)) {
-        return false;
-      }
+  const disenchantableItems = hero.inventory.filter((item) => {
+    if (item.type === InventoryItemType.Quest) {
+      return false;
+    }
+    if (isItemEquipped(hero, item)) {
+      return false;
+    }
 
-      return !!item.enchantment;
-    })
+    return !!item.enchantment;
+  });
+  const filteredItems = disenchantableItems
+    .filter(
+      (item) =>
+        selectedEnchantment === "" || item.enchantment === selectedEnchantment,
+    )
     .sort(itemSorter);
 
-  let selectedItem = disenchantableItems.find((item) => item.id === value);
+  const destroyableEnchantments: EnchantmentType[] = [
+    ...new Set(
+      disenchantableItems
+        .filter((item) => !isItemEquipped(hero, item))
+        .map((item) => item.enchantment),
+    ),
+  ];
+
+  let selectedItem = filteredItems.find((item) => item.id === value);
 
   if (!selectedItem && value.length) {
-    if (disenchantableItems.length) {
-      selectedItem = disenchantableItems[0];
+    if (filteredItems.length) {
+      selectedItem = filteredItems[0];
       value = selectedItem.id;
     } else {
       value = "";
@@ -84,15 +102,15 @@ export function DisenchantItems({
           onChange={(e) => {
             const itemId = e.target.value;
             const inventoryItem = hero.inventory.find(
-              (item) => item.id === itemId
+              (item) => item.id === itemId,
             );
             if (!inventoryItem) {
               return;
             }
             setValue(itemId);
           }}
         >
-          {disenchantableItems.map((item) => {
+          {filteredItems.map((item) => {
             return (
               <MenuItem
                 key={item.id}
@@ -129,6 +147,39 @@ export function DisenchantItems({
           {!selectedItem && "Select Item"}
         </Button>
       </FormControl>
+      <br />
+      <br />
+      {hasImprovedCrafting && (
+        <FormControl fullWidth>
+          <InputLabel id="filter-select-label">
+            Filter by enchantment
+          </InputLabel>
+          <Select
+            id="filter-select"
+            labelId="filter-select-label"
+            value={selectedEnchantment || ""}
+            label="Filter by enchantment"
+            onChange={(e) => {
+              const itemId = e.target.value;
+              const inventoryItem = hero.inventory.find(
+                (item) => item.enchantment === itemId,
+              );
+              if (!inventoryItem) {
+                return;
+              }
+              setSelectedEnchantment(itemId);
+            }}
+          >
+            {destroyableEnchantments.map((enchantment) => {
+              return (
+                <MenuItem key={enchantment} value={enchantment}>
+                  {EnchantmentNames[enchantment]}
+                </MenuItem>
+              );
+            })}
+          </Select>
+        </FormControl>
+      )}
     </React.Fragment>
   );
 }
diff --git a/src/helpers.ts b/src/helpers.ts
@@ -70,14 +70,14 @@ export const EnchantmentNames: { [x in EnchantmentType]?: string } = {
 };
 
 export function pureEnchantmentDisplayName(
-  enchantment: EnchantmentType
+  enchantment: EnchantmentType,
 ): string {
   return EnchantmentNames[enchantment] ?? addSpaces(enchantment);
 }
 
 export function enchantmentDisplayName(
   itemName: string,
-  enchantment: EnchantmentType
+  enchantment: EnchantmentType,
 ): string {
   return `${itemName} of ${EnchantmentNames[enchantment] ?? "The Unknown"}`;
 }
@@ -96,7 +96,7 @@ type DistanceableLocation = {
 
 export function distance2d(
   a: DistanceableLocation,
-  b: DistanceableLocation
+  b: DistanceableLocation,
 ): number {
   return Math.sqrt(Math.pow(a.x - b.x, 2) + Math.pow(a.y - b.y, 2));
 }
@@ -147,6 +147,12 @@ export function itemAllowsCrafting(item: string): boolean {
   }
   return false;
 }
+export function itemImprovesCrafting(item: string): boolean {
+  if (item === "crafting-goggles") {
+    return true;
+  }
+  return false;
+}
 
 export function itemImprovesAutoBattle(item: string): boolean {
   if (item === "orb-of-forbidden-power") {