+
{title && {title}}
{description && (
{description}
@@ -25,9 +25,9 @@ export function Toaster() {
{action}
- );
+ )
})}
- );
+ )
}
diff --git a/packages/section-blog-theme/components/ui/tooltip.tsx b/packages/section-blog-theme/components/ui/tooltip.tsx
index 299fe56..639956f 100644
--- a/packages/section-blog-theme/components/ui/tooltip.tsx
+++ b/packages/section-blog-theme/components/ui/tooltip.tsx
@@ -1,13 +1,13 @@
-import * as React from "react";
-import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import * as React from "react"
+import * as TooltipPrimitive from "@radix-ui/react-tooltip"
-import { cn } from "@/utility/utils";
+import { cn } from "@/utility/utils"
-const TooltipProvider = TooltipPrimitive.Provider;
+const TooltipProvider = TooltipPrimitive.Provider
-const Tooltip = TooltipPrimitive.Root;
+const Tooltip = TooltipPrimitive.Root
-const TooltipTrigger = TooltipPrimitive.Trigger;
+const TooltipTrigger = TooltipPrimitive.Trigger
const TooltipContent = React.forwardRef<
React.ElementRef,
@@ -17,12 +17,12 @@ const TooltipContent = React.forwardRef<
ref={ref}
sideOffset={sideOffset}
className={cn(
- "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
- className,
+ "nx-z-50 nx-overflow-hidden nx-rounded-md nx-bg-primary nx-px-3 nx-py-1.5 nx-text-xs nx-text-primary-foreground nx-animate-in nx-fade-in-0 nx-zoom-in-95 data-[state=closed]:nx-animate-out data-[state=closed]:nx-fade-out-0 data-[state=closed]:nx-zoom-out-95 data-[side=bottom]:nx-slide-in-from-top-2 data-[side=left]:nx-slide-in-from-right-2 data-[side=right]:nx-slide-in-from-left-2 data-[side=top]:nx-slide-in-from-bottom-2",
+ className
)}
{...props}
/>
-));
-TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+))
+TooltipContent.displayName = TooltipPrimitive.Content.displayName
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
diff --git a/packages/section-blog-theme/components/ui/use-toast.ts b/packages/section-blog-theme/components/ui/use-toast.ts
index a799d87..cbd2ac4 100644
--- a/packages/section-blog-theme/components/ui/use-toast.ts
+++ b/packages/section-blog-theme/components/ui/use-toast.ts
@@ -1,73 +1,76 @@
// Inspired by react-hot-toast library
-import * as React from "react";
+import * as React from "react"
-import type { ToastActionElement, ToastProps } from "@/components//ui/toast";
+import type {
+ ToastActionElement,
+ ToastProps,
+} from "@/components//ui/toast"
-const TOAST_LIMIT = 1;
-const TOAST_REMOVE_DELAY = 1000000;
+const TOAST_LIMIT = 1
+const TOAST_REMOVE_DELAY = 1000000
type ToasterToast = ToastProps & {
- id: string;
- title?: React.ReactNode;
- description?: React.ReactNode;
- action?: ToastActionElement;
-};
+ id: string
+ title?: React.ReactNode
+ description?: React.ReactNode
+ action?: ToastActionElement
+}
const actionTypes = {
ADD_TOAST: "ADD_TOAST",
UPDATE_TOAST: "UPDATE_TOAST",
DISMISS_TOAST: "DISMISS_TOAST",
REMOVE_TOAST: "REMOVE_TOAST",
-} as const;
+} as const
-let count = 0;
+let count = 0
function genId() {
- count = (count + 1) % Number.MAX_VALUE;
- return count.toString();
+ count = (count + 1) % Number.MAX_SAFE_INTEGER
+ return count.toString()
}
-type ActionType = typeof actionTypes;
+type ActionType = typeof actionTypes
type Action =
| {
- type: ActionType["ADD_TOAST"];
- toast: ToasterToast;
+ type: ActionType["ADD_TOAST"]
+ toast: ToasterToast
}
| {
- type: ActionType["UPDATE_TOAST"];
- toast: Partial;
+ 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 {
- toasts: ToasterToast[];
+ toasts: ToasterToast[]
}
-const toastTimeouts = new Map>();
+const toastTimeouts = new Map>()
const addToRemoveQueue = (toastId: string) => {
if (toastTimeouts.has(toastId)) {
- return;
+ return
}
const timeout = setTimeout(() => {
- toastTimeouts.delete(toastId);
+ toastTimeouts.delete(toastId)
dispatch({
type: "REMOVE_TOAST",
toastId: toastId,
- });
- }, TOAST_REMOVE_DELAY);
+ })
+ }, TOAST_REMOVE_DELAY)
- toastTimeouts.set(toastId, timeout);
-};
+ toastTimeouts.set(toastId, timeout)
+}
export const reducer = (state: State, action: Action): State => {
switch (action.type) {
@@ -75,27 +78,27 @@ export const reducer = (state: State, action: Action): State => {
return {
...state,
toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
- };
+ }
case "UPDATE_TOAST":
return {
...state,
toasts: state.toasts.map((t) =>
- t.id === action.toast.id ? { ...t, ...action.toast } : t,
+ t.id === action.toast.id ? { ...t, ...action.toast } : t
),
- };
+ }
case "DISMISS_TOAST": {
- const { toastId } = action;
+ const { toastId } = action
// ! Side effects ! - This could be extracted into a dismissToast() action,
// but I'll keep it here for simplicity
if (toastId) {
- addToRemoveQueue(toastId);
+ addToRemoveQueue(toastId)
} else {
state.toasts.forEach((toast) => {
- addToRemoveQueue(toast.id);
- });
+ addToRemoveQueue(toast.id)
+ })
}
return {
@@ -106,46 +109,46 @@ export const reducer = (state: State, action: Action): State => {
...t,
open: false,
}
- : t,
+ : t
),
- };
+ }
}
case "REMOVE_TOAST":
if (action.toastId === undefined) {
return {
...state,
toasts: [],
- };
+ }
}
return {
...state,
toasts: state.toasts.filter((t) => t.id !== action.toastId),
- };
+ }
}
-};
+}
-const listeners: Array<(state: State) => void> = [];
+const listeners: Array<(state: State) => void> = []
-let memoryState: State = { toasts: [] };
+let memoryState: State = { toasts: [] }
function dispatch(action: Action) {
- memoryState = reducer(memoryState, action);
+ memoryState = reducer(memoryState, action)
listeners.forEach((listener) => {
- listener(memoryState);
- });
+ listener(memoryState)
+ })
}
-type Toast = Omit;
+type Toast = Omit
function toast({ ...props }: Toast) {
- const id = genId();
+ const id = genId()
const update = (props: ToasterToast) =>
dispatch({
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",
@@ -154,36 +157,36 @@ function toast({ ...props }: Toast) {
id,
open: true,
onOpenChange: (open) => {
- if (!open) dismiss();
+ if (!open) dismiss()
},
},
- });
+ })
return {
id: id,
dismiss,
update,
- };
+ }
}
function useToast() {
- const [state, setState] = React.useState(memoryState);
+ const [state, setState] = React.useState(memoryState)
React.useEffect(() => {
- listeners.push(setState);
+ listeners.push(setState)
return () => {
- const index = listeners.indexOf(setState);
+ const index = listeners.indexOf(setState)
if (index > -1) {
- listeners.splice(index, 1);
+ listeners.splice(index, 1)
}
- };
- }, [state]);
+ }
+ }, [state])
return {
...state,
toast,
dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
- };
+ }
}
-export { useToast, toast };
+export { useToast, toast }