From 90a9522382e64e6738e335e3a08ccce83d490138 Mon Sep 17 00:00:00 2001
From: Nigel Breslaw <nigel.breslaw@gmail.com>
Date: Wed, 17 Jul 2024 22:57:20 +0300
Subject: [PATCH] feat: Sort options come from state and persist (#2050)

---
 native/app/inventory/pages/OptionsMenu.tsx | 31 ++++++++++++++++++----
 native/app/store/Account/AccountSlice.ts   | 13 +++++++++
 native/app/store/GGStore.ts                |  6 ++++-
 native/app/store/Types.ts                  | 11 ++++++++
 4 files changed, 55 insertions(+), 6 deletions(-)

diff --git a/native/app/inventory/pages/OptionsMenu.tsx b/native/app/inventory/pages/OptionsMenu.tsx
index cbb233ef1..6a39b394f 100644
--- a/native/app/inventory/pages/OptionsMenu.tsx
+++ b/native/app/inventory/pages/OptionsMenu.tsx
@@ -21,6 +21,7 @@ import { RefreshCcw } from "@/lib/icons/Refresh-ccw.tsx";
 import Animated, { FadeIn } from "react-native-reanimated";
 import { useGGStore } from "@/app/store/GGStore.ts";
 import { getFullProfile } from "@/app/bungie/BungieApi.ts";
+import { ArmorSort, WeaponsSort } from "@/app/store/Types.ts";
 
 export default function OptionsMenu() {
   "use memo";
@@ -33,6 +34,11 @@ export default function OptionsMenu() {
     }
   }, [activateInventoryMenu]);
 
