@mercurjs/magento2-connector-plugin 0.0.0-stage → 2.3.9-canary.2

package/.medusa/server/src/admin/index.mjs

@@ -0,0 +1,787 @@
+import { ArrowPath, PauseSolid, PlaySolid, ShoppingBag, Trash } from "@medusajs/icons";
+import { ActionMenu, DateCell, Form, KeyboundForm, PlaceholderCell, RouteDrawer, SectionRow, SingleColumnPage, SingleColumnPageSkeleton, StatusCell, TextCell, TextHeader, WidgetZone, _DataTable, queryClient, queryKeysFactory, useCan, useDataTable, useQueryParams, useRouteModal } from "@mercurjs/dashboard-shared";
+import { defineRouteConfig } from "@mercurjs/dashboard-sdk";
+import { Children, useMemo, useState } from "react";
+import { Badge, Button, Checkbox, Container, Heading, Input, StatusBadge, Text, Textarea, TooltipProvider, toast, usePrompt } from "@medusajs/ui";
+import { QueryClientProvider, keepPreviousData, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { adminAuth, createClient } from "@mercurjs/client";
+import { createColumnHelper } from "@tanstack/react-table";
+import { Link, useNavigate, useParams } from "react-router-dom";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm } from "react-hook-form";
+import * as zod from "zod";
+//#region src/admin/providers/settings-providers.tsx
+/** Settings routes mount outside the host dashboard's React providers, so each one supplies its own. */
+var SettingsProviders = ({ children }) => /* @__PURE__ */ jsx(QueryClientProvider, {
+	client: queryClient,
+	children: /* @__PURE__ */ jsx(TooltipProvider, { children })
+});
+//#endregion
+//#region src/admin/lib/client.ts
+var client = createClient({
+	baseUrl: "http://localhost:9000",
+	fetchOptions: { credentials: "omit" },
+	auth: adminAuth()
+});
+//#endregion
+//#region src/admin/hooks/api/magento.tsx
+var magentoStatusQueryKeys = queryKeysFactory("admin_magento_status");
+var magentoWebhookQueryKeys = queryKeysFactory("admin_magento_webhooks");
+var magentoDeliveryQueryKeys = queryKeysFactory("admin_magento_deliveries");
+var useMagentoStatus = (options) => {
+	const { data, ...rest } = useQuery({
+		queryKey: magentoStatusQueryKeys.all,
+		queryFn: () => client.admin.magento.status.query({}),
+		...options
+	});
+	return {
+		connection: data,
+		...rest
+	};
+};
+var useMagentoWebhooks = (query = {}, options) => {
+	const { data, ...rest } = useQuery({
+		queryKey: magentoWebhookQueryKeys.list(query),
+		queryFn: () => client.admin.magento.webhooks.query(query),
+		...options
+	});
+	return {
+		webhooks: data?.webhooks,
+		count: data?.count,
+		...rest
+	};
+};
+var useMagentoWebhook = (id, options) => {
+	const { data, ...rest } = useQuery({
+		queryKey: magentoWebhookQueryKeys.detail(id),
+		queryFn: () => client.admin.magento.webhooks.$id.query({ $id: id }),
+		...options
+	});
+	return {
+		webhook: data?.webhook,
+		...rest
+	};
+};
+var useMagentoWebhookDeliveries = (id, query = {}, options) => {
+	const { data, ...rest } = useQuery({
+		queryKey: magentoDeliveryQueryKeys.list({
+			id,
+			...query
+		}),
+		queryFn: () => client.admin.magento.webhooks.$id.deliveries.query({
+			$id: id,
+			...query
+		}),
+		...options
+	});
+	return {
+		deliveries: data?.deliveries,
+		count: data?.count,
+		...rest
+	};
+};
+var useInvalidateMagento = () => {
+	const queryClient = useQueryClient();
+	return (id) => {
+		queryClient.invalidateQueries({ queryKey: magentoStatusQueryKeys.all });
+		queryClient.invalidateQueries({ queryKey: magentoWebhookQueryKeys.lists() });
+		queryClient.invalidateQueries({ queryKey: magentoDeliveryQueryKeys.lists() });
+		if (id) queryClient.invalidateQueries({ queryKey: magentoWebhookQueryKeys.detail(id) });
+	};
+};
+var useCreateMagentoWebhook = (options) => {
+	const invalidate = useInvalidateMagento();
+	return useMutation({
+		mutationFn: (payload) => client.admin.magento.webhooks.mutate(payload),
+		...options,
+		onSuccess: (data, variables, context) => {
+			invalidate();
+			options?.onSuccess?.(data, variables, context);
+		}
+	});
+};
+var useUpdateMagentoWebhook = (id, options) => {
+	const invalidate = useInvalidateMagento();
+	return useMutation({
+		mutationFn: (payload) => client.admin.magento.webhooks.$id.mutate({
+			$id: id,
+			...payload
+		}),
+		...options,
+		onSuccess: (data, variables, context) => {
+			invalidate(id);
+			options?.onSuccess?.(data, variables, context);
+		}
+	});
+};
+var useDeleteMagentoWebhook = (id, options) => {
+	const invalidate = useInvalidateMagento();
+	return useMutation({
+		mutationFn: () => client.admin.magento.webhooks.$id.delete({ $id: id }),
+		...options,
+		onSuccess: (data, variables, context) => {
+			invalidate(id);
+			options?.onSuccess?.(data, variables, context);
+		}
+	});
+};
+var useRedeliverMagentoWebhook = (id, options) => {
+	const invalidate = useInvalidateMagento();
+	return useMutation({
+		mutationFn: (deliveryId) => client.admin.magento.webhooks.$id.deliveries.$delivery_id.redeliver.mutate({
+			$id: id,
+			$delivery_id: deliveryId
+		}),
+		...options,
+		onSuccess: (data, variables, context) => {
+			invalidate(id);
+			options?.onSuccess?.(data, variables, context);
+		}
+	});
+};
+//#endregion
+//#region src/admin/routes/settings/magento/components/magento-status-section.tsx
+var formatDate = (value) => value ? new Date(value).toLocaleString() : "Never";
+var MagentoStatusSection = () => {
+	const { connection: status, isPending, isError, error } = useMagentoStatus({ refetchInterval: 3e4 });
+	if (isError) throw error;
+	const connected = !!status?.payment_provider.installed && (status?.webhooks.active ?? 0) > 0;
+	return /* @__PURE__ */ jsxs(Container, {
+		className: "divide-y p-0",
+		"data-testid": "magento-status-section",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between px-6 py-4",
+				children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Heading, { children: "Magento" }), /* @__PURE__ */ jsx(Text, {
+					size: "small",
+					className: "text-ui-fg-subtle",
+					children: "Connection between this marketplace and your Magento 2 storefront."
+				})] }), isPending || !status ? /* @__PURE__ */ jsx(StatusBadge, {
+					color: "grey",
+					children: "Checking"
+				}) : connected ? /* @__PURE__ */ jsx(StatusBadge, {
+					color: "green",
+					children: "Connected"
+				}) : /* @__PURE__ */ jsx(StatusBadge, {
+					color: "orange",
+					children: "Not configured"
+				})]
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Payment provider",
+				value: status ? status.payment_provider.installed ? /* @__PURE__ */ jsx(StatusBadge, {
+					color: "green",
+					children: status.payment_provider.id
+				}) : /* @__PURE__ */ jsx(StatusBadge, {
+					color: "red",
+					children: "Missing from payment module"
+				}) : "-"
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Webhooks",
+				value: status ? `${status.webhooks.active} active of ${status.webhooks.total}` : "-"
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: `Deliveries (last ${status?.deliveries.window_hours ?? 24}h)`,
+				value: status ? [
+					`${status.deliveries.delivered} delivered`,
+					status.deliveries.failed ? `${status.deliveries.failed} retrying` : null,
+					status.deliveries.dead ? `${status.deliveries.dead} gave up` : null,
+					status.deliveries.pending ? `${status.deliveries.pending} queued` : null
+				].filter(Boolean).join(" · ") : "-"
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Last delivery",
+				value: status ? formatDate(status.deliveries.last_delivered_at) : "-"
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Orders from Magento (24h)",
+				value: status ? String(status.orders.last_24h) : "-"
+			})
+		]
+	});
+};
+//#endregion
+//#region src/admin/hooks/use-action-blocker.ts
+var useActionBlocker = (key, right) => {
+	const allowed = useCan(key, right);
+	return useMemo(() => allowed ? { disabled: false } : {
+		disabled: true,
+		disabledTooltip: "You do not have permission to do this"
+	}, [allowed]);
+};
+//#endregion
+//#region src/admin/routes/settings/magento/components/magento-webhook-table.tsx
+var PAGE_SIZE$1 = 20;
+var MagentoWebhookTable = () => /* @__PURE__ */ jsxs(Container, {
+	className: "divide-y p-0",
+	"data-testid": "magento-webhook-table",
+	children: [/* @__PURE__ */ jsx(MagentoWebhookHeader, {}), /* @__PURE__ */ jsx(MagentoWebhookDataTable, {})]
+});
+var MagentoWebhookHeader = () => {
+	const createBlocker = useActionBlocker("integrations", "manage");
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center justify-between px-6 py-4",
+		children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Heading, { children: "Webhooks" }), /* @__PURE__ */ jsx(Text, {
+			size: "small",
+			className: "text-ui-fg-subtle",
+			children: "Endpoints in Magento that receive offer, seller, product and order events."
+		})] }), /* @__PURE__ */ jsx(Button, {
+			size: "small",
+			variant: "secondary",
+			asChild: true,
+			disabled: createBlocker.disabled,
+			"data-testid": "magento-webhook-create-button",
+			children: /* @__PURE__ */ jsx(Link, {
+				to: "create",
+				children: "Add endpoint"
+			})
+		})]
+	});
+};
+var MagentoWebhookDataTable = () => {
+	const raw = useQueryParams(["offset"]);
+	const { webhooks, count, isPending, isError, error } = useMagentoWebhooks({
+		limit: PAGE_SIZE$1,
+		offset: raw.offset ? Number(raw.offset) : 0
+	}, { placeholderData: keepPreviousData });
+	const data = useMemo(() => webhooks ?? [], [webhooks]);
+	const columns = useColumns$1();
+	const { table } = useDataTable({
+		data,
+		columns,
+		count: count ?? 0,
+		enablePagination: true,
+		getRowId: (row) => row.id,
+		pageSize: PAGE_SIZE$1
+	});
+	if (isError) throw error;
+	return /* @__PURE__ */ jsx(_DataTable, {
+		table,
+		columns,
+		count: count ?? 0,
+		pageSize: PAGE_SIZE$1,
+		isLoading: isPending,
+		queryObject: raw,
+		pagination: true,
+		navigateTo: (row) => row.original.id,
+		noRecords: {
+			title: "No webhook endpoints yet",
+			message: "Add the endpoint your Magento connector exposes to start receiving events."
+		}
+	});
+};
+var columnHelper$1 = createColumnHelper();
+var useColumns$1 = () => useMemo(() => [
+	columnHelper$1.accessor("url", {
+		header: () => /* @__PURE__ */ jsx(TextHeader, { text: "URL" }),
+		cell: ({ getValue }) => /* @__PURE__ */ jsx(TextCell, { text: getValue() })
+	}),
+	columnHelper$1.accessor("events", {
+		header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Events" }),
+		cell: ({ getValue }) => /* @__PURE__ */ jsx(TextCell, { text: `${getValue().length} events` })
+	}),
+	columnHelper$1.accessor("is_active", {
+		header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Status" }),
+		cell: ({ getValue }) => getValue() ? /* @__PURE__ */ jsx(StatusCell, {
+			color: "green",
+			children: "Active"
+		}) : /* @__PURE__ */ jsx(StatusCell, {
+			color: "grey",
+			children: "Paused"
+		})
+	}),
+	columnHelper$1.accessor("created_at", {
+		header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Created" }),
+		cell: ({ getValue }) => /* @__PURE__ */ jsx(DateCell, { date: getValue() })
+	})
+], []);
+//#endregion
+//#region src/admin/routes/settings/magento/page.tsx
+var MagentoPage = ({ children }) => /* @__PURE__ */ jsx(SettingsProviders, { children: /* @__PURE__ */ jsx(SingleColumnPage, {
+	hasOutlet: true,
+	"data-testid": "magento-page",
+	children: /* @__PURE__ */ jsx(WidgetZone, {
+		id: "magento.list",
+		children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(MagentoStatusSection, {}), /* @__PURE__ */ jsx(MagentoWebhookTable, {})] })
+	})
+}) });
+var config = defineRouteConfig({
+	label: "Magento",
+	icon: ShoppingBag,
+	rank: 60,
+	group: "developer",
+	permissions: ["integrations:view"]
+});
+var handle$1 = {
+	breadcrumb: () => /* @__PURE__ */ jsx("span", { children: "Magento" }),
+	permissions: "integrations:view"
+};
+//#endregion
+//#region src/admin/routes/settings/magento/create/page.tsx
+var EVENT_GROUPS = [
+	{
+		label: "Offers",
+		events: [
+			"offer.created",
+			"offer.updated",
+			"offer.deleted"
+		]
+	},
+	{
+		label: "Sellers",
+		events: [
+			"seller.updated",
+			"seller.approved",
+			"seller.suspended",
+			"seller.unsuspended",
+			"seller.terminated",
+			"seller.unterminated"
+		]
+	},
+	{
+		label: "Products",
+		events: ["product.published", "product.rejected"]
+	},
+	{
+		label: "Orders",
+		events: [
+			"order_group.created",
+			"order.updated",
+			"order.canceled",
+			"order.fulfillment_created",
+			"order.fulfillment_canceled",
+			"shipment.created",
+			"delivery.created"
+		]
+	},
+	{
+		label: "Returns and refunds",
+		events: [
+			"order.return_requested",
+			"order.return_received",
+			"order.refund_requested",
+			"order.refund_recorded"
+		]
+	}
+];
+var ALL_EVENTS = EVENT_GROUPS.flatMap((group) => group.events);
+var CreateMagentoWebhookSchema = zod.object({
+	url: zod.string().url("Enter a full URL including https://"),
+	description: zod.string().optional(),
+	events: zod.array(zod.string()).min(1, "Pick at least one event")
+});
+var CreateMagentoWebhookForm = () => {
+	const { handleSuccess } = useRouteModal();
+	const [secret, setSecret] = useState(null);
+	const [createdId, setCreatedId] = useState(null);
+	const form = useForm({
+		defaultValues: {
+			url: "",
+			description: "",
+			events: ALL_EVENTS
+		},
+		resolver: zodResolver(CreateMagentoWebhookSchema)
+	});
+	const { mutateAsync, isPending } = useCreateMagentoWebhook({
+		onSuccess: ({ webhook }) => {
+			setSecret(webhook.secret);
+			setCreatedId(webhook.id);
+		},
+		onError: (e) => toast.error(e.message)
+	});
+	const handleSubmit = form.handleSubmit(async (data) => {
+		await mutateAsync({
+			url: data.url,
+			events: data.events,
+			description: data.description || null
+		});
+	});
+	if (secret && createdId) return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-y-4",
+		children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Heading, {
+			level: "h2",
+			children: "Signing secret"
+		}), /* @__PURE__ */ jsx(Text, {
+			size: "small",
+			className: "text-ui-fg-subtle",
+			children: "Paste this into the Magento connector configuration. It is shown only once."
+		})] }), /* @__PURE__ */ jsx(Input, {
+			readOnly: true,
+			value: secret,
+			"data-testid": "magento-webhook-secret-input"
+		})]
+	}) }), /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center gap-x-2",
+		children: [/* @__PURE__ */ jsx(Button, {
+			size: "small",
+			variant: "secondary",
+			onClick: () => navigator.clipboard?.writeText(secret).then(() => toast.success("Copied")),
+			children: "Copy"
+		}), /* @__PURE__ */ jsx(Button, {
+			size: "small",
+			onClick: () => handleSuccess(`/settings/magento/${createdId}`),
+			children: "Done"
+		})]
+	}) })] });
+	return /* @__PURE__ */ jsx(RouteDrawer.Form, {
+		form,
+		children: /* @__PURE__ */ jsxs(KeyboundForm, {
+			onSubmit: handleSubmit,
+			className: "flex flex-1 flex-col overflow-hidden",
+			children: [/* @__PURE__ */ jsxs(RouteDrawer.Body, {
+				className: "flex flex-1 flex-col gap-y-6 overflow-y-auto",
+				children: [
+					/* @__PURE__ */ jsx(Form.Field, {
+						control: form.control,
+						name: "url",
+						render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
+							/* @__PURE__ */ jsx(Form.Label, { children: "Endpoint URL" }),
+							/* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, {
+								placeholder: "https://shop.example.com/mercur/webhook",
+								autoComplete: "off",
+								"data-testid": "magento-webhook-url-input",
+								...field
+							}) }),
+							/* @__PURE__ */ jsx(Form.Hint, { children: "The route the Magento connector exposes for Mercur events." }),
+							/* @__PURE__ */ jsx(Form.ErrorMessage, {})
+						] })
+					}),
+					/* @__PURE__ */ jsx(Form.Field, {
+						control: form.control,
+						name: "description",
+						render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
+							/* @__PURE__ */ jsx(Form.Label, {
+								optional: true,
+								children: "Description"
+							}),
+							/* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Textarea, {
+								rows: 2,
+								"data-testid": "magento-webhook-description-input",
+								...field
+							}) }),
+							/* @__PURE__ */ jsx(Form.ErrorMessage, {})
+						] })
+					}),
+					/* @__PURE__ */ jsx(Form.Field, {
+						control: form.control,
+						name: "events",
+						render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
+							/* @__PURE__ */ jsx(Form.Label, { children: "Events" }),
+							/* @__PURE__ */ jsx("div", {
+								className: "flex flex-col gap-y-4",
+								children: EVENT_GROUPS.map((group) => /* @__PURE__ */ jsxs("div", {
+									className: "flex flex-col gap-y-2",
+									children: [/* @__PURE__ */ jsx(Text, {
+										size: "small",
+										weight: "plus",
+										children: group.label
+									}), group.events.map((event) => {
+										return /* @__PURE__ */ jsxs("label", {
+											className: "flex items-center gap-x-2",
+											children: [/* @__PURE__ */ jsx(Checkbox, {
+												checked: field.value.includes(event),
+												onCheckedChange: (next) => field.onChange(next === true ? [...field.value, event] : field.value.filter((e) => e !== event)),
+												"data-testid": `magento-webhook-event-${event}`
+											}), /* @__PURE__ */ jsx(Text, {
+												size: "small",
+												leading: "compact",
+												children: event
+											})]
+										}, event);
+									})]
+								}, group.label))
+							}),
+							/* @__PURE__ */ jsx(Form.ErrorMessage, {})
+						] })
+					})
+				]
+			}), /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-x-2",
+				children: [/* @__PURE__ */ jsx(RouteDrawer.Close, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(Button, {
+						size: "small",
+						variant: "secondary",
+						children: "Cancel"
+					})
+				}), /* @__PURE__ */ jsx(Button, {
+					size: "small",
+					type: "submit",
+					isLoading: isPending,
+					"data-testid": "magento-webhook-save-button",
+					children: "Create"
+				})]
+			}) })]
+		})
+	});
+};
+var CreateMagentoWebhookPage = () => /* @__PURE__ */ jsx(SettingsProviders, { children: /* @__PURE__ */ jsxs(RouteDrawer, { children: [/* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [/* @__PURE__ */ jsx(RouteDrawer.Title, {
+	asChild: true,
+	children: /* @__PURE__ */ jsx(Heading, { children: "Add webhook endpoint" })
+}), /* @__PURE__ */ jsx(RouteDrawer.Description, {
+	className: "sr-only",
+	children: "Register a Magento endpoint that receives Mercur events."
+})] }), /* @__PURE__ */ jsx(CreateMagentoWebhookForm, {})] }) });
+//#endregion
+//#region src/admin/routes/settings/magento/[id]/breadcrumb.tsx
+var MagentoWebhookDetailBreadcrumb = (props) => {
+	const { id } = props.params || {};
+	const { webhook } = useMagentoWebhook(id, { enabled: Boolean(id) });
+	if (!webhook) return null;
+	return /* @__PURE__ */ jsx("span", { children: webhook.description || webhook.url });
+};
+//#endregion
+//#region src/admin/routes/settings/magento/lib/delivery-state.ts
+var DELIVERY_STATE_COLOR = {
+	pending: "orange",
+	delivered: "green",
+	failed: "orange",
+	dead: "red"
+};
+var DELIVERY_STATE_LABEL = {
+	pending: "Queued",
+	delivered: "Delivered",
+	failed: "Retrying",
+	dead: "Gave up"
+};
+var LIVE_DELIVERY_STATES = ["pending", "failed"];
+//#endregion
+//#region src/admin/routes/settings/magento/[id]/components/magento-delivery-list-section.tsx
+var PAGE_SIZE = 10;
+var MagentoDeliveryListSection = ({ webhookId }) => {
+	const { deliveries, count, isPending, isError, error } = useMagentoWebhookDeliveries(webhookId, { limit: PAGE_SIZE }, {
+		placeholderData: keepPreviousData,
+		refetchInterval: (query) => query.state.data?.deliveries?.some((d) => LIVE_DELIVERY_STATES.includes(d.status)) ? 3e3 : false
+	});
+	const { mutateAsync: redeliver } = useRedeliverMagentoWebhook(webhookId, {
+		onSuccess: ({ delivery }) => delivery.status === "delivered" ? toast.success("Delivered") : toast.error(`Delivery failed with status ${delivery.response_status ?? "n/a"}`),
+		onError: (e) => toast.error(e.message)
+	});
+	const data = useMemo(() => deliveries ?? [], [deliveries]);
+	const columns = useColumns(redeliver);
+	const { table } = useDataTable({
+		data,
+		columns,
+		count: count ?? 0,
+		enablePagination: true,
+		getRowId: (row) => row.id,
+		pageSize: PAGE_SIZE
+	});
+	if (isError) throw error;
+	return /* @__PURE__ */ jsxs(Container, {
+		className: "divide-y p-0",
+		"data-testid": "magento-delivery-list-section",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "px-6 py-4",
+			children: [/* @__PURE__ */ jsx(Heading, {
+				level: "h2",
+				children: "Deliveries"
+			}), /* @__PURE__ */ jsx(Text, {
+				size: "small",
+				className: "text-ui-fg-subtle",
+				children: "Most recent attempts to reach this endpoint."
+			})]
+		}), /* @__PURE__ */ jsx(_DataTable, {
+			table,
+			columns,
+			count: count ?? 0,
+			pageSize: PAGE_SIZE,
+			isLoading: isPending,
+			pagination: true,
+			noRecords: {
+				title: "No deliveries yet",
+				message: "Deliveries appear here once a subscribed event fires."
+			}
+		})]
+	});
+};
+var columnHelper = createColumnHelper();
+var useColumns = (redeliver) => {
+	const redeliverBlocker = useActionBlocker("integrations", "edit");
+	return useMemo(() => [
+		columnHelper.accessor("event", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Event" }),
+			cell: ({ getValue }) => /* @__PURE__ */ jsx(TextCell, { text: getValue() })
+		}),
+		columnHelper.accessor("status", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Status" }),
+			cell: ({ getValue }) => /* @__PURE__ */ jsx(StatusCell, {
+				color: DELIVERY_STATE_COLOR[getValue()],
+				children: DELIVERY_STATE_LABEL[getValue()]
+			})
+		}),
+		columnHelper.accessor("response_status", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Response" }),
+			cell: ({ getValue }) => getValue() === null ? /* @__PURE__ */ jsx(PlaceholderCell, {}) : /* @__PURE__ */ jsx(TextCell, { text: String(getValue()) })
+		}),
+		columnHelper.accessor("attempts", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Attempts" }),
+			cell: ({ getValue }) => /* @__PURE__ */ jsx(TextCell, { text: String(getValue()) })
+		}),
+		columnHelper.accessor("next_attempt_at", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Next attempt" }),
+			cell: ({ getValue }) => {
+				const value = getValue();
+				return value ? /* @__PURE__ */ jsx(DateCell, { date: value }) : /* @__PURE__ */ jsx(PlaceholderCell, {});
+			}
+		}),
+		columnHelper.accessor("created_at", {
+			header: () => /* @__PURE__ */ jsx(TextHeader, { text: "Created" }),
+			cell: ({ getValue }) => /* @__PURE__ */ jsx(DateCell, { date: getValue() })
+		}),
+		columnHelper.display({
+			id: "actions",
+			cell: ({ row }) => /* @__PURE__ */ jsx(ActionMenu, { groups: [{ actions: [{
+				label: "Redeliver",
+				icon: /* @__PURE__ */ jsx(ArrowPath, {}),
+				onClick: () => redeliver(row.original.id),
+				...redeliverBlocker
+			}] }] })
+		})
+	], [redeliver, redeliverBlocker]);
+};
+//#endregion
+//#region src/admin/routes/settings/magento/[id]/components/magento-webhook-general-section.tsx
+var MagentoWebhookGeneralSection = ({ webhook }) => {
+	const navigate = useNavigate();
+	const prompt = usePrompt();
+	const editBlocker = useActionBlocker("integrations", "edit");
+	const deleteBlocker = useActionBlocker("integrations", "manage");
+	const { mutateAsync: update } = useUpdateMagentoWebhook(webhook.id, { onError: (e) => toast.error(e.message) });
+	const { mutateAsync: remove } = useDeleteMagentoWebhook(webhook.id, {
+		onSuccess: () => {
+			toast.success("Webhook endpoint deleted");
+			navigate("/settings/magento", { replace: true });
+		},
+		onError: (e) => toast.error(e.message)
+	});
+	const handleDelete = async () => {
+		if (await prompt({
+			title: "Delete webhook endpoint?",
+			description: "Magento will stop receiving events at this URL. Delivery history for it is removed.",
+			confirmText: "Delete",
+			cancelText: "Cancel"
+		})) await remove();
+	};
+	return /* @__PURE__ */ jsxs(Container, {
+		className: "divide-y p-0",
+		"data-testid": "magento-webhook-general-section",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between px-6 py-4",
+				children: [/* @__PURE__ */ jsx(Heading, { children: webhook.description || "Webhook endpoint" }), /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-x-2",
+					children: [webhook.is_active ? /* @__PURE__ */ jsx(StatusBadge, {
+						color: "green",
+						children: "Active"
+					}) : /* @__PURE__ */ jsx(StatusBadge, {
+						color: "grey",
+						children: "Paused"
+					}), /* @__PURE__ */ jsx(ActionMenu, { groups: [{ actions: [webhook.is_active ? {
+						label: "Pause",
+						icon: /* @__PURE__ */ jsx(PauseSolid, {}),
+						onClick: () => update({ is_active: false }),
+						...editBlocker
+					} : {
+						label: "Resume",
+						icon: /* @__PURE__ */ jsx(PlaySolid, {}),
+						onClick: () => update({ is_active: true }),
+						...editBlocker
+					}] }, { actions: [{
+						label: "Delete",
+						icon: /* @__PURE__ */ jsx(Trash, {}),
+						onClick: handleDelete,
+						...deleteBlocker
+					}] }] })]
+				})]
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "ID",
+				value: webhook.id
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "URL",
+				value: webhook.url
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Events",
+				value: /* @__PURE__ */ jsx("div", {
+					className: "flex flex-wrap gap-1",
+					children: webhook.events.map((event) => /* @__PURE__ */ jsx(Badge, {
+						size: "2xsmall",
+						children: event
+					}, event))
+				})
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Signature",
+				value: "HMAC-SHA256 in the x-mercur-signature header"
+			}),
+			/* @__PURE__ */ jsx(SectionRow, {
+				title: "Created",
+				value: new Date(webhook.created_at).toLocaleString()
+			})
+		]
+	});
+};
+//#endregion
+//#region src/admin/routes/settings/magento/[id]/page.tsx
+var MagentoWebhookDetailPage = () => {
+	const { id } = useParams();
+	const { webhook, isLoading, isError, error } = useMagentoWebhook(id);
+	if (isError) throw error;
+	if (isLoading || !webhook) return /* @__PURE__ */ jsx(SingleColumnPageSkeleton, { sections: 2 });
+	return /* @__PURE__ */ jsx(SingleColumnPage, {
+		data: webhook,
+		"data-testid": "magento-webhook-detail-page",
+		children: /* @__PURE__ */ jsxs(WidgetZone, {
+			id: "magento.detail.main",
+			children: [/* @__PURE__ */ jsx(MagentoWebhookGeneralSection, { webhook }), /* @__PURE__ */ jsx(MagentoDeliveryListSection, { webhookId: webhook.id })]
+		})
+	});
+};
+var MagentoWebhookDetailRoute = () => /* @__PURE__ */ jsx(SettingsProviders, { children: /* @__PURE__ */ jsx(MagentoWebhookDetailPage, {}) });
+//#endregion
+//#region src/admin/__dashboard-extensions__.js
+var __layer0 = {
+	routeModule: { routes: [
+		{
+			Component: MagentoPage,
+			path: "/settings/magento",
+			handle: handle$1
+		},
+		{
+			Component: CreateMagentoWebhookPage,
+			path: "/settings/magento/create"
+		},
+		{
+			Component: MagentoWebhookDetailRoute,
+			path: "/settings/magento/:id",
+			handle: {
+				breadcrumb: (match) => /* @__PURE__ */ jsx(MagentoWebhookDetailBreadcrumb, { ...match }),
+				permissions: "integrations:view"
+			}
+		}
+	] },
+	menuItemModule: { menuItems: [{
+		label: config.label,
+		icon: config.icon,
+		path: "/settings/magento",
+		rank: 60,
+		nested: void 0,
+		group: "developer",
+		translationNs: void 0,
+		permissions: config.permissions,
+		requireAll: void 0
+	}] },
+	widgetModule: { widgets: [] },
+	customFieldsModule: { configs: [] },
+	layoutModule: { layouts: [] },
+	i18nModule: {},
+	navigationModule: {},
+	preferenceModule: {}
+};
+//#endregion
+export { __layer0 as default };