feat: Enhance cloud synchronization functionality, support syncing delete operations for messages and conversations, and add support for automatic sync settings

.github/workflows/docker.yml

@@ -19,26 +19,26 @@ jobs:
         with:
           username: ${{ secrets.DOCKER_USERNAME }}
           password: ${{ secrets.DOCKER_PASSWORD }}
-      
-      - 
+
+      -
         name: Extract metadata (tags, labels) for Docker
         id: meta
         uses: docker/metadata-action@v4
         with:
-          images: yidadaa/chatgpt-next-web
+          images: ${{ secrets.DOCKER_USERNAME }}/chatgpt-next-web
           tags: |
             type=raw,value=latest
             type=ref,event=tag
-      
-      - 
+
+      -
         name: Set up QEMU
         uses: docker/setup-qemu-action@v2
 
-      - 
+      -
         name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v2
-      
-      - 
+
+      -
         name: Build and push Docker image
         uses: docker/build-push-action@v4
         with:
@@ -49,4 +49,4 @@ jobs:
           labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=gha
           cache-to: type=gha,mode=max
-            
+

app/command.ts

@@ -35,6 +35,7 @@ export function useCommand(commands: Commands = {}) {
 interface ChatCommands {
   new?: Command;
   newm?: Command;
+  copy?: Command;
   next?: Command;
   prev?: Command;
   clear?: Command;

app/components/chat.tsx

@@ -70,6 +70,7 @@ import {
   getMessageImages,
   isVisionModel,
   isDalle3,
+  removeOutdatedEntries,
   showPlugins,
   safeLocalStorage,
 } from "../utils";
@@ -987,6 +988,7 @@ function _Chat() {
   const chatCommands = useChatCommand({
     new: () => chatStore.newSession(),
     newm: () => navigate(Path.NewChat),
+    copy: () => chatStore.copySession(),
     prev: () => chatStore.nextSession(-1),
     next: () => chatStore.nextSession(1),
     clear: () =>
@@ -1118,10 +1120,20 @@ function _Chat() {
   };
 
   const deleteMessage = (msgId?: string) => {
-    chatStore.updateCurrentSession(
-      (session) =>
-        (session.messages = session.messages.filter((m) => m.id !== msgId)),
-    );
+    chatStore.updateCurrentSession((session) => {
+      session.deletedMessageIds &&
+        removeOutdatedEntries(session.deletedMessageIds);
+      session.messages = session.messages.filter((m) => {
+        if (m.id !== msgId) {
+          return true;
+        }
+        if (!session.deletedMessageIds) {
+          session.deletedMessageIds = {} as Record<string, number>;
+        }
+        session.deletedMessageIds[m.id] = Date.now();
+        return false;
+      });
+    });
   };
 
   const onDelete = (msgId: string) => {

app/components/settings.tsx

@@ -362,6 +362,21 @@ function SyncConfigModal(props: { onClose?: () => void }) {
             </select>
           </ListItem>
 
+          <ListItem
+            title={Locale.Settings.Sync.Config.EnableAutoSync.Title}
+            subTitle={Locale.Settings.Sync.Config.EnableAutoSync.SubTitle}
+          >
+            <input
+              type="checkbox"
+              checked={syncStore.enableAutoSync}
+              onChange={(e) => {
+                syncStore.update(
+                  (config) => (config.enableAutoSync = e.currentTarget.checked),
+                );
+              }}
+            ></input>
+          </ListItem>
+
           <ListItem
             title={Locale.Settings.Sync.Config.Proxy.Title}
             subTitle={Locale.Settings.Sync.Config.Proxy.SubTitle}

app/locales/cn.ts

@@ -62,6 +62,7 @@ const cn = {
     Commands: {
       new: "新建聊天",
       newm: "从面具新建聊天",
+      copy: "复制当前聊天",
       next: "下一个聊天",
       prev: "上一个聊天",
       clear: "清除上下文",
@@ -234,6 +235,10 @@ const cn = {
           Title: "同步类型",
           SubTitle: "选择喜爱的同步服务器",
         },
+        EnableAutoSync: {
+          Title: "自动同步设置",
+          SubTitle: "在回复完成或删除消息后自动同步数据",
+        },
         Proxy: {
           Title: "启用代理",
           SubTitle: "在浏览器中同步时，必须启用代理以避免跨域限制",

app/locales/en.ts

@@ -63,6 +63,7 @@ const en: LocaleType = {
     Commands: {
       new: "Start a new chat",
       newm: "Start a new chat with mask",
+      copy: "Copy the current Chat",
       next: "Next Chat",
       prev: "Previous Chat",
       clear: "Clear Context",
@@ -236,6 +237,11 @@ const en: LocaleType = {
           Title: "Sync Type",
           SubTitle: "Choose your favorite sync service",
         },
+        EnableAutoSync: {
+          Title: "Auto Sync Settings",
+          SubTitle:
+            "Automatically synchronize data after replying or deleting messages",
+        },
         Proxy: {
           Title: "Enable CORS Proxy",
           SubTitle: "Enable a proxy to avoid cross-origin restrictions",

app/store/access.ts

@@ -235,7 +235,7 @@ export const useAccessStore = createPersistStore(
         })
         .then((res: DangerConfig) => {
           console.log("[Config] got config from server", res);
-          set(() => ({ ...res }));
+          set(() => ({ lastUpdateTime: Date.now(), ...res }));
         })
         .catch(() => {
           console.error("[Config] failed to fetch config");

app/store/chat.ts

@@ -1,4 +1,8 @@
-import { getMessageTextContent, trimTopic } from "../utils";
+import {
+  getMessageTextContent,
+  trimTopic,
+  removeOutdatedEntries,
+} from "../utils";
 
 import { indexedDBStorage } from "@/app/utils/indexedDB-storage";
 import { nanoid } from "nanoid";
@@ -29,6 +33,7 @@ import { ModelConfig, ModelType, useAppConfig } from "./config";
 import { useAccessStore } from "./access";
 import { collectModelsWithDefaultModel } from "../utils/model";
 import { createEmptyMask, Mask } from "./mask";
+import { useSyncStore } from "./sync";
 
 const localStorage = safeLocalStorage();
 
@@ -80,6 +85,7 @@ export interface ChatSession {
   lastUpdate: number;
   lastSummarizeIndex: number;
   clearContextIndex?: number;
+  deletedMessageIds?: Record<string, number>;
 
   mask: Mask;
 }
@@ -103,6 +109,7 @@ function createEmptySession(): ChatSession {
     },
     lastUpdate: Date.now(),
     lastSummarizeIndex: 0,
+    deletedMessageIds: {},
 
     mask: createEmptyMask(),
   };
@@ -188,9 +195,19 @@ function fillTemplateWith(input: string, modelConfig: ModelConfig) {
   return output;
 }
 
+let cloudSyncTimer: any = null;
+function noticeCloudSync(): void {
+  const syncStore = useSyncStore.getState();
+  cloudSyncTimer && clearTimeout(cloudSyncTimer);
+  cloudSyncTimer = setTimeout(() => {
+    syncStore.autoSync();
+  }, 500);
+}
+
 const DEFAULT_CHAT_STATE = {
   sessions: [createEmptySession()],
   currentSessionIndex: 0,
+  deletedSessionIds: {} as Record<string, number>,
   lastInput: "",
 };
 
@@ -240,6 +257,28 @@ export const useChatStore = createPersistStore(
         });
       },
 
+      copySession() {
+        set((state) => {
+          const { sessions, currentSessionIndex } = state;
+          const emptySession = createEmptySession();
+
+          // copy the session
+          const curSession = JSON.parse(
+            JSON.stringify(sessions[currentSessionIndex]),
+          );
+          curSession.id = emptySession.id;
+          curSession.lastUpdate = emptySession.lastUpdate;
+
+          const newSessions = [...sessions];
+          newSessions.splice(0, 0, curSession);
+
+          return {
+            currentSessionIndex: 0,
+            sessions: newSessions,
+          };
+        });
+      },
+
       moveSession(from: number, to: number) {
         set((state) => {
           const { sessions, currentSessionIndex: oldIndex } = state;
@@ -302,7 +341,18 @@ export const useChatStore = createPersistStore(
         if (!deletedSession) return;
 
         const sessions = get().sessions.slice();
-        sessions.splice(index, 1);
+        const deletedSessionIds = { ...get().deletedSessionIds };
+
+        removeOutdatedEntries(deletedSessionIds);
+
+        const hasDelSessions = sessions.splice(index, 1);
+        if (hasDelSessions?.length) {
+          hasDelSessions.forEach((session) => {
+            if (session.messages.length > 0) {
+              deletedSessionIds[session.id] = Date.now();
+            }
+          });
+        }
 
         const currentIndex = get().currentSessionIndex;
         let nextIndex = Math.min(
@@ -319,19 +369,24 @@ export const useChatStore = createPersistStore(
         const restoreState = {
           currentSessionIndex: get().currentSessionIndex,
           sessions: get().sessions.slice(),
+          deletedSessionIds: get().deletedSessionIds,
         };
 
         set(() => ({
           currentSessionIndex: nextIndex,
           sessions,
+          deletedSessionIds,
         }));
 
+        noticeCloudSync();
+
         showToast(
           Locale.Home.DeleteToast,
           {
             text: Locale.Home.Revert,
             onClick() {
               set(() => restoreState);
+              noticeCloudSync();
             },
           },
           5000,
@@ -352,13 +407,33 @@ export const useChatStore = createPersistStore(
         return session;
       },
 
+      sortSessions() {
+        const currentSession = get().currentSession();
+        const sessions = get().sessions.slice();
+
+        sessions.sort(
+          (a, b) =>
+            new Date(b.lastUpdate).getTime() - new Date(a.lastUpdate).getTime(),
+        );
+        const currentSessionIndex = sessions.findIndex((session) => {
+          return session && currentSession && session.id === currentSession.id;
+        });
+
+        set((state) => ({
+          currentSessionIndex,
+          sessions,
+        }));
+      },
+
       onNewMessage(message: ChatMessage) {
         get().updateCurrentSession((session) => {
           session.messages = session.messages.concat();
           session.lastUpdate = Date.now();
         });
         get().updateStat(message);
         get().summarizeSession();
+        get().sortSessions();
+        noticeCloudSync();
       },
 
       async onUserInput(content: string, attachImages?: string[]) {

app/store/sync.ts

@@ -24,6 +24,7 @@ export type SyncStore = GetStoreState<typeof useSyncStore>;
 
 const DEFAULT_SYNC_STATE = {
   provider: ProviderType.WebDAV,
+  enableAutoSync: true,
   useProxy: true,
   proxyUrl: ApiPath.Cors as string,
 
@@ -43,6 +44,8 @@ const DEFAULT_SYNC_STATE = {
   lastProvider: "",
 };
 
+let lastSyncTime = 0;
+
 export const useSyncStore = createPersistStore(
   DEFAULT_SYNC_STATE,
   (set, get) => ({
@@ -89,6 +92,16 @@ export const useSyncStore = createPersistStore(
     },
 
     async sync() {
+      if (lastSyncTime && lastSyncTime >= Date.now() - 800) {
+        return;
+      }
+      lastSyncTime = Date.now();
+
+      const enableAutoSync = get().enableAutoSync;
+      if (!enableAutoSync) {
+        return;
+      }
+
       const localState = getLocalAppState();
       const provider = get().provider;
       const config = get()[provider];
@@ -103,9 +116,7 @@ export const useSyncStore = createPersistStore(
           );
           return;
         } else {
-          const parsedRemoteState = JSON.parse(
-            await client.get(config.username),
-          ) as AppState;
+          const parsedRemoteState = JSON.parse(remoteState) as AppState;
           mergeAppState(localState, parsedRemoteState);
           setLocalAppState(localState);
         }
@@ -123,6 +134,14 @@ export const useSyncStore = createPersistStore(
       const client = this.getClient();
       return await client.check();
     },
+
+    async autoSync() {
+      const { lastSyncTime, provider } = get();
+      const syncStore = useSyncStore.getState();
+      if (lastSyncTime && syncStore.cloudSync()) {
+        syncStore.sync();
+      }
+    },
   }),
   {
     name: StoreKey.Sync,