Add meta to edit item

dtun · Aug 14, 2024 · d174799 · d174799
1 parent 0846d24
commit d174799
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 6 deletions.
diff --git a/components/MyMenuEdit.tsx b/components/MyMenuEdit.tsx
@@ -3,6 +3,7 @@ import DraggableFlatList, {
   ShadowDecorator,
 } from "react-native-draggable-flatlist";
 
+import { getItemData } from "@/utils";
 import { ItemSeparator } from "@/components/ItemSeparator";
 import { MyMenuEditItem } from "@/components/MyMenuEditItem";
 
@@ -30,7 +31,7 @@ export function MyMenuEdit({
         <ShadowDecorator>
           <MyMenuEditItem
             {...params}
-            menuData={menuData}
+            meta={getItemData(params.item.id, menuData)}
             moveMenuItem={moveMenuItem}
             toggleMenuItem={toggleMenuItem}
           />

diff --git a/components/MyMenuEditItem.tsx b/components/MyMenuEditItem.tsx
@@ -2,12 +2,11 @@ import { StyleSheet } from "react-native";
 
 import { red } from "@/constants";
 import { useEvent } from "@/hooks";
-import { getItemData } from "@/utils";
 import { Text, Icon, View, Pressable } from "@/components/Themed";
 
 import type { AccessibilityActionEvent } from "react-native";
 import type { RenderItemParams } from "react-native-draggable-flatlist";
-import type { Direction, MenuItem, MenuData, Position } from "@/types";
+import type { Direction, MenuItem, MenuItemMeta, Position } from "@/types";
 
 let toggleAction = { name: "activate", label: "Toggle checked state" };
 let upAction = { name: "up", label: "Move item up" };
@@ -18,15 +17,14 @@ let bottomAction = { name: "bottom", label: "Move item to bottom" };
 export function MyMenuEditItem({
   drag: onLongPress,
   item: { icon, id, checked, title },
-  menuData,
+  meta: { isFirst, isLast },
   moveMenuItem,
   toggleMenuItem,
 }: RenderItemParams<MenuItem> & {
-  menuData: MenuData;
+  meta: MenuItemMeta;
   moveMenuItem: (id: string, direction: Direction | Position) => void;
   toggleMenuItem: (id: string) => void;
 }) {
-  let { isFirst, isLast } = getItemData(id, menuData);
   let onAccessibilityAction = useOnAccessibilityAction({
     id,
     moveMenuItem,

diff --git a/types/index.ts b/types/index.ts
@@ -8,6 +8,8 @@ import {
 import { Ionicons } from "@expo/vector-icons";
 import { SharedValue } from "react-native-reanimated";
 
+import { getItemData } from "@/utils";
+
 export type SharedNumber = SharedValue<number>;
 
 export type IconName = keyof typeof Ionicons.glyphMap;
@@ -21,6 +23,8 @@ export type MenuItem = {
 
 export type MenuData = MenuItem[];
 
+export type MenuItemMeta = ReturnType<typeof getItemData>;
+
 export type ThemeProps = {
   lightColor?: string;
   darkColor?: string;