fix: ensure new code lists are added on the cache from onUpdateOptionListMutation

frontend/packages/shared/src/hooks/mutations/useUpdateOptionListMutation.test.ts

@@ -46,6 +46,24 @@ describe('useUpdateOptionListMutation', () => {
     ]);
   });
 
+  test('Adds the new option list on the cache for all option lists when cache does not contain the list', async () => {
+    const queryClient = createQueryClientMock();
+    const existingOptionList = { title: 'some-other-option-list-id', data: optionsList };
+    queryClient.setQueryData([QueryKey.OptionLists, org, app], [existingOptionList]);
+    const renderUpdateOptionListMutationResult = renderHookWithProviders(
+      () => useUpdateOptionListMutation(org, app),
+      { queries: { updateOptionList }, queryClient },
+    ).result;
+    await renderUpdateOptionListMutationResult.current.mutateAsync(args);
+    expect(queryClient.getQueryData([QueryKey.OptionLists, org, app])).toEqual([
+      {
+        title: optionListId,
+        data: updatedOptionsList,
+      },
+      existingOptionList,
+    ]);
+  });
+
   test('Sets the updated option list on the cache for the single option list', async () => {
     const queryClient = createQueryClientMock();
     const renderUpdateOptionListMutationResult = renderHookWithProviders(

frontend/packages/shared/src/hooks/mutations/useUpdateOptionListMutation.ts

@@ -47,11 +47,43 @@ const updateListInOptionListsData = (
   updatedOptionList: OptionsList,
   oldData: OptionsListsResponse,
 ): OptionsListsResponse => {
-  const oldOptionsListData: OptionsListData = oldData.find(
+  const [oldOptionsListData, optionListExists]: [OptionsListData | undefined, boolean] =
+    getOldOptionsListData(oldData, optionListId);
+  if (optionListExists) {
+    return updateExistingOptionList(oldData, oldOptionsListData, updatedOptionList);
+  }
+  return addNewOptionList(oldData, optionListId, updatedOptionList);
+};
+
+const getOldOptionsListData = (
+  oldData: OptionsListsResponse,
+  optionListId: string,
+): [OptionsListData | undefined, boolean] => {
+  const oldOptionsListData = oldData.find(
     (optionListData) => optionListData.title === optionListId,
   );
-  return ArrayUtils.replaceByPredicate(oldData, (optionList) => optionList.title === optionListId, {
-    ...oldOptionsListData,
-    data: updatedOptionList,
-  });
+  return [oldOptionsListData, !!oldOptionsListData];
+};
+
+const updateExistingOptionList = (
+  oldData: OptionsListsResponse,
+  oldOptionsListData: OptionsListData,
+  newOptionsList: OptionsList,
+) => {
+  return ArrayUtils.replaceByPredicate(
+    oldData,
+    (optionList) => optionList.title === oldOptionsListData.title,
+    {
+      ...oldOptionsListData,
+      data: newOptionsList,
+    },
+  );
+};
+
+const addNewOptionList = (
+  oldData: OptionsListsResponse,
+  optionListTitle: string,
+  newOptionsList: OptionsList,
+) => {
+  return ArrayUtils.prepend(oldData, { title: optionListTitle, data: newOptionsList });
 };