@swan-io/shared-business 10.0.1 → 11.0.0

package/src/state/toasts.js

@@ -0,0 +1,88 @@
+import { atom, useAtom } from "react-atomic-state";
+// based on https://gist.github.com/ncou/3a0a1f89c8e22416d0d607f621a948a9
+const createProgress = ({ duration, onEnd }) => {
+    const callbacks = new Set();
+    let endDate = 0;
+    let timerId = 0;
+    const step = () => {
+        const value = (endDate - Date.now()) / duration;
+        callbacks.forEach(callback => callback(value));
+        animationRequest = window.requestAnimationFrame(step);
+    };
+    let animationRequest = window.requestAnimationFrame(step);
+    const start = () => {
+        endDate = Date.now() + duration;
+        timerId = window.setTimeout(() => {
+            clear();
+            onEnd();
+        }, duration);
+    };
+    const reset = () => {
+        window.clearTimeout(timerId);
+        start();
+    };
+    const subscribe = (callback) => {
+        callbacks.add(callback);
+        return () => {
+            callbacks.delete(callback);
+        };
+    };
+    const clear = () => {
+        document.removeEventListener("visibilitychange", onDocumentVisible);
+        window.clearTimeout(timerId);
+        window.cancelAnimationFrame(animationRequest);
+    };
+    const onDocumentVisible = () => {
+        document.removeEventListener("visibilitychange", onDocumentVisible);
+        reset();
+    };
+    if (document.hidden) {
+        document.addEventListener("visibilitychange", onDocumentVisible);
+    }
+    else {
+        reset();
+    }
+    return {
+        clear,
+        reset,
+        subscribe,
+    };
+};
+const toasts = atom([]);
+export const useToasts = () => useAtom(toasts);
+export const hideToast = (uid) => {
+    var _a;
+    const toast = toasts.get().find(toast => toast.uid === uid);
+    if (toast != null) {
+        (_a = toast.progress) === null || _a === void 0 ? void 0 : _a.clear();
+        toasts.set(toasts => toasts.filter(toast => toast.uid !== uid));
+    }
+};
+let errorToRequestId = new WeakMap();
+export const registerErrorToRequestId = (value) => {
+    errorToRequestId = value;
+};
+export const getErrorToRequestId = () => {
+    return errorToRequestId;
+};
+export const showToast = ({ variant, title, description, error, autoClose }) => {
+    var _a;
+    const uid = `${variant} - ${title} - ${description !== null && description !== void 0 ? description : ""}`;
+    const toast = toasts.get().find(toast => toast.uid === uid);
+    if (toast != null) {
+        (_a = toast.progress) === null || _a === void 0 ? void 0 : _a.reset();
+        return uid;
+    }
+    // by default, only info and success toasts are auto-closing
+    const shouldAutoClose = autoClose !== null && autoClose !== void 0 ? autoClose : (variant === "info" || variant === "success");
+    const progress = shouldAutoClose
+        ? createProgress({
+            duration: 10000,
+            onEnd: () => {
+                hideToast(uid);
+            },
+        })
+        : undefined;
+    toasts.set(toasts => [{ uid, variant, title, description, error, progress }, ...toasts]);
+    return uid;
+};