Toasts

client/src/utilities.ts

@@ -1,3 +1,6 @@
+import { AxiosError } from "axios";
+import toast from "react-hot-toast";
+
 export function getTimeOfDay(): number {
   const currentHour = new Date().getHours();
 
@@ -9,3 +12,30 @@ export function getTimeOfDay(): number {
     return 2; // Evening
   }
 }
+
+export const popToast = (message: string, type: number) => {
+  const words = message.split(" ");
+  const duration = Math.max(4, words.length * 1);
+
+  toast(message, {
+    duration: duration * 1000, // Convert to milliseconds
+    position: "top-center",
+
+    // Custom Icon
+    icon: type === 0 ? "ℹ️" : type === 1 ? "✅" : type === 2 ? "❌" : undefined,
+
+    // Aria
+    ariaProps: {
+      role: "status",
+      "aria-live": "polite",
+    },
+  });
+};
+
+export const popErrorToast = (error: any) => {
+  try {
+    popToast(((error as AxiosError).response?.data as any).message, 2);
+  } catch {
+    popToast("An unexpected error occured!\nPlease try again later.", 2);
+  }
+};