🚀 Client App [Tauri]

Reff Issue : [Bug] 'export' button does not work ChatGPTNextWeb#2884 [+] feat(global.d.ts): add support for Tauri API in global window interface [+] fix(utils.ts): fix typo in copyToClipboard function, change invoke to writeText Client App [Tauri] [Authentication page] Ref : UI Page [Auth Page] ChatGPTNextWeb#2933 [+] chore(auth.tsx): remove unused import of useEffect [+] feat(auth.tsx): conditionally render input access code and input access token based on whether it's an app
H0llyW00dzZ · Oct 1, 2023 · 23b1f79 · 23b1f79
1 parent eb6e42e
commit 23b1f79
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 80 deletions.
diff --git a/app/components/auth.tsx b/app/components/auth.tsx
@@ -7,7 +7,6 @@ import { useAccessStore } from "../store";
 import Locale from "../locales";
 
 import BotIcon from "../icons/bot.svg";
-import { useEffect } from "react";
 import { getClientConfig } from "../config/client";
 
 export function AuthPage() {
@@ -18,47 +17,6 @@ export function AuthPage() {
   const resetAccessCode = () => { access.updateCode(""); access.updateToken(""); }; // Reset access code to empty string
   const goPrivacy = () => navigate(Path.PrivacyPage);
 
-  useEffect(() => {
-    if (getClientConfig()?.isApp) {
-      <div className={styles["auth-page"]}>
-        <div className={`no-dark ${styles["auth-logo"]}`}>
-          <BotIcon />
-        </div>
-
-        <div className={styles["auth-title"]}>{Locale.Auth.Title}</div>
-        <div className={styles["auth-tips"]}>{Locale.Auth.Tips}</div>
-        <>
-          <div className={styles["auth-tips"]}>{Locale.Auth.SubTips}</div>
-          <input
-            className={styles["auth-input"]}
-            type="password"
-            placeholder={Locale.Settings.Token.Placeholder}
-            value={access.token}
-            onChange={(e) => {
-              access.updateToken(e.currentTarget.value);
-            }}
-          />
-        </>
-
-        <div className={styles["auth-actions"]}>
-          <IconButton
-            text={Locale.Auth.Confirm}
-            type="primary"
-            onClick={goPrivacy}
-          />
-          <IconButton
-            text={Locale.Auth.Later}
-            onClick={() => {
-              resetAccessCode();
-              goHome();
-            }}
-          />
-        </div>
-      </div>
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   return (
     <div className={styles["auth-page"]}>
       <div className={`no-dark ${styles["auth-logo"]}`}>
@@ -68,16 +26,19 @@ export function AuthPage() {
       <div className={styles["auth-title"]}>{Locale.Auth.Title}</div>
       <div className={styles["auth-tips"]}>{Locale.Auth.Tips}</div>
 
-      <input
-        className={styles["auth-input"]}
-        type="password"
-        placeholder={Locale.Auth.Input}
-        value={access.accessCode}
-        onChange={(e) => {
-          access.updateCode(e.currentTarget.value);
-        }}
-      />
-      {!access.hideUserApiKey ? (
+      {!getClientConfig()?.isApp && ( // Conditionally render the input access code based on whether it's an app
+        <input
+          className={styles["auth-input"]}
+          type="password"
+          placeholder={Locale.Auth.Input}
+          value={access.accessCode}
+          onChange={(e) => {
+            access.updateCode(e.currentTarget.value);
+          }}
+        />
+      )}
+
+      {getClientConfig()?.isApp && ( // Conditionally render the input access token based on whether it's an app
         <>
           <div className={styles["auth-tips"]}>{Locale.Auth.SubTips}</div>
           <input
@@ -90,7 +51,7 @@ export function AuthPage() {
             }}
           />
         </>
-      ) : null}
+      )}
 
       <div className={styles["auth-actions"]}>
         <IconButton

diff --git a/app/global.d.ts b/app/global.d.ts
@@ -10,19 +10,15 @@ declare module "*.scss" {
 
 declare module "*.svg";
 
-declare global {
-  interface TauriAPI {
+declare interface Window {
+  __TAURI__?: {
     writeText(text: string): Promise<void>;
-    invoke(text: string, command: string, payload?: Record<string, unknown>): Promise<any>;
+    invoke(command: string, payload?: Record<string, unknown>): Promise<any>;
     dialog: {
       save(options?: Record<string, unknown>): Promise<string | null>;
     };
     fs: {
       writeBinaryFile(path: string, data: Uint8Array): Promise<void>;
     };
-  }
-
-  interface Window {
-    __TAURI__?: TauriAPI;
-  }
+  };
 }
diff --git a/app/utils.ts b/app/utils.ts
@@ -3,39 +3,35 @@ import { useEffect, useState } from "react";
 import { showToast } from "./components/ui-lib";
 import Locale from "./locales";
 
-declare global {
-  interface Window {
-    __TAURI__?: {
-      invoke(command: string, payload?: Record<string, unknown>): Promise<any>;
-      dialog: {
-        save(options?: Record<string, unknown>): Promise<string | null>;
-      };
-      fs: {
-        writeBinaryFile(path: string, data: Uint8Array): Promise<void>;
-      };
-    };
-  }
-}
-
 export function trimTopic(topic: string) {
   return topic.replace(/[，。！？”“"、,.!?]*$/, "");
 }
 
 const isApp = !!getClientConfig()?.isApp;
 
 export async function copyToClipboard(text: string) {
+
   try {
     if (isApp && window.__TAURI__) {
-      await window.__TAURI__.invoke("copyText", { text });
-    } else if (navigator.clipboard && navigator.clipboard.writeText) {
-      await navigator.clipboard.writeText(text);
+      window.__TAURI__.writeText(text);
     } else {
-      throw new Error("Clipboard API not supported");
+      await navigator.clipboard.writeText(text);
     }
 
     showToast(Locale.Copy.Success);
   } catch (error) {
-    showToast(Locale.Copy.Failed);
+    const textArea = document.createElement("textarea");
+    textArea.value = text;
+    document.body.appendChild(textArea);
+    textArea.focus();
+    textArea.select();
+    try {
+      document.execCommand("copy");
+      showToast(Locale.Copy.Success);
+    } catch (error) {
+      showToast(Locale.Copy.Failed);
+    }
+    document.body.removeChild(textArea);
   }
 }
 //To ensure the expected functionality, the default file format must be JSON.