Roll back failed folder icon saves

Clear only the matching optimistic icon when persistence fails so later persisted or synced values stay visible.

Author: ComputelessComputer

apps/desktop/src/folders/folder-editor.tsx

@@ -40,6 +40,9 @@ export function FolderEditor({ folderPath }: { folderPath: string }) {
   const persistedIcons = useFolderIcons();
   const iconOverrides = useFolderSelection((state) => state.iconOverrides);
   const setIconOverride = useFolderSelection((state) => state.setIconOverride);
+  const clearIconOverride = useFolderSelection(
+    (state) => state.clearIconOverride,
+  );
   const rekeyIconOverride = useFolderSelection(
     (state) => state.rekeyIconOverride,
   );
@@ -101,6 +104,7 @@ export function FolderEditor({ folderPath }: { folderPath: string }) {
             onChange={(nextIcon) => {
               setIconOverride(folderPath, nextIcon);
               void updateFolderIcon(folderPath, nextIcon).catch((error) => {
+                clearIconOverride(folderPath, nextIcon);
                 console.error("[folder-editor] failed to update icon", error);
               });
             }}

apps/desktop/src/folders/index.test.tsx

@@ -281,4 +281,27 @@ describe("Folders workspace", () => {
       color: "#9ca3af",
     });
   });
+
+  it("clears an optimistic folder icon when saving fails", async () => {
+    mocks.folders = ["Work"];
+    mocks.updateFolderIcon.mockRejectedValue(new Error("unavailable"));
+    const consoleError = vi
+      .spyOn(console, "error")
+      .mockImplementation(() => {});
+
+    render(<FoldersWorkspace />);
+
+    fireEvent.click(screen.getByRole("button", { name: "Choose folder icon" }));
+    fireEvent.click(screen.getByRole("button", { name: "target" }));
+
+    await waitFor(() => {
+      expect(mocks.updateFolderIcon).toHaveBeenCalledWith("Work", {
+        type: "icon",
+        value: "target",
+        color: "#9ca3af",
+      });
+      expect(useFolderSelection.getState().iconOverrides.Work).toBeUndefined();
+    });
+    consoleError.mockRestore();
+  });
 });

apps/desktop/src/folders/selection.ts

@@ -7,6 +7,7 @@ export const useFolderSelection = create<{
   iconOverrides: Record<string, TemplateIcon>;
   setSelectedPath: (path: string | null) => void;
   setIconOverride: (path: string, icon: TemplateIcon) => void;
+  clearIconOverride: (path: string, icon: TemplateIcon) => void;
   rekeyIconOverride: (fromPath: string, toPath: string) => void;
 }>((set) => ({
   selectedPath: null,
@@ -16,6 +17,14 @@ export const useFolderSelection = create<{
     set((state) => ({
       iconOverrides: { ...state.iconOverrides, [path]: icon },
     })),
+  clearIconOverride: (path, icon) =>
+    set((state) => {
+      if (state.iconOverrides[path] !== icon) {
+        return state;
+      }
+      const { [path]: _, ...rest } = state.iconOverrides;
+      return { iconOverrides: rest };
+    }),
   rekeyIconOverride: (fromPath, toPath) =>
     set((state) => {
       if (fromPath === toPath || !state.iconOverrides[fromPath]) {