diff --git a/app/components/settings.tsx b/app/components/settings.tsx
index d8ef6fab656..b69df1c0bf3 100644
--- a/app/components/settings.tsx
+++ b/app/components/settings.tsx
@@ -1,4 +1,4 @@
-import { useState, useEffect, useMemo } from "react";
+import { useState, useEffect, useMemo, useRef } from "react";
 
 import styles from "./settings.module.scss";
 
@@ -40,6 +40,7 @@ import {
   useUpdateStore,
   useAccessStore,
   useAppConfig,
+  ChatSession,
 } from "../store";
 
 import Locale, {
@@ -612,21 +613,28 @@ function LocalDataModal(props: { onClose?: () => void }) {
     await downloadAs(sessions, fileName);
     setExporting(false);
   };
-  const handleImportChat = async () => {
-    if (exporting) return;
-    setExporting(true);
-    try {
-      const rawContent = await readFromFile(); // Read the file content using the appropriate function
-  
-      const importedData = JSON.parse(rawContent);
-      // Process the imported chat data and update the chat store
-      chatStore.newSession(importedData.sessions);
-    } catch (e) {
-      showToast(Locale.Settings.Sync.ImportFailed);
-      console.error(e);
-    }
-    setExporting(false);
-  };
+
+  const chatStoreRef = useRef(chatStore);
+
+  const handleImportChat = useMemo(
+    () => async () => {
+      await readFromFile().then((content) => {
+        try {
+          const importedData = JSON.parse(content);
+          const sessions = importedData.map((sessionData: ChatSession) => ({
+            ...sessionData,
+            id: nanoid(),
+          }));
+          chatStoreRef.current.sessions = sessions; // Update the sessions using the ref
+          showToast(Locale.Settings.Sync.ImportChatSuccess);
+        } catch (e) {
+          showToast(Locale.Settings.Sync.ImportFailed);
+          console.error(e);
+        }
+      });
+    },
+    [chatStoreRef]
+  );
 
   return (
     <div className="modal-mask">
diff --git a/app/locales/cn.ts b/app/locales/cn.ts
index 19974231b23..6a6c26b0c34 100644
--- a/app/locales/cn.ts
+++ b/app/locales/cn.ts
@@ -305,6 +305,7 @@ const cn = {
         },
       },
       ImportFailed: "导入失败",
+      ImportChatSuccess: "聊天数据导入成功。",
     },
     Mask: {
       Splash: {
diff --git a/app/locales/en.ts b/app/locales/en.ts
index 1df0dc08c50..2eca273c8b8 100644
--- a/app/locales/en.ts
+++ b/app/locales/en.ts
@@ -310,6 +310,7 @@ const en: LocaleType = {
         },
       },
       ImportFailed: "Failed to import from file",
+      ImportChatSuccess: "Chat data imported successfully.",
     },
     Mask: {
       Splash: {
diff --git a/app/locales/id.ts b/app/locales/id.ts
index 9352294dcee..cea116910b2 100644
--- a/app/locales/id.ts
+++ b/app/locales/id.ts
@@ -285,6 +285,7 @@ const id: PartialLocaleType = {
         },
       },
       ImportFailed: "Gagal mengimpor dari file",
+      ImportChatSuccess: "Data chat berhasil diimpor.",
     },
     SendKey: "Kirim",
     Theme: "Tema",