From eb25232e5d68c898d20932243b1d3107e692e4d3 Mon Sep 17 00:00:00 2001 From: Dorian Grasset Date: Sat, 3 Aug 2024 22:32:23 +0200 Subject: [PATCH] fix(GIST-15): import toast fixed --- src/components/shadcn/use-toast.ts | 54 +++++++++++++----------------- 1 file changed, 24 insertions(+), 30 deletions(-) diff --git a/src/components/shadcn/use-toast.ts b/src/components/shadcn/use-toast.ts index 02e111d..637e7a5 100644 --- a/src/components/shadcn/use-toast.ts +++ b/src/components/shadcn/use-toast.ts @@ -1,12 +1,8 @@ -"use client" +'use client' // Inspired by react-hot-toast library -import * as React from "react" - -import type { - ToastActionElement, - ToastProps, -} from "@/components/ui/toast" +import * as React from 'react' +import { ToastActionElement, ToastProps } from './toast' const TOAST_LIMIT = 1 const TOAST_REMOVE_DELAY = 1000000 @@ -19,10 +15,10 @@ type ToasterToast = ToastProps & { } const actionTypes = { - ADD_TOAST: "ADD_TOAST", - UPDATE_TOAST: "UPDATE_TOAST", - DISMISS_TOAST: "DISMISS_TOAST", - REMOVE_TOAST: "REMOVE_TOAST", + ADD_TOAST: 'ADD_TOAST', + UPDATE_TOAST: 'UPDATE_TOAST', + DISMISS_TOAST: 'DISMISS_TOAST', + REMOVE_TOAST: 'REMOVE_TOAST', } as const let count = 0 @@ -36,20 +32,20 @@ type ActionType = typeof actionTypes type Action = | { - type: ActionType["ADD_TOAST"] + type: ActionType['ADD_TOAST'] toast: ToasterToast } | { - type: ActionType["UPDATE_TOAST"] + type: ActionType['UPDATE_TOAST'] toast: Partial } | { - type: ActionType["DISMISS_TOAST"] - toastId?: ToasterToast["id"] + type: ActionType['DISMISS_TOAST'] + toastId?: ToasterToast['id'] } | { - type: ActionType["REMOVE_TOAST"] - toastId?: ToasterToast["id"] + type: ActionType['REMOVE_TOAST'] + toastId?: ToasterToast['id'] } interface State { @@ -66,7 +62,7 @@ const addToRemoveQueue = (toastId: string) => { const timeout = setTimeout(() => { toastTimeouts.delete(toastId) dispatch({ - type: "REMOVE_TOAST", + type: 'REMOVE_TOAST', toastId: toastId, }) }, TOAST_REMOVE_DELAY) @@ -76,21 +72,19 @@ const addToRemoveQueue = (toastId: string) => { export const reducer = (state: State, action: Action): State => { switch (action.type) { - case "ADD_TOAST": + case 'ADD_TOAST': return { ...state, toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT), } - case "UPDATE_TOAST": + case 'UPDATE_TOAST': return { ...state, - toasts: state.toasts.map((t) => - t.id === action.toast.id ? { ...t, ...action.toast } : t - ), + toasts: state.toasts.map((t) => (t.id === action.toast.id ? { ...t, ...action.toast } : t)), } - case "DISMISS_TOAST": { + case 'DISMISS_TOAST': { const { toastId } = action // ! Side effects ! - This could be extracted into a dismissToast() action, @@ -115,7 +109,7 @@ export const reducer = (state: State, action: Action): State => { ), } } - case "REMOVE_TOAST": + case 'REMOVE_TOAST': if (action.toastId === undefined) { return { ...state, @@ -140,20 +134,20 @@ function dispatch(action: Action) { }) } -type Toast = Omit +type Toast = Omit function toast({ ...props }: Toast) { const id = genId() const update = (props: ToasterToast) => dispatch({ - type: "UPDATE_TOAST", + type: 'UPDATE_TOAST', toast: { ...props, id }, }) - const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id }) + const dismiss = () => dispatch({ type: 'DISMISS_TOAST', toastId: id }) dispatch({ - type: "ADD_TOAST", + type: 'ADD_TOAST', toast: { ...props, id, @@ -187,7 +181,7 @@ function useToast() { return { ...state, toast, - dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }), + dismiss: (toastId?: string) => dispatch({ type: 'DISMISS_TOAST', toastId }), } }