fix: show toast for infinite duration

models/baseModels/ERPNextSyncSettings/ERPNextSyncSettings.ts

@@ -43,6 +43,12 @@ export class ERPNextSyncSettings extends Doc {
 
   async change(ch: ChangeArg) {
     if (ch.changed === 'syncDataFromServer') {
+      const { showToast } = await import('src/utils/interactive');
+      showToast({
+        type: 'warning',
+        message: 'Fetching data from server.',
+        duration: 'very_long'
+      });
       await initERPNSync(this.fyo);
       ipc.reloadWindow();
     } else if (ch.changed === 'syncDataToServer') {

src/components/Toast.vue

@@ -42,7 +42,30 @@
             {{ actionText }}
           </button>
         </div>
+        <div class="ms-auto flex items-center">
+          <svg
+            v-if="isPersistent"
+            class="animate-spin h-4 w-4 text-gray-600 dark:text-gray-400"
+            viewBox="0 0 24 24"
+          >
+            <circle
+              class="opacity-25"
+              cx="12"
+              cy="12"
+              r="10"
+              stroke="currentColor"
+              stroke-width="4"
+              fill="none"
+            />
+            <path
+              class="opacity-75"
+              fill="currentColor"
+              d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"
+            />
+          </svg>
+
           <feather-icon
+            v-else
             name="x"
             class="
               w-4
@@ -57,6 +80,7 @@
             @click="closeToast"
           />
         </div>
+      </div>
     </Transition>
   </Teleport>
 </template>
@@ -87,11 +111,16 @@ export default defineComponent({
     config() {
       return getIconConfig(this.type);
     },
+    isPersistent() {
+      return this.duration === 'very_long';
+    },
   },
   async mounted() {
     const duration = toastDurationMap[this.duration];
     await nextTick(() => (this.open = true));
+    if (duration !== Infinity) {
       setTimeout(this.closeToast, duration);
+    }
   },
   methods: {
     actionClicked() {

src/utils/ui.ts

@@ -37,7 +37,11 @@ import {
   UIGroupedFields,
 } from './types';
 
-export const toastDurationMap = { short: 2_500, long: 5_000 } as const;
+export const toastDurationMap = {
+  short: 2_500,
+  long: 5_000,
+  very_long: Infinity,
+} as const;
 
 export async function openQuickEdit({
   doc,