From 6901c985fdc4b8fb77d53ef8a0dd8e302ddf5d5c Mon Sep 17 00:00:00 2001
From: ajnart <ajnart@pm.me>
Date: Mon, 15 May 2023 16:22:58 +0900
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Add=20notifications=20when=20chanin?=
 =?UTF-8?q?g=20configs?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Config/ConfigChanger.tsx | 31 ++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/components/Config/ConfigChanger.tsx b/src/components/Config/ConfigChanger.tsx
index 640c9a386..08ab2f9d9 100644
--- a/src/components/Config/ConfigChanger.tsx
+++ b/src/components/Config/ConfigChanger.tsx
@@ -5,6 +5,8 @@ import { setCookie } from 'cookies-next';
 import { useTranslation } from 'next-i18next';
 import { useRouter } from 'next/router';
 import { useState } from 'react';
+import { notifications } from '@mantine/notifications';
+import { IconCheck } from '@tabler/icons';
 import { useConfigContext } from '../../config/provider';
 
 export default function ConfigChanger() {
@@ -23,10 +25,33 @@ export default function ConfigChanger() {
       sameSite: 'strict',
     });
     setActiveConfig(value);
-    toggle();
 
-    router.push(`/${value}`);
-    setConfigName(value);
+    notifications.show({
+      id: 'load-data',
+      loading: true,
+      title: t('configSelect.loadingNew'),
+      radius: 'md',
+      withCloseButton: false,
+      message: t('configSelect.pleaseWait'),
+      autoClose: false,
+    });
+
+    setTimeout(() => {
+      notifications.update({
+        id: 'load-data',
+        color: 'teal',
+        radius: 'md',
+        withCloseButton: false,
+        title: t('configSelect.loadingNew'),
+        message: t('configSelect.pleaseWait'),
+        icon: <IconCheck size="1rem" />,
+        autoClose: 2000,
+      });
+    }, 3000);
+    setTimeout(() => {
+      router.push(`/${value}`);
+      setConfigName(value);
+    }, 500);
   };
 
   // If configlist is empty, return a loading indicator