fix: simplify window object access, improve error handling

D3SOX · D3SOX · commit b42123d9c2bb · 2025-10-29T17:10:55.000+01:00
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
   "devDependencies": {
     "@types/react": "^19.2.2",
     "@types/react-dom": "^19.2.2",
+    "@types/wicg-file-system-access": "^2023.10.7",
     "spicetify-creator": "^1.0.17"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/i18n.ts b/src/i18n.ts
@@ -131,6 +131,7 @@ export type TranslationKeys = {
     failedToExportJson: string;
     importCanceled: string;
     failedToImportJson: string;
+    failedToImportJsonAccess: string;
   };
   dialogs: {
     saveSnapshot: {
diff --git a/src/locales/de.ts b/src/locales/de.ts
@@ -130,9 +130,10 @@ export const de: TranslationKeys = {
     replaceResult: "Ersetzt; einige Elemente konnten nicht in die Warteschlange eingereiht werden ({{added}}/{{total}})",
     exportCanceled: "Export abgebrochen ({{reason}})",
     exportedToDownloads: "{{filename}} in den Downloads-Ordner exportiert",
-    failedToExportJson: "JSON-Export fehlgeschlagen",
+    failedToExportJson: "JSON-Export fehlgeschlagen: {{reason}}",
     importCanceled: "Import abgebrochen ({{reason}})",
-    failedToImportJson: "JSON-Import fehlgeschlagen",
+    failedToImportJson: "JSON-Import fehlgeschlagen: {{reason}}",
+    failedToImportJsonAccess: "JSON-Import fehlgeschlagen: Datei ist leer oder nicht zugänglich",
   },
   dialogs: {
     saveSnapshot: {
diff --git a/src/locales/en.ts b/src/locales/en.ts
@@ -130,9 +130,10 @@ export const en: TranslationKeys = {
     replaceResult: "Replaced; some items couldn't be queued ({{added}}/{{total}})",
     exportCanceled: "Export canceled ({{reason}})",
     exportedToDownloads: "Exported {{filename}} to Downloads folder",
-    failedToExportJson: "Failed to export JSON",
+    failedToExportJson: "Failed to export JSON: {{reason}}",
     importCanceled: "Import canceled ({{reason}})",
-    failedToImportJson: "Failed to import JSON",
+    failedToImportJson: "Failed to import JSON: {{reason}}",
+    failedToImportJsonAccess: "Failed to import JSON: File is empty or inaccessible",
   },
   dialogs: {
     saveSnapshot: {
diff --git a/src/locales/es.ts b/src/locales/es.ts
@@ -130,9 +130,10 @@ export const es: TranslationKeys = {
     replaceResult: "Reemplazado; algunos elementos no se pudieron encolar ({{added}}/{{total}})",
     exportCanceled: "Exportación cancelada ({{reason}})",
     exportedToDownloads: "{{filename}} exportado a la carpeta de Descargas",
-    failedToExportJson: "Falló la exportación JSON",
+    failedToExportJson: "Falló la exportación JSON: {{reason}}",
     importCanceled: "Importación cancelada ({{reason}})",
-    failedToImportJson: "Falló la importación JSON",
+    failedToImportJson: "Falló la importación JSON: {{reason}}",
+    failedToImportJsonAccess: "Falló la importación JSON: El archivo está vacío o no es accesible",
   },
   dialogs: {
     saveSnapshot: {
diff --git a/src/locales/fr.ts b/src/locales/fr.ts
@@ -130,9 +130,10 @@ export const fr: TranslationKeys = {
     replaceResult: "Remplacé ; certains éléments n'ont pas pu être mis en file ({{added}}/{{total}})",
     exportCanceled: "Exportation annulée ({{reason}})",
     exportedToDownloads: "{{filename}} exporté vers le dossier Téléchargements",
-    failedToExportJson: "Échec de l'exportation JSON",
+    failedToExportJson: "Échec de l'exportation JSON : {{reason}}",
     importCanceled: "Importation annulée ({{reason}})",
-    failedToImportJson: "Échec de l'importation JSON",
+    failedToImportJson: "Échec de l'importation JSON : {{reason}}",
+    failedToImportJsonAccess: "Échec de l'importation JSON : Le fichier est vide ou inaccessible",
   },
   dialogs: {
     saveSnapshot: {
diff --git a/src/utils.ts b/src/utils.ts
@@ -66,10 +66,9 @@ export async function downloadJson(filename: string, data: any): Promise<void> {
     const json = JSON.stringify(data, null, 2);
     const blob = new Blob([json], { type: "application/json" });
 
-    const w: any = window as any;
-    if (w && typeof w.showSaveFilePicker === "function") {
+    if (typeof window?.showSaveFilePicker === "function") {
       try {
-        const handle = await w.showSaveFilePicker({
+        const handle = await window.showSaveFilePicker({
           suggestedName: filename,
           types: [
             {
@@ -82,11 +81,28 @@ export async function downloadJson(filename: string, data: any): Promise<void> {
         await writable.write(blob);
         await writable.close();
         return;
-      } catch (err: any) {
-        if (err && (err.name === "AbortError" || err.name === "NotAllowedError")) {
-          showWarningToast(t('toasts.exportCanceled', { reason: err.name }));
+      } catch (err: unknown) {
+        const isError = err instanceof Error;
+        const errorName = isError ? err.name : 'Unknown';
+        const errorMessage = isError ? err.message : '';
+        
+        // Check if this is a file system error disguised as AbortError
+        const isFileSystemError = errorName === "AbortError" && (
+          errorMessage.includes('Failed to create') ||
+          errorMessage.includes('Failed to truncate') ||
+          errorMessage.includes('permission') ||
+          errorMessage.includes('access') ||
+          errorMessage.includes('denied')
+        );
+        
+        // Only treat as user cancellation if it's truly a user abort
+        if (errorName === "AbortError" && !isFileSystemError) {
           return;
         }
+        
+        const reason = isError ? `${errorName}: ${errorMessage}` : 'Unknown error';
+        showErrorToast(t('toasts.failedToExportJson', { reason }), { duration: 10000 });
+        return;
       }
     }
 
@@ -102,18 +118,19 @@ export async function downloadJson(filename: string, data: any): Promise<void> {
     showSuccessToast(t('toasts.exportedToDownloads', { filename }));
   } catch (e) {
     console.warn(`${APP_NAME}: downloadJson failed`, e);
-    showErrorToast(t('toasts.failedToExportJson'));
+    const isError = e instanceof Error;
+    const reason = isError ? `${e.name}: ${e.message}` : 'Unknown error';
+    showErrorToast(t('toasts.failedToExportJson', { reason }), { duration: 10000 });
   }
 }
 
 export async function uploadJson<T>(): Promise<T | null> {
   try {
-    const w: any = window as any;
     let fileContent: string | undefined;
 
-    if (w && typeof w.showOpenFilePicker === "function") {
+    if (typeof window?.showOpenFilePicker === "function") {
       try {
-        const [handle] = await w.showOpenFilePicker({
+        const [handle] = await window.showOpenFilePicker({
           multiple: false,
           types: [
             {
@@ -124,11 +141,15 @@ export async function uploadJson<T>(): Promise<T | null> {
         });
         const file = await handle.getFile();
         fileContent = await file.text();
-      } catch (err: any) {
-        if (err && (err.name === "AbortError" || err.name === "NotAllowedError")) {
-          showWarningToast(t('toasts.importCanceled', { reason: err.name }));
+      } catch (err: unknown) {
+        const isError = err instanceof Error;
+        const errorName = isError ? err.name : 'Unknown';
+        if (errorName === "AbortError") {
           return null;
         }
+        const reason = isError ? `${err.name}: ${err.message}` : 'Unknown error';
+        showErrorToast(t('toasts.failedToImportJson', { reason }), { duration: 10000 });
+        return null;
       }
     } else {
       // Fallback for browsers that don't support showOpenFilePicker
@@ -141,10 +162,27 @@ export async function uploadJson<T>(): Promise<T | null> {
           if (input.files?.length) {
             try {
               const file = input.files[0];
+              
+              if (file.size === 0) {
+                showErrorToast(t('toasts.failedToImportJsonAccess'), { duration: 10000 });
+                resolve(null);
+                return;
+              }
+              
               const text = await file.text();
+              
+              if (text.length === 0) {
+                showErrorToast(t('toasts.failedToImportJsonAccess'), { duration: 10000 });
+                resolve(null);
+                return;
+              }
+              
               resolve(text);
             } catch (readErr) {
               console.error(`${APP_NAME}: file read failed`, readErr);
+              const isError = readErr instanceof Error;
+              const reason = isError ? `${readErr.name}: ${readErr.message}` : 'Unknown error';
+              showErrorToast(t('toasts.failedToImportJson', { reason }), { duration: 10000 });
               resolve(null);
             }
           } else {
@@ -166,7 +204,9 @@ export async function uploadJson<T>(): Promise<T | null> {
     return data as T;
   } catch (e) {
     console.warn(`${APP_NAME}: uploadJson failed`, e);
-    showErrorToast(t('toasts.failedToImportJson'));
+    const isError = e instanceof Error;
+    const reason = isError ? `${e.name}: ${e.message}` : 'Unknown error';
+    showErrorToast(t('toasts.failedToImportJson', { reason }), { duration: 10000 });
     return null;
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -11,6 +11,7 @@`
`11`	`11`	`"devDependencies": {`
`12`	`12`	`"@types/react": "^19.2.2",`
`13`	`13`	`"@types/react-dom": "^19.2.2",`
	`14`	`+ "@types/wicg-file-system-access": "^2023.10.7",`
`14`	`15`	`"spicetify-creator": "^1.0.17"`
`15`	`16`	`}`
`16`	`17`	`}`