From 86da6c2b06460c210a587223054c2ada7b2268dd Mon Sep 17 00:00:00 2001
From: arabcoders <admin@arabcoders.org>
Date: Thu, 19 Jun 2025 18:11:19 +0300
Subject: [PATCH] improve the import/export process to allow for non-ascii
 characters.

---
 ui/components/ConditionForm.vue    | 13 ++-----------
 ui/components/NotificationForm.vue | 14 +++-----------
 ui/components/PresetForm.vue       | 14 +++-----------
 ui/components/TaskForm.vue         | 13 ++-----------
 ui/pages/conditions.vue            |  3 ++-
 ui/pages/notifications.vue         |  3 ++-
 ui/pages/presets.vue               |  3 ++-
 ui/pages/tasks.vue                 |  4 ++--
 ui/utils/importer.ts               | 21 +++++++++++++++++++++
 ui/utils/index.js                  | 29 -----------------------------
 10 files changed, 39 insertions(+), 78 deletions(-)
 create mode 100644 ui/utils/importer.ts

diff --git a/ui/components/ConditionForm.vue b/ui/components/ConditionForm.vue
index a39dbc3c..39619f5d 100644
--- a/ui/components/ConditionForm.vue
+++ b/ui/components/ConditionForm.vue
@@ -209,6 +209,7 @@
 <script setup>
 import { useStorage } from '@vueuse/core'
 const emitter = defineEmits(['cancel', 'submit'])
