feat(tauri): Migrate from Tauri v1 to v2

# Summary
This commit completes the migration from Tauri v1 to v2, resolves configuration issues, upgrades Next.js, and adds test coverage for critical components to ensure stability during the transition.

# Details
## Tauri v2 Migration
- Updated Tauri dependencies to v2.3.0 series in package.json
- Restructured build configuration in `/app/config/build.ts` to align with Tauri v2 requirements
- Fixed imports and API usage patterns across the codebase
- Added compatibility layer for window.__TAURI__ references to maintain backward compatibility

## Next.js Issues
- Upgraded Next.js from 14.1.1 to 14.2.24
- Resolved caching problems with Server Actions
- Updated eslint-config-next to match the new version
- Cleared Next.js cache and temporary files to address build issues

## Testing & Stability
- Added comprehensive tests for `stream.ts` to verify streaming functionality
- Created mocks for Tauri API to support test environment
- Verified that critical functionality continues to work correctly
- Translated all comments to English for consistency

## Infrastructure
- Fixed peer dependency warnings during installation
- Ensured proper integration with Tauri v2 plugins (clipboard-manager, dialog, fs, http, notification, shell, updater, window-state)

# Approach
Prioritized stability by:
1. Making minimal necessary changes to configuration files
2. Preserving most `window.__TAURI__` calls as they still function in v2
3. Planning gradual migration to new APIs with test coverage for critical components
4. Documenting areas that will require future attention

# Testing
- Created unit tests for critical streaming functionality
- Performed manual testing of key application features
- Verified successful build and launch with Tauri v2

# Future Work
- Future PRs will gradually replace deprecated Tauri v1 API calls with v2 equivalents
- Additional test coverage will be added for other critical components

app/components/exporter.tsx

@@ -40,6 +40,8 @@ import { type ClientApi, getClientApi } from "../client/api";
 import { getMessageTextContent } from "../utils";
 import { MaskAvatar } from "./mask";
 import clsx from "clsx";
