Refactor: Remove ant design component (#13143)

### What problem does this PR solve?

_Briefly describe what this PR aims to solve. Include background context
that will help reviewers understand the purpose of the PR._

### Type of change

- [x] Refactoring

web/src/utils/notification.ts

@@ -0,0 +1,58 @@
+import { ExternalToast, toast } from 'sonner';
+
+const defaultConfig: ExternalToast = { duration: 4000, position: 'top-right' };
+
+type NotificationOptions = {
+  message: string;
+  description?: string;
+  duration?: number;
+};
+
+const notification = {
+  success: (options: NotificationOptions) => {
+    const messageText = options.description
+      ? `${options.message}\n${options.description}`
+      : options.message;
+    toast.success(messageText, {
+      ...defaultConfig,
+      duration: options.duration
+        ? options.duration * 1000
+        : defaultConfig.duration,
+    });
+  },
+  error: (options: NotificationOptions) => {
+    const messageText = options.description
+      ? `${options.message}\n${options.description}`
+      : options.message;
+    toast.error(messageText, {
+      ...defaultConfig,
+      duration: options.duration
+        ? options.duration * 1000
+        : defaultConfig.duration,
+    });
+  },
+  warning: (options: NotificationOptions) => {
+    const messageText = options.description
+      ? `${options.message}\n${options.description}`
+      : options.message;
+    toast.warning(messageText, {
+      ...defaultConfig,
+      duration: options.duration
+        ? options.duration * 1000
+        : defaultConfig.duration,
+    });
+  },
+  info: (options: NotificationOptions) => {
+    const messageText = options.description
+      ? `${options.message}\n${options.description}`
+      : options.message;
+    toast.info(messageText, {
+      ...defaultConfig,
+      duration: options.duration
+        ? options.duration * 1000
+        : defaultConfig.duration,
+    });
+  },
+};
+
+export default notification;