@questpie/admin 3.0.3 → 3.0.5

package/dist/client/components/actions/action-button.mjs

@@ -1,11 +1,11 @@
 "use client";
 
 import { useResolveText, useTranslation } from "../../i18n/hooks.mjs";
-import { selectAuthClient, useAdminStore } from "../../runtime/provider.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { selectAuthClient, selectClient, useAdminStore } from "../../runtime/provider.mjs";
 import { resolveIconElement } from "../component-renderer.mjs";
 import { Button } from "../ui/button.mjs";
 import { ConfirmationDialog } from "./confirmation-dialog.mjs";
-import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { useQueryClient } from "@tanstack/react-query";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -30,215 +30,153 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 * />
 * ```
 */
-function ActionButton(t0) {
-	const $ = c(47);
-	const { action, collection, item, items, helpers, size: t1, className, iconOnly: t2, onOpenDialog } = t0;
-	const size = t1 === void 0 ? "default" : t1;
-	const iconOnly = t2 === void 0 ? false : t2;
+function ActionButton({ action, collection, item, items, helpers, size = "default", className, iconOnly = false, presentation = "button", onOpenDialog }) {
 	const resolveText = useResolveText();
 	const { t } = useTranslation();
 	const authClient = useAdminStore(selectAuthClient);
+	const client = useAdminStore(selectClient);
 	const queryClient = useQueryClient();
 	const [showConfirm, setShowConfirm] = React.useState(false);
 	const [isLoading, setIsLoading] = React.useState(false);
-	let t3;
-	if ($[0] !== queryClient) {
-		t3 = {
-			invalidateQueries: (filters) => queryClient.invalidateQueries(filters),
-			refetchQueries: (filters_0) => queryClient.refetchQueries(filters_0),
-			resetQueries: (filters_1) => queryClient.resetQueries(filters_1)
-		};
-		$[0] = queryClient;
-		$[1] = t3;
-	} else t3 = $[1];
-	const actionQueryClient = t3;
-	let t4;
-	if ($[2] !== actionQueryClient || $[3] !== authClient || $[4] !== collection || $[5] !== helpers || $[6] !== item || $[7] !== items) {
-		t4 = {
-			item,
-			items,
-			collection,
-			helpers,
-			queryClient: actionQueryClient,
-			authClient
-		};
-		$[2] = actionQueryClient;
-		$[3] = authClient;
-		$[4] = collection;
-		$[5] = helpers;
-		$[6] = item;
-		$[7] = items;
-		$[8] = t4;
-	} else t4 = $[8];
-	const ctx = t4;
-	let t5;
-	bb0: {
-		if (action.visible === void 0) {
-			t5 = true;
-			break bb0;
-		}
-		if (typeof action.visible === "function") {
-			t5 = action.visible(ctx);
-			break bb0;
-		}
-		t5 = action.visible;
-	}
-	const isVisible = t5;
-	let t6;
-	bb1: {
-		if (action.disabled === void 0) {
-			t6 = false;
-			break bb1;
-		}
-		if (typeof action.disabled === "function") {
-			let t7$1;
-			if ($[9] !== action || $[10] !== ctx) {
-				t7$1 = action.disabled(ctx);
-				$[9] = action;
-				$[10] = ctx;
-				$[11] = t7$1;
-			} else t7$1 = $[11];
-			t6 = t7$1;
-			break bb1;
-		}
-		t6 = action.disabled;
-	}
-	const isDisabled = t6;
+	const actionQueryClient = React.useMemo(() => ({
+		invalidateQueries: (filters) => queryClient.invalidateQueries(filters),
+		refetchQueries: (filters_0) => queryClient.refetchQueries(filters_0),
+		resetQueries: (filters_1) => queryClient.resetQueries(filters_1)
+	}), [queryClient]);
+	const ctx = React.useMemo(() => ({
+		item,
+		items,
+		collection,
+		helpers,
+		queryClient: actionQueryClient,
+		authClient
+	}), [
+		item,
+		items,
+		collection,
+		helpers,
+		actionQueryClient,
+		authClient
+	]);
+	const isVisible = React.useMemo(() => {
+		if (action.visible === void 0) return true;
+		if (typeof action.visible === "function") return action.visible(ctx);
+		return action.visible;
+	}, [action, ctx]);
+	const isDisabled = React.useMemo(() => {
+		if (action.disabled === void 0) return false;
+		if (typeof action.disabled === "function") return action.disabled(ctx);
+		return action.disabled;
+	}, [action, ctx]);
 	if (!isVisible) return null;
-	let t7;
-	if ($[12] !== action || $[13] !== collection || $[14] !== ctx || $[15] !== helpers || $[16] !== item || $[17] !== onOpenDialog || $[18] !== t) {
-		t7 = async () => {
-			const { handler } = action;
-			bb39: switch (handler.type) {
-				case "navigate": {
-					const path = typeof handler.path === "function" ? handler.path(item) : handler.path;
-					helpers.navigate(`${helpers.basePath}/collections/${collection}/${path}`);
-					break bb39;
-				}
-				case "api": {
-					setIsLoading(true);
-					const itemAny = item;
-					const itemId = itemAny != null ? String(itemAny.id) : "";
-					const method = handler.method ? handler.method : "POST";
-					const endpoint = handler.endpoint.replace("{id}", itemId);
-					try {
+	const executeAction = async () => {
+		const { handler } = action;
+		switch (handler.type) {
+			case "navigate": {
+				const path = typeof handler.path === "function" ? handler.path(item) : handler.path;
+				helpers.navigate(`${helpers.basePath}/collections/${collection}/${path}`);
+				break;
+			}
+			case "api": {
+				setIsLoading(true);
+				const itemAny = item;
+				const itemId_0 = itemAny != null ? String(itemAny.id) : "";
+				const method = handler.method ? handler.method : "POST";
+				const endpoint = handler.endpoint.replace("{id}", itemId_0);
+				try {
+					const collectionClient = client.collections?.[collection];
+					if (method === "DELETE" && collectionClient?.delete) {
+						if (!itemId_0) throw new Error(t("toast.deleteFailed"));
+						await collectionClient.delete({ id: itemId_0 });
+						helpers.toast.success(t("toast.deleteSuccess"));
+						await helpers.invalidateCollection(collection);
+					} else {
 						helpers.toast.info(`API call: ${method} ${endpoint}`);
 						helpers.refresh();
-						setIsLoading(false);
-					} catch (t8$1) {
-						helpers.toast.error(t("error.actionFailed"));
-						setIsLoading(false);
 					}
-					break bb39;
+					setIsLoading(false);
+				} catch (error_1) {
+					helpers.toast.error(error_1 instanceof Error ? error_1.message : t("error.actionFailed"));
+					setIsLoading(false);
 				}
-				case "custom":
-					setIsLoading(true);
-					try {
-						await handler.fn(ctx);
-						setIsLoading(false);
-					} catch (t9$1) {
-						helpers.toast.error(t("error.actionFailed"));
-						setIsLoading(false);
-					}
-					break bb39;
-				case "dialog":
-				case "form":
-					onOpenDialog?.(action);
-					break bb39;
-				case "server": onOpenDialog?.(action);
+				break;
 			}
-		};
-		$[12] = action;
-		$[13] = collection;
-		$[14] = ctx;
-		$[15] = helpers;
-		$[16] = item;
-		$[17] = onOpenDialog;
-		$[18] = t;
-		$[19] = t7;
-	} else t7 = $[19];
-	const executeAction = t7;
-	let t8;
-	if ($[20] !== action.confirmation || $[21] !== executeAction) {
-		t8 = (e) => {
-			e.stopPropagation();
-			if (action.confirmation) setShowConfirm(true);
-			else executeAction();
-		};
-		$[20] = action.confirmation;
-		$[21] = executeAction;
-		$[22] = t8;
-	} else t8 = $[22];
-	const handleClick = t8;
-	let t9;
-	if ($[23] !== executeAction) {
-		t9 = async () => {
-			await executeAction();
-		};
-		$[23] = executeAction;
-		$[24] = t9;
-	} else t9 = $[24];
-	const handleConfirm = t9;
-	let t10;
-	if ($[25] !== action.icon) {
-		t10 = resolveIconElement(action.icon, { "data-icon": "inline-start" });
-		$[25] = action.icon;
-		$[26] = t10;
-	} else t10 = $[26];
-	const iconElement = t10;
-	const t11 = action.variant || "default";
-	const t12 = iconOnly ? "icon-sm" : size;
-	const t13 = isDisabled || isLoading;
-	let t14;
-	if ($[27] !== action.label || $[28] !== iconOnly || $[29] !== resolveText) {
-		t14 = !iconOnly && resolveText(action.label);
-		$[27] = action.label;
-		$[28] = iconOnly;
-		$[29] = resolveText;
-		$[30] = t14;
-	} else t14 = $[30];
-	let t15;
-	if ($[31] !== className || $[32] !== handleClick || $[33] !== iconElement || $[34] !== t11 || $[35] !== t12 || $[36] !== t13 || $[37] !== t14) {
-		t15 = /* @__PURE__ */ jsxs(Button, {
-			variant: t11,
-			size: t12,
-			onClick: handleClick,
-			disabled: t13,
-			className,
-			children: [iconElement, t14]
-		});
-		$[31] = className;
-		$[32] = handleClick;
-		$[33] = iconElement;
-		$[34] = t11;
-		$[35] = t12;
-		$[36] = t13;
-		$[37] = t14;
-		$[38] = t15;
-	} else t15 = $[38];
-	let t16;
-	if ($[39] !== action.confirmation || $[40] !== handleConfirm || $[41] !== isLoading || $[42] !== showConfirm) {
-		t16 = action.confirmation && /* @__PURE__ */ jsx(ConfirmationDialog, {
-			open: showConfirm,
-			onOpenChange: setShowConfirm,
-			config: action.confirmation,
-			onConfirm: handleConfirm,
-			loading: isLoading
-		});
-		$[39] = action.confirmation;
-		$[40] = handleConfirm;
-		$[41] = isLoading;
-		$[42] = showConfirm;
-		$[43] = t16;
-	} else t16 = $[43];
-	let t17;
-	if ($[44] !== t15 || $[45] !== t16) {
-		t17 = /* @__PURE__ */ jsxs(Fragment, { children: [t15, t16] });
-		$[44] = t15;
-		$[45] = t16;
-		$[46] = t17;
-	} else t17 = $[46];
-	return t17;
+			case "custom":
+				setIsLoading(true);
+				try {
+					await handler.fn(ctx);
+					setIsLoading(false);
+				} catch (error_0) {
+					helpers.toast.error(t("error.actionFailed"));
+					setIsLoading(false);
+				}
+				break;
+			case "dialog":
+			case "form":
+				onOpenDialog?.(action);
+				break;
+			case "server":
+				setIsLoading(true);
+				try {
+					const routes = client?.routes;
+					if (!routes?.executeAction) throw new Error(t("error.serverActionFailed"));
+					const serverHandler = handler;
+					const itemId = item && !Array.isArray(item) ? String(item.id ?? "") : void 0;
+					const itemIds = items?.map((it) => it?.id).filter(Boolean).map(String);
+					const response = await routes.executeAction({
+						collection: serverHandler.collection,
+						actionId: serverHandler.actionId,
+						itemId,
+						itemIds: itemIds?.length ? itemIds : void 0
+					});
+					if (!response?.success || response.result?.type === "error") {
+						const message = response?.error ?? response?.result?.toast?.message ?? t("error.serverActionFailed");
+						throw new Error(message);
+					}
+					const result = response.result;
+					if (result?.toast?.message) helpers.toast.success(result.toast.message);
+					else helpers.toast.success(t("toast.actionSuccess"));
+					if (result?.effects?.invalidate === true) await helpers.invalidateAll();
+					else if (Array.isArray(result?.effects?.invalidate)) for (const collectionName of result.effects.invalidate) await helpers.invalidateCollection(collectionName);
+					if (result?.effects?.redirect) helpers.navigate(result.effects.redirect);
+					if (result?.type === "redirect" && result.url) helpers.navigate(result.url);
+					if (result?.effects?.closeModal) helpers.closeDialog();
+				} catch (error) {
+					helpers.toast.error(error instanceof Error ? error.message : t("error.actionFailed"));
+				} finally {
+					setIsLoading(false);
+				}
+				break;
+		}
+	};
+	const handleClick = (e) => {
+		e.stopPropagation();
+		if (action.confirmation) setShowConfirm(true);
+		else executeAction();
+	};
+	const handleConfirm = async () => {
+		await executeAction();
+	};
+	const iconElement = resolveIconElement(action.icon, { "data-icon": "inline-start" });
+	const label = resolveText(action.label);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Button, {
+		variant: presentation === "menu" ? "ghost" : action.variant || "default",
+		size: iconOnly ? "icon-sm" : size,
+		onClick: handleClick,
+		disabled: isDisabled || isLoading,
+		className: cn(presentation === "menu" && "w-full justify-start rounded-[calc(var(--surface-radius)-2px)] px-3 py-2 text-left", action.variant === "destructive" && presentation === "menu" && "text-destructive hover:bg-destructive/10 hover:text-destructive", className),
+		title: iconOnly ? label : void 0,
+		children: [iconElement, iconOnly ? /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: label
+		}) : label]
+	}), action.confirmation && /* @__PURE__ */ jsx(ConfirmationDialog, {
+		open: showConfirm,
+		onOpenChange: setShowConfirm,
+		config: action.confirmation,
+		onConfirm: handleConfirm,
+		loading: isLoading
+	})] });
 }
 
 //#endregion