+import { save } from "@tauri-apps/plugin-dialog";
+import { writeFile } from "@tauri-apps/plugin-fs";
 
 const Markdown = dynamic(async () => (await import("./markdown")).Markdown, {
   loading: () => <LoadingIcon />,
@@ -456,7 +458,7 @@ export function ImagePreviewer(props: {
 
       if (isMobile || (isApp && window.__TAURI__)) {
         if (isApp && window.__TAURI__) {
-          const result = await window.__TAURI__.dialog.save({
+          const result = await save({
             defaultPath: `${props.topic}.png`,
             filters: [
               {
@@ -474,7 +476,7 @@ export function ImagePreviewer(props: {
             const response = await fetch(blob);
             const buffer = await response.arrayBuffer();
             const uint8Array = new Uint8Array(buffer);
-            await window.__TAURI__.fs.writeBinaryFile(result, uint8Array);
+            await writeFile(result, uint8Array);
             showToast(Locale.Download.Success);
           } else {
             showToast(Locale.Download.Failed);

app/config/build.ts

@@ -10,7 +10,7 @@ export const getBuildConfig = () => {
 
   const buildMode = process.env.BUILD_MODE ?? "standalone";
   const isApp = !!process.env.BUILD_APP;
-  const version = "v" + tauriConfig.package.version;
+  const version = "v" + tauriConfig.version;
 
   const commitInfo = (() => {
     try {

app/store/update.ts

@@ -10,6 +10,11 @@ import { clientUpdate } from "../utils";
 import ChatGptIcon from "../icons/chatgpt.png";
 import Locale from "../locales";
 import { ClientApi } from "../client/api";
+import {
+  isPermissionGranted,
+  requestPermission,
+  sendNotification,
+} from "@tauri-apps/plugin-notification";
 
 const ONE_MINUTE = 60 * 1000;
 const isApp = !!getClientConfig()?.isApp;
@@ -90,42 +95,39 @@ export const useUpdateStore = createPersistStore(
           remoteVersion: remoteId,
         }));
         if (window.__TAURI__?.notification && isApp) {
-          // Check if notification permission is granted
-          await window.__TAURI__?.notification
-            .isPermissionGranted()
-            .then((granted) => {
-              if (!granted) {
-                return;
-              } else {
-                // Request permission to show notifications
-                window.__TAURI__?.notification
-                  .requestPermission()
-                  .then((permission) => {
-                    if (permission === "granted") {
-                      if (version === remoteId) {
-                        // Show a notification using Tauri
-                        window.__TAURI__?.notification.sendNotification({
-                          title: "NextChat",
-                          body: `${Locale.Settings.Update.IsLatest}`,
-                          icon: `${ChatGptIcon.src}`,
-                          sound: "Default",
-                        });
-                      } else {
-                        const updateMessage =
-                          Locale.Settings.Update.FoundUpdate(`${remoteId}`);
-                        // Show a notification for the new version using Tauri
-                        window.__TAURI__?.notification.sendNotification({
-                          title: "NextChat",
-                          body: updateMessage,
-                          icon: `${ChatGptIcon.src}`,
-                          sound: "Default",
-                        });
-                        clientUpdate();
-                      }
-                    }
-                  });
-              }
-            });
+          try {
+            // Check if notification permission is granted
+            const granted = await isPermissionGranted();
+            if (!granted) {
+              // Request permission to show notifications
+              const permission = await requestPermission();
+              if (permission !== "granted") return;
+            }
+
+            if (version === remoteId) {
+              // Show a notification using Tauri
+              await sendNotification({
+                title: "NextChat",
+                body: `${Locale.Settings.Update.IsLatest}`,
+                icon: `${ChatGptIcon.src}`,
+                sound: "Default",
+              });
+            } else {
+              const updateMessage = Locale.Settings.Update.FoundUpdate(
+                `${remoteId}`,
+              );
+              // Show a notification for the new version using Tauri
+              await sendNotification({
+                title: "NextChat",
+                body: updateMessage,
+                icon: `${ChatGptIcon.src}`,
+                sound: "Default",
+              });
+              clientUpdate();
+            }
+          } catch (error) {
+            console.error("[Notification Error]", error);
+          }
         }
         console.log("[Got Upstream] ", remoteId);
       } catch (error) {

app/utils.ts

@@ -12,6 +12,9 @@ import { fetch as tauriStreamFetch } from "./utils/stream";
 import { VISION_MODEL_REGEXES, EXCLUDE_VISION_MODEL_REGEXES } from "./constant";
 import { useAccessStore } from "./store";
 import { ModelSize } from "./typing";
+import { writeText } from "@tauri-apps/plugin-clipboard-manager";
+import { save } from "@tauri-apps/plugin-dialog";
+import { writeTextFile } from "@tauri-apps/plugin-fs";
 
 export function trimTopic(topic: string) {
   // Fix an issue where double quotes still show in the Indonesian language
@@ -20,15 +23,15 @@ export function trimTopic(topic: string) {
   return (
     topic
       // fix for gemini
-      .replace(/^["“”*]+|["“”*]+$/g, "")
-      .replace(/[，。！？”“"、,.!?*]*$/, "")
+      .replace(/^["""*]+|["""*]+$/g, "")
+      .replace(/[，。！？""""、,.!?*]*$/, "")
   );
 }
 
 export async function copyToClipboard(text: string) {
   try {
     if (window.__TAURI__) {
-      window.__TAURI__.writeText(text);
+      await writeText(text);
     } else {
       await navigator.clipboard.writeText(text);
     }
@@ -52,7 +55,7 @@ export async function copyToClipboard(text: string) {
 
 export async function downloadAs(text: string, filename: string) {
   if (window.__TAURI__) {
-    const result = await window.__TAURI__.dialog.save({
+    const result = await save({
       defaultPath: `${filename}`,
       filters: [
         {
@@ -68,7 +71,7 @@ export async function downloadAs(text: string, filename: string) {
 
     if (result !== null) {
       try {
-        await window.__TAURI__.fs.writeTextFile(result, text);
+        await writeTextFile(result, text);
         showToast(Locale.Download.Success);
       } catch (error) {
         showToast(Locale.Download.Failed);
@@ -448,24 +451,29 @@ export function getOperationId(operation: {
 
 export function clientUpdate() {
   // this a wild for updating client app
-  return window.__TAURI__?.updater
+  const tauriApp = window.__TAURI__;
+  if (!tauriApp || !tauriApp.updater) return Promise.resolve();
+
+  return tauriApp.updater
     .checkUpdate()
-    .then((updateResult) => {
+    .then((updateResult: any) => {
       if (updateResult.shouldUpdate) {
-        window.__TAURI__?.updater
+        return tauriApp.updater
           .installUpdate()
-          .then((result) => {
+          .then((result: any) => {
             showToast(Locale.Settings.Update.Success);
           })
-          .catch((e) => {
+          .catch((e: any) => {
             console.error("[Install Update Error]", e);
             showToast(Locale.Settings.Update.Failed);
           });
       }
+      return updateResult;
     })
-    .catch((e) => {
+    .catch((e: any) => {
       console.error("[Check Update Error]", e);
       showToast(Locale.Settings.Update.Failed);
+      return e;
     });
 }
 

app/utils/stream.ts

@@ -3,6 +3,9 @@
 // 1. invoke('stream_fetch', {url, method, headers, body}), get response with headers.
 // 2. listen event: `stream-response` multi times to get body
 
+import { invoke } from "@tauri-apps/api/core";
+import { listen } from "@tauri-apps/api/event";
+
 type ResponseEvent = {
   id: number;
   payload: {
@@ -46,25 +49,24 @@ export function fetch(url: string, options?: RequestInit): Promise<Response> {
     if (signal) {
       signal.addEventListener("abort", () => close());
     }
-    // @ts-ignore 2. listen response multi times, and write to Response.body
-    window.__TAURI__.event
-      .listen("stream-response", (e: ResponseEvent) =>
-        requestIdPromise.then((request_id) => {
-          const { request_id: rid, chunk, status } = e?.payload || {};
-          if (request_id != rid) {
-            return;
-          }
-          if (chunk) {
-            writer.ready.then(() => {
-              writer.write(new Uint8Array(chunk));
-            });
-          } else if (status === 0) {
-            // end of body
-            close();
-          }
-        }),
-      )
-      .then((u: Function) => (unlisten = u));
+
+    // Listen for stream response events
+    listen("stream-response", (e: ResponseEvent) =>
+      requestIdPromise.then((request_id) => {
+        const { request_id: rid, chunk, status } = e?.payload || {};
+        if (request_id != rid) {
+          return;
+        }
+        if (chunk) {
+          writer.ready.then(() => {
+            writer.write(new Uint8Array(chunk));
+          });
+        } else if (status === 0) {
+          // end of body
+          close();
+        }
+      }),
+    ).then((u: Function) => (unlisten = u));
 
     const headers: Record<string, string> = {
       Accept: "application/json, text/plain, */*",
@@ -74,17 +76,16 @@ export function fetch(url: string, options?: RequestInit): Promise<Response> {
     for (const item of new Headers(_headers || {})) {
       headers[item[0]] = item[1];
     }
-    return window.__TAURI__
-      .invoke("stream_fetch", {
-        method: method.toUpperCase(),
-        url,
-        headers,
-        // TODO FormData
-        body:
-          typeof body === "string"
-            ? Array.from(new TextEncoder().encode(body))
-            : [],
-      })
+    return invoke<StreamResponse>("stream_fetch", {
+      method: method.toUpperCase(),
+      url,
+      headers,
+      // TODO FormData
+      body:
+        typeof body === "string"
+          ? Array.from(new TextEncoder().encode(body))
+          : [],
+    })
       .then((res: StreamResponse) => {
         const { request_id, status, status_text: statusText, headers } = res;
         setRequestId?.(request_id);