fix: Stabilize shopping list queuing (#6498)

frontend/composables/shopping-list-page/sub-composables/use-shopping-list-crud.ts

@@ -97,13 +97,8 @@ export function useShoppingListCrud(
         .sort(sortCheckedItems);
     }
 
-    // Update the item if it's checked, otherwise updateUncheckedListItems will handle it
-    if (item.checked) {
     shoppingListItemActions.updateItem(item);
-    }
-
     updateListItemOrder();
-    updateUncheckedListItems();
   }
 
   function deleteListItem(item: ShoppingListItemOut) {

frontend/composables/use-shopping-list-item-actions.ts

@@ -112,34 +112,46 @@ export function useShoppingListItemActions(shoppingListId: string) {
 
   async function getList() {
     const response = await api.shopping.lists.getOne(shoppingListId);
-    if (!isOnline.value && response.data) {
+    if (response.data) {
+      // Merge pending local changes (both online and offline)
       const createAndUpdateQueues = mergeListItemsByLatest(queue.update, queue.create);
-      response.data.listItems = mergeListItemsByLatest(response.data.listItems ?? [], createAndUpdateQueues);
+      const deleteQueueIds = new Set(queue.delete.map(item => item.id));
+
+      const filteredLocalChanges = createAndUpdateQueues.filter(item => !deleteQueueIds.has(item.id));
+      let mergedItems = mergeListItemsByLatest(response.data.listItems ?? [], filteredLocalChanges);
+      mergedItems = mergedItems.filter(item => !deleteQueueIds.has(item.id));
+
+      response.data.listItems = mergedItems;
     }
     return response.data;
   }
 
   function createItem(item: ShoppingListItemOut) {
     removeFromQueue(queue.create, item);
+    removeFromQueue(queue.update, item);
+    removeFromQueue(queue.delete, item);
+
     queue.create.push(item);
   }
 
   function updateItem(item: ShoppingListItemOut) {
     const removedFromCreate = removeFromQueue(queue.create, item);
-    if (removedFromCreate) {
-      // this item hasn't been created yet, so we don't need to update it
-      queue.create.push(item);
-      return;
-    }
-
     removeFromQueue(queue.update, item);
+    removeFromQueue(queue.delete, item);
+
+    if (removedFromCreate) {
+      // This item hasn't been created yet, so keep it in create queue with updated data
+      queue.create.push(item);
+    }
+    else {
       queue.update.push(item);
     }
+  }
 
   function deleteItem(item: ShoppingListItemOut) {
     const removedFromCreate = removeFromQueue(queue.create, item);
     if (removedFromCreate) {
-      // this item hasn't been created yet, so we don't need to delete it
+      // This item hasn't been created yet, so we don't need to delete it
       return;
     }
 
@@ -198,10 +210,12 @@ export function useShoppingListItemActions(shoppingListId: string) {
 
     try {
       const itemsToProcess = [...queueItems];
+      const itemIdsToProcess = itemsToProcess.map(item => item.id);
+
       await action(itemsToProcess)
         .then(() => {
           if (isOnline.value) {
-            clearQueueItems(itemQueueType, itemsToProcess.map(item => item.id));
+            clearQueueItems(itemQueueType, itemIdsToProcess);
           }
         });
     }