+  const weaponsSort = useGGStore((state) => state.weaponsSort);
+  const setWeaponsSort = useGGStore((state) => state.setWeaponsSort);
+  const armorSort = useGGStore((state) => state.armorSort);
+  const setArmorSort = useGGStore((state) => state.setArmorSort);
+
   return (
     <View className="absolute top-0 right-0 w-16 h-16 active:bg-primary/5">
       <DropdownMenu>
@@ -48,13 +54,22 @@ export default function OptionsMenu() {
               </DropdownMenuSubTrigger>
               <DropdownMenuSubContent>
                 <Animated.View entering={FadeIn.duration(70)}>
-                  <DropdownMenuCheckboxItem checked={false} onCheckedChange={() => {}}>
+                  <DropdownMenuCheckboxItem
+                    checked={weaponsSort === WeaponsSort.Power}
+                    onCheckedChange={() => setWeaponsSort(WeaponsSort.Power)}
+                  >
                     <Text>By Power</Text>
                   </DropdownMenuCheckboxItem>
-                  <DropdownMenuCheckboxItem checked={true} onCheckedChange={() => {}}>
+                  <DropdownMenuCheckboxItem
+                    checked={weaponsSort === WeaponsSort.Type}
+                    onCheckedChange={() => setWeaponsSort(WeaponsSort.Type)}
+                  >
                     <Text>By Type</Text>
                   </DropdownMenuCheckboxItem>
-                  <DropdownMenuCheckboxItem checked={false} onCheckedChange={() => {}}>
+                  <DropdownMenuCheckboxItem
+                    checked={weaponsSort === WeaponsSort.TypeAndPower}
+                    onCheckedChange={() => setWeaponsSort(WeaponsSort.TypeAndPower)}
+                  >
                     <Text>By Type and Power</Text>
                   </DropdownMenuCheckboxItem>
                 </Animated.View>
@@ -67,10 +82,16 @@ export default function OptionsMenu() {
               </DropdownMenuSubTrigger>
               <DropdownMenuSubContent>
                 <Animated.View entering={FadeIn.duration(70)}>
-                  <DropdownMenuCheckboxItem checked={true} onCheckedChange={() => {}}>
+                  <DropdownMenuCheckboxItem
+                    checked={armorSort === ArmorSort.Power}
+                    onCheckedChange={() => setArmorSort(ArmorSort.Power)}
+                  >
                     <Text>By Power</Text>
                   </DropdownMenuCheckboxItem>
-                  <DropdownMenuCheckboxItem checked={false} onCheckedChange={() => {}}>
+                  <DropdownMenuCheckboxItem
+                    checked={armorSort === ArmorSort.Type}
+                    onCheckedChange={() => setArmorSort(ArmorSort.Type)}
+                  >
                     <Text>By Type</Text>
                   </DropdownMenuCheckboxItem>
                 </Animated.View>
diff --git a/native/app/store/Account/AccountSlice.ts b/native/app/store/Account/AccountSlice.ts
index 45db1a270..22019db31 100644
--- a/native/app/store/Account/AccountSlice.ts
+++ b/native/app/store/Account/AccountSlice.ts
@@ -63,6 +63,7 @@ import type {
 import { lightLevelBuckets, type UISections } from "@/app/inventory/logic/Helpers.ts";
 import { iconUrl, screenshotUrl } from "@/app/core/ApiResponse.ts";
 import { DamageType, DestinyClass, ItemSubType, ItemType, SectionBuckets, TierType } from "@/app/bungie/Enums.ts";
+import { ArmorSort, WeaponsSort } from "@/app/store/Types.ts";
 
 export type AccountSliceSetter = Parameters<StateCreator<IStore, [], [], AccountSlice>>[0];
 export type AccountSliceGetter = Parameters<StateCreator<IStore, [], [], AccountSlice>>[1];
@@ -76,6 +77,8 @@ export interface AccountSlice {
   animateToInventoryPage: { index: number; animate: boolean };
   activateInventoryMenu: boolean;
   initialAccountDataReady: boolean;
+  weaponsSort: WeaponsSort;
+  armorSort: ArmorSort;
 
   ggCharacters: GGCharacterUiData[];
   ggWeapons: UISections[][];
@@ -98,6 +101,8 @@ export interface AccountSlice {
   setPullRefreshing: (pullRefreshing: boolean) => void;
   setCurrentListIndex: (payload: number) => void;
   setJumpToIndex: (payload: { index: number; animate: boolean }) => void;
+  setWeaponsSort: (weaponsSort: WeaponsSort) => void;
+  setArmorSort: (armorSort: ArmorSort) => void;
   updateProfile: (profile: ProfileData) => void;
   setQuantityToTransfer: (quantityToTransfer: number) => void;
   setTimestamps: (responseMintedTimestamp: string, secondaryComponentsMintedTimestamp: string) => void;
@@ -123,6 +128,8 @@ export const createAccountSlice: StateCreator<IStore, [], [], AccountSlice> = (s
   showingPerks: false,
   activateInventoryMenu: false,
   initialAccountDataReady: false,
+  weaponsSort: WeaponsSort.TypeAndPower,
+  armorSort: ArmorSort.Type,
 
   ggCharacters: [],
   ggWeapons: [],
@@ -152,6 +159,12 @@ export const createAccountSlice: StateCreator<IStore, [], [], AccountSlice> = (s
   setCurrentListIndex: (currentListIndex) => {
     set({ currentListIndex, animateToInventoryPage: { index: currentListIndex, animate: false } });
   },
+  setWeaponsSort: (weaponsSort) => {
+    set({ weaponsSort });
+  },
+  setArmorSort: (armorSort) => {
+    set({ armorSort });
+  },
   setJumpToIndex: (jumpToIndex) => {
     set({ animateToInventoryPage: jumpToIndex });
   },
diff --git a/native/app/store/GGStore.ts b/native/app/store/GGStore.ts
index 6716e27c6..a10679e74 100644
--- a/native/app/store/GGStore.ts
+++ b/native/app/store/GGStore.ts
@@ -22,7 +22,11 @@ export const useGGStore = create<IStore>()(
     {
       name: "gg-storage",
       storage: createJSONStorage(() => AsyncStorage),
-      partialize: (state) => ({ currentListIndex: state.currentListIndex }),
+      partialize: (state) => ({
+        currentListIndex: state.currentListIndex,
+        weaponsSort: state.weaponsSort,
+        armorSort: state.armorSort,
+      }),
     },
   ),
 );
diff --git a/native/app/store/Types.ts b/native/app/store/Types.ts
index b7f2d9ead..02acda312 100644
--- a/native/app/store/Types.ts
+++ b/native/app/store/Types.ts
@@ -3,6 +3,17 @@ import type { DefinitionKey } from "@/app/core/BungieDefinitions.ts";
 export type StorageKey = "ITEM_DEFINITION" | "ACCOUNTS";
 export type AsyncStorageKey = DefinitionKey;
 
+export enum WeaponsSort {
+  Power = "POWER",
+  Type = "TYPE",
+  TypeAndPower = "TYPE_AND_POWER",
+}
+
+export enum ArmorSort {
+  Power = "POWER",
+  Type = "TYPE",
+}
+
 export const DatabaseStore = {
   factoryName: "gg-data",
   storeName: "key-values",