diff --git a/apps/frontend/src/components/launches/general.preview.component.tsx b/apps/frontend/src/components/launches/general.preview.component.tsx index 049891a7..6682b97c 100644 --- a/apps/frontend/src/components/launches/general.preview.component.tsx +++ b/apps/frontend/src/components/launches/general.preview.component.tsx @@ -60,7 +60,7 @@ export const GeneralPreviewComponent: FC<{ index === renderContent.length - 1 ? 'pb-[12px]' : 'pb-[24px]' )} > -
+
{integration.identifier}()((set) => ({ }; }), deleteGlobalValue: (index: number) => - set((state) => ({ - global: state.global.filter((_, i) => i !== index), - })), + set((state) => { + // Preserve the IDs at their current positions + const ids = state.global.map((item) => item.id); + + // Get remaining data (content, delay, media) after filtering out deleted index + const remainingData = state.global + .filter((_, i) => i !== index) + .map(({ id, ...rest }) => rest); + + // Reconstruct with preserved IDs + return { + global: remainingData.map((data, i) => ({ + id: ids[i], + ...data, + })), + }; + }), deleteInternalValue: (integrationId: string, index: number) => set((state) => { return { - internal: state.internal.map((i) => { - if (i.integration.id === integrationId) { + internal: state.internal.map((item) => { + if (item.integration.id === integrationId) { + // Preserve the IDs at their current positions + const ids = item.integrationValue.map((v) => v.id); + + // Get remaining data after filtering out deleted index + const remainingData = item.integrationValue + .filter((_, idx) => idx !== index) + .map(({ id, ...rest }) => rest); + return { - ...i, - integrationValue: i.integrationValue.filter( - (_, idx) => idx !== index - ), + ...item, + integrationValue: remainingData.map((data, i) => ({ + id: ids[i], + ...data, + })), }; } - return i; + return item; }), }; }), @@ -305,12 +327,35 @@ export const useLaunchStore = create()((set) => ({ }), changeOrderGlobal: (index: number, direction: 'up' | 'down') => set((state) => { + const targetIndex = direction === 'up' ? index - 1 : index + 1; + + if (targetIndex < 0 || targetIndex >= state.global.length) { + return { global: state.global }; + } + + const currentItem = state.global[index]; + const targetItem = state.global[targetIndex]; + return { - global: arrayMoveImmutable( - state.global, - index, - direction === 'up' ? index - 1 : index + 1 - ), + global: state.global.map((item, i) => { + if (i === index) { + return { + id: item.id, + content: targetItem.content, + delay: targetItem.delay, + media: targetItem.media, + }; + } + if (i === targetIndex) { + return { + id: item.id, + content: currentItem.content, + delay: currentItem.delay, + media: currentItem.media, + }; + } + return item; + }), }; }), changeOrderInternal: ( @@ -322,13 +367,36 @@ export const useLaunchStore = create()((set) => ({ return { internal: state.internal.map((item) => { if (item.integration.id === integrationId) { + const targetIndex = direction === 'up' ? index - 1 : index + 1; + + if (targetIndex < 0 || targetIndex >= item.integrationValue.length) { + return item; + } + + const currentValue = item.integrationValue[index]; + const targetValue = item.integrationValue[targetIndex]; + return { ...item, - integrationValue: arrayMoveImmutable( - item.integrationValue, - index, - direction === 'up' ? index - 1 : index + 1 - ), + integrationValue: item.integrationValue.map((v, i) => { + if (i === index) { + return { + id: v.id, + content: targetValue.content, + delay: targetValue.delay, + media: targetValue.media, + }; + } + if (i === targetIndex) { + return { + id: v.id, + content: currentValue.content, + delay: currentValue.delay, + media: currentValue.media, + }; + } + return v; + }), }; }