diff --git a/native/app/inventory/UiRowRenderItem.tsx b/native/app/inventory/UiRowRenderItem.tsx
index b4cca0679..d3139173e 100644
--- a/native/app/inventory/UiRowRenderItem.tsx
+++ b/native/app/inventory/UiRowRenderItem.tsx
@@ -2,11 +2,11 @@ import { UISection, type UISections } from "@/app/inventory/logic/Helpers.ts";
import EngramsUI from "@/app/inventory/sections/EngramsUI.tsx";
import CharacterEquipmentUI from "@/app/inventory/sections/CharacterEquipmentUI.tsx";
import SeparatorUI from "@/app/inventory/sections/SeparatorUI.tsx";
-import Vault5x5UI from "@/app/inventory/sections/Vault5x5UI.tsx";
import VaultFlexUI from "@/app/inventory/sections/VaultFlexUI.tsx";
import LostItemsUI from "@/app/inventory/sections/LostItemsUI.tsx";
import ArtifactUI from "@/app/inventory/sections/ArtifactUI.tsx";
import VaultSpacerUI from "@/app/inventory/sections/VaultSpacerUI.tsx";
+import LootItemRow from "@/app/inventory/sections/LootItemRow.tsx";
type Props = {
readonly item: UISections;
@@ -18,8 +18,6 @@ export const UiCellRenderItem = ({ item }: Props) => {
return ;
case UISection.CharacterEquipment:
return ;
- case UISection.Vault5x5:
- return ;
case UISection.VaultFlex:
return ;
case UISection.Engrams:
@@ -30,5 +28,7 @@ export const UiCellRenderItem = ({ item }: Props) => {
return ;
case UISection.VaultSpacer:
return ;
+ case UISection.LootIconRow:
+ return ;
}
};
diff --git a/native/app/inventory/cells/DestinyCell.tsx b/native/app/inventory/cells/DestinyCell.tsx
index 6b7bd699f..c57d51221 100644
--- a/native/app/inventory/cells/DestinyCell.tsx
+++ b/native/app/inventory/cells/DestinyCell.tsx
@@ -10,7 +10,7 @@ type Props = {
readonly iconData: DestinyIconData;
};
-const DestinyCell = ({ iconData }: Props) => {
+export default function DestinyCell({ iconData }: Props) {
"use memo";
const navigation = useNavigation();
@@ -73,6 +73,4 @@ const DestinyCell = ({ iconData }: Props) => {
);
-};
-
-export default DestinyCell;
+}
diff --git a/native/app/inventory/cells/DestinyCell2.tsx b/native/app/inventory/cells/DestinyCell2.tsx
new file mode 100644
index 000000000..40c3bcb8c
--- /dev/null
+++ b/native/app/inventory/cells/DestinyCell2.tsx
@@ -0,0 +1,92 @@
+import { useNavigation } from "@react-navigation/native";
+import { Text, View, TouchableOpacity, StyleSheet } from "react-native";
+import { Image } from "expo-image";
+
+import { DestinyIconStyles, ICON_SIZE } from "@/app/utilities/UISize.ts";
+import { CRAFTED_OVERLAY } from "@/app/inventory/logic/Constants.ts";
+import type { DestinyIconData } from "@/app/inventory/logic/Types.ts";
+import EmptyCell from "@/app/inventory/cells/EmptyCell.tsx";
+
+type Props = {
+ readonly iconData: DestinyIconData | undefined;
+};
+
+export default function DestinyCell2({ iconData }: Props) {
+ "use memo";
+
+ if (iconData === undefined) {
+ return (
+
+
+
+ );
+ }
+
+ const navigation = useNavigation();
+ const handlePress = () => {
+ navigation.navigate("Details", {
+ characterId: iconData.characterId,
+ itemHash: iconData.itemHash,
+ itemInstanceId: iconData.itemInstanceId,
+ bucketHash: iconData.bucketHash,
+ });
+ };
+
+ return (
+
+
+
+
+
+
+
+ {iconData.crafted && (
+
+ )}
+
+ {iconData.primaryStat > 0 && (
+
+ {iconData.primaryStat}
+
+ )}
+ {iconData.damageTypeIconUri && (
+
+
+
+ )}
+ {iconData.quantity > 1 && (
+
+
+ {iconData.quantity}
+
+
+ )}
+
+
+ );
+}
+
+const styles = StyleSheet.create({
+ container: {
+ width: ICON_SIZE,
+ height: ICON_SIZE,
+ },
+});
diff --git a/native/app/inventory/logic/Helpers.ts b/native/app/inventory/logic/Helpers.ts
index 4dd0207e8..9cbfcb101 100644
--- a/native/app/inventory/logic/Helpers.ts
+++ b/native/app/inventory/logic/Helpers.ts
@@ -110,12 +110,12 @@ export enum UiRowType {
export enum UISection {
Separator = 0,
CharacterEquipment = 1,
- Vault5x5 = 2,
- VaultFlex = 3,
- Engrams = 4,
- LostItems = 5,
- Artifact = 6,
- VaultSpacer = 7,
+ VaultFlex = 2,
+ Engrams = 3,
+ LostItems = 4,
+ Artifact = 5,
+ VaultSpacer = 6,
+ LootIconRow = 7,
}
export type BaseSection = {
@@ -140,17 +140,17 @@ export type EquipSection = BaseSection & {
inventory: DestinyIconData[];
};
-export type Vault5x5Section = BaseSection & {
- type: UISection.Vault5x5;
- inventory: DestinyIconData[];
-};
-
export type VaultFlexSection = BaseSection & {
type: UISection.VaultFlex;
inventory: DestinyIconData[];
minimumSpacerHeight?: number;
};
+export type LootIconSection = BaseSection & {
+ type: UISection.LootIconRow;
+ inventory: DestinyIconData[];
+};
+
export type LostItemsSection = BaseSection & {
type: UISection.LostItems;
inventory: DestinyIconData[];
@@ -169,12 +169,12 @@ export type VaultSpacerSection = BaseSection & {
export type UISections =
| SeparatorSection
| EquipSection
- | Vault5x5Section
| VaultFlexSection
| EngramsSection
| LostItemsSection
| ArtifactSection
- | VaultSpacerSection;
+ | VaultSpacerSection
+ | LootIconSection;
export type DestinyItemIdentifier = {
characterId: CharacterId;
diff --git a/native/app/inventory/sections/LootItemRow.tsx b/native/app/inventory/sections/LootItemRow.tsx
new file mode 100644
index 000000000..7897f9050
--- /dev/null
+++ b/native/app/inventory/sections/LootItemRow.tsx
@@ -0,0 +1,34 @@
+import { View } from "react-native";
+
+import { DEFAULT_MARGIN, ICON_MARGIN, ICON_SIZE, INV_MAX_WIDTH } from "@/app/utilities/UISize.ts";
+import type { DestinyIconData } from "@/app/inventory/logic/Types.ts";
+import DestinyCell2 from "@/app/inventory/cells/DestinyCell2.tsx";
+
+type Props = {
+ readonly iconData: DestinyIconData[];
+};
+
+export default function LootItemRow({ iconData }: Props) {
+ "use memo";
+ return (
+
+
+
+
+
+
+
+ );
+}
diff --git a/native/app/inventory/sections/Vault5x5UI.tsx b/native/app/inventory/sections/Vault5x5UI.tsx
deleted file mode 100644
index b35bea1d8..000000000
--- a/native/app/inventory/sections/Vault5x5UI.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import { StyleSheet, View } from "react-native";
-
-import { DEFAULT_MARGIN, ICON_MARGIN, INV_MAX_WIDTH, VAULT_5x5_HEIGHT } from "@/app/utilities/UISize.ts";
-import type { DestinyIconData } from "@/app/inventory/logic/Types.ts";
-import DestinyCell from "@/app/inventory/cells/DestinyCell.tsx";
-import EmptyCell from "@/app/inventory/cells/EmptyCell.tsx";
-
-const array25 = Array.from({ length: 25 });
-
-type Props = {
- readonly iconData: DestinyIconData[];
-};
-
-export default function Vault5x5UI({ iconData }: Props) {
- "use memo";
- return (
-
-
- {array25.map((_v, index) => {
- const item = iconData[index];
- if (item) {
- return (
- // biome-ignore lint/suspicious/noArrayIndexKey:
-
- );
- }
- return (
- // biome-ignore lint/suspicious/noArrayIndexKey:
-
- );
- })}
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- marginLeft: DEFAULT_MARGIN,
- marginRight: DEFAULT_MARGIN,
- maxWidth: INV_MAX_WIDTH,
- height: VAULT_5x5_HEIGHT,
- minHeight: VAULT_5x5_HEIGHT,
- flex: 5,
- flexDirection: "row",
- flexWrap: "wrap",
- justifyContent: "space-between",
- alignContent: "space-between",
- },
-});
diff --git a/native/app/store/AccountInventoryLogic.ts b/native/app/store/AccountInventoryLogic.ts
index 2b52776e8..0bcac6c35 100644
--- a/native/app/store/AccountInventoryLogic.ts
+++ b/native/app/store/AccountInventoryLogic.ts
@@ -28,10 +28,10 @@ import {
type ArtifactSection,
type EngramsSection,
type EquipSection,
+ type LootIconSection,
type LostItemsSection,
type SeparatorSection,
type UISections,
- type Vault5x5Section,
type VaultFlexSection,
type VaultSpacerSection,
} from "@/app/inventory/logic/Helpers.ts";
@@ -275,60 +275,83 @@ function returnVaultUiData(
continue;
}
- let itemsLeft = totalItemsArray.length;
- let count = 0;
- const needsMinimumSpacer = totalItemsArray.length < 20;
- while (itemsLeft > 0) {
- // is there 21 or more items left?
- if (itemsLeft > 20) {
- const vault5x5Cell: Vault5x5Section = {
- id: `${bucket}_5x5_section${count}`,
- type: UISection.Vault5x5,
- inventory: [],
- };
-
- const startingPoint = Math.max(0, totalItemsArray.length - itemsLeft);
-
- const itemsToAdd: DestinyIconData[] = [];
- for (let i = startingPoint; i < startingPoint + 25; i++) {
- const item = totalItemsArray[i];
- if (item) {
- itemsToAdd.push(item);
- } else {
- break;
- }
- }
- vault5x5Cell.inventory = itemsToAdd;
- dataArray.push(vault5x5Cell);
- itemsLeft -= 25;
- count++;
- } else {
- const vaultFlexCell: VaultFlexSection = {
- id: `${bucket}_flex_section`,
- type: UISection.VaultFlex,
- inventory: [],
- minimumSpacerHeight: needsMinimumSpacer ? get().getVaultSpacerSize(bucket) : undefined,
- };
-
- const startingPoint = Math.max(0, totalItemsArray.length - itemsLeft);
-
- const itemsToAdd: DestinyIconData[] = [];
- for (let i = startingPoint; i < startingPoint + itemsLeft; i++) {
- const item = totalItemsArray[i];
- if (item) {
- itemsToAdd.push(item);
- }
- }
- vaultFlexCell.inventory = itemsToAdd;
- dataArray.push(vaultFlexCell);
- itemsLeft = 0;
- }
- }
+ const lootIconSections = getLootIconSections(totalItemsArray, bucket.toString());
+ // push each section to the dataArray
+ dataArray.push(...lootIconSections);
+
+ // let itemsLeft = totalItemsArray.length;
+ // let count = 0;
+ // const needsMinimumSpacer = totalItemsArray.length < 20;
+ // while (itemsLeft > 0) {
+ // // is there 21 or more items left?
+ // if (itemsLeft > 20) {
+ // const vault5x5Cell: Vault5x5Section = {
+ // id: `${bucket}_5x5_section${count}`,
+ // type: UISection.Vault5x5,
+ // inventory: [],
+ // };
+
+ // const startingPoint = Math.max(0, totalItemsArray.length - itemsLeft);
+
+ // const itemsToAdd: DestinyIconData[] = [];
+ // for (let i = startingPoint; i < startingPoint + 25; i++) {
+ // const item = totalItemsArray[i];
+ // if (item) {
+ // itemsToAdd.push(item);
+ // } else {
+ // break;
+ // }
+ // }
+ // vault5x5Cell.inventory = itemsToAdd;
+ // dataArray.push(vault5x5Cell);
+ // itemsLeft -= 25;
+ // count++;
+ // } else {
+ // const vaultFlexCell: VaultFlexSection = {
+ // id: `${bucket}_flex_section`,
+ // type: UISection.VaultFlex,
+ // inventory: [],
+ // minimumSpacerHeight: needsMinimumSpacer ? get().getVaultSpacerSize(bucket) : undefined,
+ // };
+
+ // const startingPoint = Math.max(0, totalItemsArray.length - itemsLeft);
+
+ // const itemsToAdd: DestinyIconData[] = [];
+ // for (let i = startingPoint; i < startingPoint + itemsLeft; i++) {
+ // const item = totalItemsArray[i];
+ // if (item) {
+ // itemsToAdd.push(item);
+ // }
+ // }
+ // vaultFlexCell.inventory = itemsToAdd;
+ // dataArray.push(vaultFlexCell);
+ // itemsLeft = 0;
+ // }
+ // }
}
}
return dataArray;
}
+function getLootIconSections(items: DestinyIconData[], id: string): LootIconSection[] {
+ const itemsPerSection = 5;
+
+ const LootSections: LootIconSection[] = Array.from(
+ { length: Math.ceil(items.length / itemsPerSection) },
+ (_, sectionId) => {
+ const startIndex = sectionId * itemsPerSection;
+ const inventory = items.slice(startIndex, startIndex + itemsPerSection);
+ return {
+ id: `${id}_${sectionId}`,
+ type: UISection.LootIconRow,
+ inventory,
+ };
+ },
+ );
+
+ return LootSections;
+}
+
function calcTotalVaultItems(): number {
let total = 0;
for (const bucket of section_buckets) {