Move toasts to sonner (#6053)

app/actions/definitions/developer.tsx

@@ -1,6 +1,6 @@
 import { ToolsIcon, TrashIcon, UserIcon } from "outline-icons";
 import * as React from "react";
-import stores from "~/stores";
+import { toast } from "sonner";
 import { createAction } from "~/actions";
 import { DeveloperSection } from "~/actions/sections";
 import env from "~/env";
@@ -15,7 +15,7 @@ export const clearIndexedDB = createAction({
   section: DeveloperSection,
   perform: async ({ t }) => {
     await deleteAllDatabases();
-    stores.toasts.showToast(t("IndexedDB cache deleted"));
+    toast.message(t("IndexedDB cache deleted"));
   },
 });
 
@@ -29,9 +29,9 @@ export const createTestUsers = createAction({
 
     try {
       await client.post("/developer.create_test_users", { count });
-      stores.toasts.showToast(`${count} test users created`);
+      toast.message(`${count} test users created`);
     } catch (err) {
-      stores.toasts.showToast(err.message, { type: "error" });
+      toast.error(err.message);
     }
   },
 });
@@ -41,15 +41,8 @@ export const createToast = createAction({
   section: DeveloperSection,
   visible: () => env.ENVIRONMENT === "development",
   perform: async () => {
-    stores.toasts.showToast("Hello world", {
-      type: "info",
-      timeout: 30000,
-      action: {
-        text: "Click me",
-        onClick: () => {
-          stores.toasts.showToast("Clicked!");
-        },
-      },
+    toast.message("Hello world", {
+      duration: 30000,
     });
   },
 });
@@ -60,7 +53,7 @@ export const toggleDebugLogging = createAction({
   section: DeveloperSection,
   perform: async ({ t }) => {
     Logger.debugLoggingEnabled = !Logger.debugLoggingEnabled;
-    stores.toasts.showToast(
+    toast.message(
       Logger.debugLoggingEnabled
         ? t("Debug logging enabled")
         : t("Debug logging disabled")