+import { decode } from '~/utils/importer'
 
 const props = defineProps({
   reference: {
@@ -321,18 +322,8 @@ const importItem = async () => {
     return
   }
 
-  if (false === val.startsWith('{')) {
-    try {
-      val = base64UrlDecode(val)
-    } catch (e) {
-      console.error(e)
-      toast.error(`Failed to decode string. ${e.message}`)
-      return
-    }
-  }
-
   try {
-    const item = JSON.parse(val)
+    const item = decode(val)
 
     if (!item?._type || 'condition' !== item._type) {
       toast.error(`Invalid import string. Expected type 'condition', got '${item._type ?? 'unknown'}'.`)
diff --git a/ui/components/NotificationForm.vue b/ui/components/NotificationForm.vue
index ded92e10..81e06ffe 100644
--- a/ui/components/NotificationForm.vue
+++ b/ui/components/NotificationForm.vue
@@ -267,6 +267,8 @@
 
 <script setup>
 import { useStorage } from '@vueuse/core'
+import { decode } from '~/utils/importer'
+
 const emitter = defineEmits(['cancel', 'submit']);
 const toast = useNotification();
 const props = defineProps({
@@ -339,18 +341,8 @@ const importItem = async () => {
     return
   }
 
-  if (false === val.startsWith('{')) {
-    try {
-      val = base64UrlDecode(val)
-    } catch (e) {
-      console.error(e)
-      toast.error(`Failed to decode string. ${e.message}`)
-      return
-    }
-  }
-
   try {
-    const item = JSON.parse(val)
+    const item = decode(val)
 
     if ('notification' !== item._type) {
       toast.error(`Invalid import string. Expected type 'notification', got '${item._type}'.`)
diff --git a/ui/components/PresetForm.vue b/ui/components/PresetForm.vue
index d4b56f73..aaeebfcb 100644
--- a/ui/components/PresetForm.vue
+++ b/ui/components/PresetForm.vue
@@ -232,6 +232,8 @@
 
 <script setup>
 import { useStorage } from '@vueuse/core'
+import { decode } from '~/utils/importer'
+
 const emitter = defineEmits(['cancel', 'submit']);
 
 const props = defineProps({
@@ -351,18 +353,8 @@ const importItem = async () => {
     return
   }
 
-  if (false === val.startsWith('{')) {
-    try {
-      val = base64UrlDecode(val)
-    } catch (e) {
-      console.error(e)
-      toast.error(`Failed to decode string. ${e.message}`)
-      return
-    }
-  }
-
   try {
-    const item = JSON.parse(val)
+    const item = decode(val)
 
     if (!item?._type || 'preset' !== item._type) {
       toast.error(`Invalid import string. Expected type 'preset', got '${item._type ?? 'unknown'}'.`)
diff --git a/ui/components/TaskForm.vue b/ui/components/TaskForm.vue
index e12c9ec7..6956c6a0 100644
--- a/ui/components/TaskForm.vue
+++ b/ui/components/TaskForm.vue
@@ -271,6 +271,7 @@
 <script setup>
 import { useStorage } from '@vueuse/core'
 import { CronExpressionParser } from 'cron-parser'
+import { decode } from '~/utils/importer'
 
 const props = defineProps({
   reference: {
@@ -352,18 +353,8 @@ const importItem = async () => {
     return
   }
 
-  if (false === val.startsWith('{')) {
-    try {
-      val = base64UrlDecode(val)
-    } catch (e) {
-      console.error(e)
-      toast.error(`Failed to decode string. ${e.message}`)
-      return
-    }
-  }
-
   try {
-    const item = JSON.parse(val)
+    const item = decode(val)
 
     if ('task' !== item._type) {
       toast.error(`Invalid import string. Expected type 'task', got '${item._type}'.`)
diff --git a/ui/pages/conditions.vue b/ui/pages/conditions.vue
index cbd080dc..6c3c2a54 100644
--- a/ui/pages/conditions.vue
+++ b/ui/pages/conditions.vue
@@ -116,6 +116,7 @@
 
 <script setup>
 import { request } from '~/utils/index'
+import { encode } from '~/utils/importer'
 
 const toast = useNotification()
 const config = useConfigStore()
@@ -286,6 +287,6 @@ const exportItem = item => {
   userData['_type'] = 'condition'
   userData['_version'] = '1.0'
 
-  return copyText(base64UrlEncode(JSON.stringify(userData)))
+  return copyText(encode(userData))
 }
 </script>
diff --git a/ui/pages/notifications.vue b/ui/pages/notifications.vue
index 9a3457a4..846f27ed 100644
--- a/ui/pages/notifications.vue
+++ b/ui/pages/notifications.vue
@@ -139,6 +139,7 @@ div.is-centered {
 
 <script setup>
 import { request } from '~/utils/index'
+import { encode } from '~/utils/importer'
 
 const toast = useNotification()
 const config = useConfigStore()
@@ -337,6 +338,6 @@ const exportItem = async item => {
   data['_type'] = 'notification'
   data['_version'] = '1.0'
 
-  return copyText(base64UrlEncode(JSON.stringify(data)))
+  return copyText(encode(data))
 }
 </script>
diff --git a/ui/pages/presets.vue b/ui/pages/presets.vue
index d5fd477e..8da337fd 100644
--- a/ui/pages/presets.vue
+++ b/ui/pages/presets.vue
@@ -213,6 +213,7 @@ div.is-centered {
 <script setup>
 import { useStorage } from '@vueuse/core'
 import { request } from '~/utils/index'
+import { encode } from '~/utils/importer'
 
 const toast = useNotification()
 const config = useConfigStore()
@@ -400,7 +401,7 @@ const exportItem = item => {
   userData['_type'] = 'preset'
   userData['_version'] = '2.5'
 
-  return copyText(base64UrlEncode(JSON.stringify(userData)))
+  return copyText(encode(userData))
 }
 
 const calcPath = (path) => {
diff --git a/ui/pages/tasks.vue b/ui/pages/tasks.vue
index bc5d7785..e8ed4049 100644
--- a/ui/pages/tasks.vue
+++ b/ui/pages/tasks.vue
@@ -243,6 +243,7 @@ import moment from 'moment'
 import { useStorage } from '@vueuse/core'
 import { CronExpressionParser } from 'cron-parser'
 import { request } from '~/utils/index'
+import { encode } from '~/utils/importer'
 import type { task_item, exported_task, error_response } from '~/@types/tasks'
 
 const box = useConfirm()
@@ -496,8 +497,7 @@ const exportItem = async (item: task_item) => {
   data._type = 'task'
   data._version = '2.0'
 
-  return copyText(base64UrlEncode(JSON.stringify(data)));
+  return copyText(encode(data));
 }
 
-
 </script>
diff --git a/ui/utils/importer.ts b/ui/utils/importer.ts
new file mode 100644
index 00000000..f3d4484b
--- /dev/null
+++ b/ui/utils/importer.ts
@@ -0,0 +1,21 @@
+const encode = (obj: Record<string, any>): string => {
+  const jsonStr = JSON.stringify(obj);
+  const utf8Bytes = new TextEncoder().encode(jsonStr);
+  const binary = String.fromCharCode(...utf8Bytes);
+  const base64 = btoa(binary);
+  return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
+}
+
+const decode = (str: string): object => {
+  const base64 = str
+    .replace(/-/g, '+')
+    .replace(/_/g, '/')
+    .padEnd(str.length + (4 - str.length % 4) % 4, '=');
+
+  const binary = atob(base64);
+  const bytes = Uint8Array.from(binary, c => c.charCodeAt(0));
+  const jsonStr = new TextDecoder().decode(bytes);
+  return JSON.parse(jsonStr);
+}
+
+export { encode, decode }
diff --git a/ui/utils/index.js b/ui/utils/index.js
index 7ec8308d..20a27c32 100644
--- a/ui/utils/index.js
+++ b/ui/utils/index.js
@@ -406,33 +406,6 @@ const convertCliOptions = async opts => {
   return data
 }
 
-/**
- * URL Safe Base64 Encode.
- *
- * @param {String} data The data to encode
- *
- * @returns {String} The encoded data
- */
-const base64UrlEncode = data => btoa(data).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
-
-/**
- * URL Safe Base64 Decode.
- *
- * @param {String} input The input string to decode
- *
- * @returns {String} The decoded data
- */
-const base64UrlDecode = input => {
-  let base64 = input.replace(/-/g, '+').replace(/_/g, '/');
-  const pad = base64.length % 4;
-  if (pad) {
-    base64 += '='.repeat(4 - pad);
-  }
-
-  return atob(base64);
-}
-
-
 /**
  * Check if array or object has data.
  *
@@ -539,8 +512,6 @@ export {
   makeDownload,
   formatBytes,
   convertCliOptions,
-  base64UrlEncode,
-  base64UrlDecode,
   has_data,
   toggleClass,
   cleanObject,