Refactoring CodeBase

Ref : Client app [Tauri] Yidadaa#2946 [+] feat(exporter.tsx): add newline before return statement [+] fix(exporter.tsx): fix indentation in chat-info-item divs [+] fix(exporter.tsx): fix indentation in message divs [+] fix(exporter.tsx): fix indentation in Markdown component [+] fix(constant.ts): update Masks and Prompts enum values to include ".json" extension [+] fix(sync.ts): update fileName variable to include ".json" extension [+] fix(utils.ts): update defaultPath and name in downloadAs function to use filename without extension
H0llyW00dzZ · Oct 5, 2023 · 804705a · 804705a
1 parent 4c7ff68
commit 804705a
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 19 deletions.
diff --git a/app/components/exporter.tsx b/app/components/exporter.tsx
@@ -172,6 +172,7 @@ export function MessageExporter() {
       );
     }
   }
+
   return (
     <>
       <Steps
@@ -526,19 +527,19 @@ export function ImagePreviewer(props: {
           </div>
           <div>
             <div className={styles["chat-info-item"]}>
-              {"🔗"} {REPO_URL}
+            {"🔗"} {REPO_URL}
             </div>
             <div className={styles["chat-info-item"]}>
-              {"🤖"} {Locale.Exporter.Model}: {mask.modelConfig.model}
+            {"🤖"} {Locale.Exporter.Model}: {mask.modelConfig.model}
             </div>
             <div className={styles["chat-info-item"]}>
-              {"💭"} {Locale.Exporter.Messages}: {props.messages.length}
+            {"💭"} {Locale.Exporter.Messages}: {props.messages.length}
             </div>
             <div className={styles["chat-info-item"]}>
-              {"💫"} {Locale.Exporter.Topic}: {session.topic}
+            {"💫"} {Locale.Exporter.Topic}: {session.topic}
             </div>
             <div className={styles["chat-info-item"]}>
-              {"🗓️"} {Locale.Exporter.Time}:{" "}
+            {"🗓️"} {Locale.Exporter.Time}:{" "}
               {new Date(
                 props.messages.at(-1)?.date ?? Date.now(),
               ).toLocaleString()}
@@ -559,9 +560,14 @@ export function ImagePreviewer(props: {
           }`;
 
           return (
-            <div className={messageClass} key={i}>
+            <div
+              className={styles["message"] + " " + styles["message-" + m.role]}
+              key={i}
+            >
               <div className={styles["avatar"]}>
-                <ExportAvatar avatar={avatar} />
+                <ExportAvatar
+                  avatar={m.role === "user" ? config.avatar : mask.avatar}
+                />
               </div>
 
               <div className={styles["body"]}>
@@ -678,8 +684,7 @@ export function JsonPreviewer(props: {
     copyToClipboard(minifiedJson);
   };
   const download = () => {
-    //This will automatically generate JSON files without the need to include the ".json" extension.
-    downloadAs(msgs, `${props.topic}`);
+    downloadAs((msgs), `${props.topic}.json`);
   };
 
   return (
@@ -691,7 +696,7 @@ export function JsonPreviewer(props: {
         messages={props.messages}
       />
       <div className="markdown-body" onClick={copy}>
-        <Markdown content={mdText} />
+      <Markdown content={mdText} />
       </div>
     </>
   );

diff --git a/app/constant.ts b/app/constant.ts
@@ -31,8 +31,8 @@ export enum SlotID {
 }
 // This will automatically generate JSON files without the need to include the ".json" extension.
 export enum FileName {
-  Masks = "masks",
-  Prompts = "prompts",
+  Masks = "masks.json",
+  Prompts = "prompts.json",
 }
 
 export enum StoreKey {

diff --git a/app/store/sync.ts b/app/store/sync.ts
@@ -89,7 +89,7 @@ export const useSyncStore = createPersistStore(
         ? `${new Date().toLocaleDateString().replace(/\//g, '_')} ${new Date().toLocaleTimeString().replace(/:/g, '_')}`
         : new Date().toLocaleString();
 
-      const fileName = `Backup-${datePart}`;
+      const fileName = `Backup-${datePart}.json`;
       downloadAs((state), fileName);
     },
 

diff --git a/app/utils.ts b/app/utils.ts
@@ -10,7 +10,6 @@ export function trimTopic(topic: string) {
 const isApp = !!getClientConfig()?.isApp;
 
 export async function copyToClipboard(text: string) {
-
   try {
     if (isApp && window.__TAURI__) {
       window.__TAURI__.writeText(text);
@@ -44,11 +43,11 @@ export async function downloadAs(text: object, filename: string) {
   try {
     if (window.__TAURI__) {
       const result = await window.__TAURI__.dialog.save({
-        defaultPath: `${filename}.json`,
+        defaultPath: `${filename}`,
         filters: [
           {
-            name: "JSON Files",
-            extensions: ["json"],
+            name: `${filename.split('.').pop()} files`,
+            extensions: [`${filename.split('.').pop()}`],
           },
           {
             name: "All Files",
@@ -58,7 +57,10 @@ export async function downloadAs(text: object, filename: string) {
       });
 
       if (result !== null) {
-        await window.__TAURI__.fs.writeBinaryFile(result, Uint8Array.from(uint8Array));
+        await window.__TAURI__.fs.writeBinaryFile(
+          result,
+          Uint8Array.from(uint8Array)
+        );
         showToast(Locale.Download.Success);
       } else {
         showToast(Locale.Download.Failed);
@@ -67,7 +69,7 @@ export async function downloadAs(text: object, filename: string) {
       const url = URL.createObjectURL(blob);
       const anchor = document.createElement("a");
       anchor.href = url;
-      anchor.download = `${filename}.json`;
+      anchor.download = `${filename}`;
       anchor.click();
       URL.revokeObjectURL(url);
       showToast(Locale.Download.Success);