@dragonmastery/dragoncore-vue 0.0.4 → 0.0.5

package/dist/{CustomerSupportTicketDetailPage-DQa_Zvfe.js → CustomerSupportTicketDetailPage-DZQCplSM.js}

@@ -2,13 +2,14 @@ import { t as BATCH_MODE } from "./useRpcAuth-Dp2sec-X.js";
 import "./useQueryCache-DqcDMsxb.js";
 import { t as useMutation } from "./useMutation-B4_S4Xoa.js";
 import { t as useQuery } from "./useQuery-B7ndu5_P.js";
-import { c as SupportTicketTypeBadge_default, i as SupportTicketApprovalBadge_default, l as SupportTicketPriorityBadge_default, n as TimelineItem_default, o as formatCustomerCreditValue, r as formatTicketDate, t as TimelineSystemEvent_default } from "./TimelineSystemEvent-B69B3eeL.js";
+import { a as SupportTicketTypeBadge_default, c as formatCustomerCreditValue, i as SupportTicketApprovalBadge_default, n as TimelineItem_default, o as SupportTicketPriorityBadge_default, r as formatTicketDate, t as TimelineSystemEvent_default } from "./TimelineSystemEvent-D58zN850.js";
 import { t as extractRpcErrorMessage } from "./extractRpcErrorMessage-C_UbKgHL.js";
-import { t as formatTicketDisplayId } from "./displayIdFormatter-BoKcrgF5.js";
-import { a as SupportTicketAttachmentsCollapsible_default, i as parseRecordVersions, n as MetadataField_default, r as ActionBannerAlert_default, t as TimelineNoteInput_default } from "./TimelineNoteInput-BRsQ2QTz.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, openBlock, reactive, ref, renderList, resolveComponent, toDisplayString, unref, vModelSelect, vModelText, watch, withCtx, withDirectives } from "vue";
+import { t as formatTicketDisplayId } from "./displayIdFormatter-B1ZKgofu.js";
+import { a as SupportTicketAttachmentsCollapsible_default, i as parseRecordVersions, n as MetadataField_default, r as ActionBannerAlert_default, t as TimelineNoteInput_default } from "./TimelineNoteInput-BVqF4MtZ.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, openBlock, ref, renderList, resolveComponent, toDisplayString, unref, watch, withCtx } from "vue";
 import { useRoute, useRouter } from "vue-router";
-import { OPERATORS, RecordConst, supportTicketPriorityToNumber } from "@dragonmastery/dragoncore-shared";
+import { CustomerSupportTicketUpdateSchema, OPERATORS, RecordConst, SUPPORT_TICKET_PRIORITY_NUMBER_TO_LABEL, supportTicketPriorityToNumber } from "@dragonmastery/dragoncore-shared";
+import { useForm, withMetadata } from "@dragonmastery/zinia-forms-core";
 import { toast } from "vue3-toastify";
 
 //#region src/slices/support_ticket/customer/components/CustomerActionBanner.vue
@@ -72,13 +73,19 @@ const _hoisted_5$3 = {
 	key: 0,
 	class: "text-base-content/50"
 };
-const _hoisted_6$2 = { class: "text-base-content/50" };
-const _hoisted_7$2 = { class: "text-base-content/50" };
+const _hoisted_6$3 = { class: "text-base-content/50" };
+const _hoisted_7$3 = { class: "text-base-content/50" };
+const _hoisted_8$2 = {
+	key: 0,
+	class: "flex justify-end gap-2 mt-4"
+};
 const _sfc_main$4 = /* @__PURE__ */ defineComponent({
 	__name: "CustomerMetadataCard",
 	props: { ticket: {} },
+	emits: ["edit"],
 	setup(__props) {
 		const props = __props;
+		const canEdit = computed(() => !props.ticket.is_locked && !props.ticket.archived_at);
 		const displayApprovalStatus = computed(() => {
 			const s = props.ticket.status;
 			if (s === "PENDING") return "PENDING";
@@ -130,7 +137,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
 					_: 1
 				}),
 				createElementVNode("div", _hoisted_3$3, [createVNode(MetadataField_default, { label: "Description" }, {
-					empty: withCtx(() => [..._cache[0] || (_cache[0] = [createElementVNode("span", { class: "text-base-content/50 italic text-sm" }, "No description provided", -1)])]),
+					empty: withCtx(() => [..._cache[1] || (_cache[1] = [createElementVNode("span", { class: "text-base-content/50 italic text-sm" }, "No description provided", -1)])]),
 					default: withCtx(() => [__props.ticket.description?.trim() ? (openBlock(), createElementBlock("p", _hoisted_4$3, toDisplayString(__props.ticket.description), 1)) : createCommentVNode("v-if", true)]),
 					_: 1
 				})]),
@@ -156,17 +163,32 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
 					key: 1,
 					label: "Target"
 				}, {
-					default: withCtx(() => [createTextVNode(toDisplayString(targetFormatted.value) + " ", 1), createElementVNode("span", _hoisted_6$2, "· " + toDisplayString(targetRelative.value), 1)]),
+					default: withCtx(() => [createTextVNode(toDisplayString(targetFormatted.value) + " ", 1), createElementVNode("span", _hoisted_6$3, "· " + toDisplayString(targetRelative.value), 1)]),
 					_: 1
 				})) : createCommentVNode("v-if", true),
 				__props.ticket.completed_at ? (openBlock(), createBlock(MetadataField_default, {
 					key: 2,
 					label: "Completed"
 				}, {
-					default: withCtx(() => [createTextVNode(toDisplayString(completedFormatted.value) + " ", 1), createElementVNode("span", _hoisted_7$2, "· " + toDisplayString(completedRelative.value), 1)]),
+					default: withCtx(() => [createTextVNode(toDisplayString(completedFormatted.value) + " ", 1), createElementVNode("span", _hoisted_7$3, "· " + toDisplayString(completedRelative.value), 1)]),
 					_: 1
 				})) : createCommentVNode("v-if", true)
-			])]);
+			]), canEdit.value ? (openBlock(), createElementBlock("div", _hoisted_8$2, [createElementVNode("button", {
+				type: "button",
+				class: "btn btn-sm",
+				onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("edit"))
+			}, [..._cache[2] || (_cache[2] = [createElementVNode("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				fill: "none",
+				viewBox: "0 0 24 24",
+				"stroke-width": "1.5",
+				stroke: "currentColor",
+				class: "w-4 h-4 mr-2"
+			}, [createElementVNode("path", {
+				"stroke-linecap": "round",
+				"stroke-linejoin": "round",
+				d: "M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"
+			})], -1), createTextVNode(" Edit ", -1)])])])) : createCommentVNode("v-if", true)]);
 		};
 	}
 });
@@ -176,15 +198,25 @@ var CustomerMetadataCard_default = _sfc_main$4;
 //#region src/slices/support_ticket/customer/components/CustomerSupportTicketSubscribeControl.vue
 const _hoisted_1$3 = {
 	key: 0,
-	class: "flex flex-wrap items-center gap-2"
+	class: "flex flex-wrap items-center justify-between gap-3 rounded-lg border border-base-200 bg-base-200/30 px-4 py-3"
 };
-const _hoisted_2$3 = { class: "text-sm text-base-content/70" };
-const _hoisted_3$2 = ["disabled"];
-const _hoisted_4$2 = {
+const _hoisted_2$3 = { class: "flex items-center gap-3 min-w-0" };
+const _hoisted_3$2 = {
+	key: 0,
+	xmlns: "http://www.w3.org/2000/svg",
+	class: "h-5 w-5",
+	fill: "none",
+	viewBox: "0 0 24 24",
+	stroke: "currentColor",
+	"stroke-width": "2"
+};
+const _hoisted_4$2 = { class: "text-sm text-base-content/80 min-w-0" };
+const _hoisted_5$2 = ["disabled"];
+const _hoisted_6$2 = {
 	key: 0,
 	class: "loading loading-spinner loading-xs"
 };
-const _hoisted_5$2 = { key: 1 };
+const _hoisted_7$2 = { key: 1 };
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
 	__name: "CustomerSupportTicketSubscribeControl",
 	props: { ticket: {} },
@@ -210,134 +242,158 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
 			}
 		}
 		return (_ctx, _cache) => {
-			return __props.ticket ? (openBlock(), createElementBlock("div", _hoisted_1$3, [createElementVNode("span", _hoisted_2$3, toDisplayString(isSubscribed.value ? "You will receive notifications for updates." : "Get notified when there are updates or new comments."), 1), createElementVNode("button", {
-				type: "button",
-				class: normalizeClass(isSubscribed.value ? "btn btn-sm btn-ghost" : "btn btn-sm btn-primary"),
-				disabled: isToggling.value,
-				onClick: handleToggle
-			}, [isToggling.value ? (openBlock(), createElementBlock("span", _hoisted_4$2)) : (openBlock(), createElementBlock("span", _hoisted_5$2, toDisplayString(isSubscribed.value ? "Unsubscribe" : "Subscribe"), 1))], 10, _hoisted_3$2)])) : createCommentVNode("v-if", true);
+			return __props.ticket ? (openBlock(), createElementBlock("div", _hoisted_1$3, [createElementVNode("div", _hoisted_2$3, [
+				createElementVNode("div", { class: normalizeClass(["flex h-9 w-9 shrink-0 items-center justify-center rounded-lg", isSubscribed.value ? "bg-info/20 text-info" : "bg-base-300 text-base-content/60"]) }, [createCommentVNode(" Bell (subscribed) "), isSubscribed.value ? (openBlock(), createElementBlock("svg", _hoisted_3$2, [..._cache[0] || (_cache[0] = [createElementVNode("path", {
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					d: "M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"
+				}, null, -1)])])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createCommentVNode(" Bell with slash (unsubscribed) "), _cache[1] || (_cache[1] = createElementVNode("svg", {
+					xmlns: "http://www.w3.org/2000/svg",
+					class: "h-5 w-5",
+					fill: "none",
+					viewBox: "0 0 24 24",
+					stroke: "currentColor",
+					"stroke-width": "2"
+				}, [createElementVNode("path", {
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					d: "M9.143 17.082a24.248 24.248 0 0 0 3.844.148m-3.844-.148a23.856 23.856 0 0 1-5.455-1.31 8.964 8.964 0 0 0 2.3-5.542m3.155 6.852a3 3 0 0 0 5.667 1.97m1.965-2.277L21 21m-4.225-4.225a23.81 23.81 0 0 0 3.536-1.003A8.967 8.967 0 0 1 18 9.75V9A6 6 0 0 0 6.53 6.53m10.245 10.245L6.53 6.53M3 3l3.53 3.53"
+				})], -1))], 2112))], 2),
+				createElementVNode("p", _hoisted_4$2, toDisplayString(isSubscribed.value ? "You will receive notifications for updates." : "Get notified when there are updates or new comments."), 1),
+				createElementVNode("button", {
+					type: "button",
+					class: normalizeClass(["btn btn-sm shrink-0 font-medium", isSubscribed.value ? "btn-outline" : "btn-info"]),
+					disabled: isToggling.value,
+					onClick: handleToggle
+				}, [isToggling.value ? (openBlock(), createElementBlock("span", _hoisted_6$2)) : (openBlock(), createElementBlock("span", _hoisted_7$2, toDisplayString(isSubscribed.value ? "Unsubscribe" : "Subscribe"), 1))], 10, _hoisted_5$2)
+			])])) : createCommentVNode("v-if", true);
 		};
 	}
 });
 var CustomerSupportTicketSubscribeControl_default = _sfc_main$3;
 
+//#endregion
+//#region src/slices/support_ticket/customer/customerMetadataCardEditFormMetadata.ts
+const customerMetadataCardEditFormMetadata = withMetadata(CustomerSupportTicketUpdateSchema, "customerMetadataCardEditForm", {
+	title: {
+		label: "Title",
+		placeholder: "Enter ticket title"
+	},
+	description: {
+		label: "Description",
+		inputType: "textarea",
+		placeholder: "Describe the ticket in detail"
+	},
+	type: { label: "Type" },
+	priority: {
+		label: "Priority",
+		inputType: "select",
+		valueToLabel: SUPPORT_TICKET_PRIORITY_NUMBER_TO_LABEL,
+		valueType: "number"
+	}
+});
+
 //#endregion
 //#region src/slices/support_ticket/customer/components/CustomerMetadataCardEdit.vue
 const _hoisted_1$2 = { class: "border border-base-200 rounded-lg p-4 md:p-6" };
 const _hoisted_2$2 = { class: "grid grid-cols-1 md:grid-cols-2 gap-4" };
 const _hoisted_3$1 = { class: "form-control md:col-span-2" };
-const _hoisted_4$1 = ["disabled"];
-const _hoisted_5$1 = {
+const _hoisted_4$1 = { class: "form-control md:col-span-2" };
+const _hoisted_5$1 = { class: "form-control" };
+const _hoisted_6$1 = { class: "form-control" };
+const _hoisted_7$1 = {
 	key: 0,
-	class: "label"
-};
-const _hoisted_6$1 = { class: "form-control md:col-span-2" };
-const _hoisted_7$1 = ["disabled"];
-const _hoisted_8$1 = { class: "form-control" };
-const _hoisted_9$1 = ["disabled"];
-const _hoisted_10$1 = { class: "form-control" };
-const _hoisted_11$1 = ["disabled"];
-const _hoisted_12$1 = { class: "flex justify-end gap-2 mt-4" };
-const _hoisted_13$1 = ["disabled"];
-const _hoisted_14$1 = ["disabled"];
-const _hoisted_15 = {
-	key: 0,
-	class: "loading loading-spinner loading-xs mr-2"
+	class: "alert alert-error py-2 mt-4"
 };
+const _hoisted_8$1 = { class: "text-sm" };
+const _hoisted_9$1 = { class: "flex justify-end gap-2 mt-4" };
+const _hoisted_10$1 = ["disabled"];
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
 	__name: "CustomerMetadataCardEdit",
 	props: {
 		ticket: {},
 		saving: { type: Boolean }
 	},
-	emits: ["save", "cancel"],
+	emits: ["success", "cancel"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const formData = reactive({
-			title: props.ticket.title || "",
-			description: props.ticket.description || "",
-			type: props.ticket.type,
-			priority: supportTicketPriorityToNumber(props.ticket.priority)
-		});
-		const titleError = computed(() => {
-			return formData.title.trim() === "";
+		const { mutate: updateTicket, loading: isSaving } = useMutation((api, input) => api.supportTickets.updateTicket(input), { invalidate: /^support-tickets?:/ });
+		const saving = computed(() => props.saving ?? isSaving.value);
+		const { form, zinia, ZiniaForm, ZiniaSubmitButton, ZiniaFormErrorsSummary } = useForm(customerMetadataCardEditFormMetadata, {
+			storeName: `customer-metadata-card-edit-${props.ticket.id}`,
+			persistToLocalStorage: false,
+			renderStyle: "daisy_ui",
+			fetchData: async () => {
+				const t = props.ticket;
+				return {
+					id: t.id,
+					title: t.title || "",
+					description: t.description ?? "",
+					type: t.type,
+					priority: supportTicketPriorityToNumber(t.priority)
+				};
+			}
 		});
-		function handleSave() {
-			if (titleError.value) return;
-			emit("save", {
+		function buildPayload(formData) {
+			return {
 				id: props.ticket.id,
-				title: formData.title.trim(),
+				title: String(formData.title ?? "").trim(),
 				description: formData.description || "",
 				type: formData.type,
 				priority: formData.priority
-			});
+			};
+		}
+		async function handleSubmit(formData) {
+			await updateTicket(buildPayload(formData));
+		}
+		function handleSuccess() {
+			emit("success");
+		}
+		function handleError(error) {
+			const message = extractRpcErrorMessage(error, "Failed to update ticket");
+			form.setSubmitError(message);
 		}
 		function handleCancel() {
 			emit("cancel");
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", _hoisted_1$2, [
-				createElementVNode("div", _hoisted_2$2, [
-					createCommentVNode(" Title - full width "),
-					createElementVNode("div", _hoisted_3$1, [
-						_cache[5] || (_cache[5] = createElementVNode("label", { class: "label" }, [createElementVNode("span", { class: "label-text font-medium" }, "Title")], -1)),
-						withDirectives(createElementVNode("input", {
-							"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => formData.title = $event),
-							type: "text",
-							class: normalizeClass(["input input-bordered w-full", { "input-error": titleError.value }]),
-							placeholder: "Enter ticket title",
-							disabled: __props.saving
-						}, null, 10, _hoisted_4$1), [[vModelText, formData.title]]),
-						titleError.value ? (openBlock(), createElementBlock("label", _hoisted_5$1, [..._cache[4] || (_cache[4] = [createElementVNode("span", { class: "label-text-alt text-error" }, "Title is required.", -1)])])) : createCommentVNode("v-if", true)
+			return openBlock(), createElementBlock("div", _hoisted_1$2, [createVNode(unref(ZiniaForm), {
+				onHandleSubmit: handleSubmit,
+				onSuccess: handleSuccess,
+				onError: handleError,
+				title: "",
+				subtitle: ""
+			}, {
+				default: withCtx(() => [
+					createElementVNode("div", _hoisted_2$2, [
+						createCommentVNode(" Title - full width "),
+						createElementVNode("div", _hoisted_3$1, [createVNode(unref(zinia).TitleField, { placeholder: "Enter ticket title" })]),
+						createCommentVNode(" Description - full width "),
+						createElementVNode("div", _hoisted_4$1, [createVNode(unref(zinia).DescriptionField, {
+							class: "w-full",
+							placeholder: "Describe the ticket in detail"
+						})]),
+						createCommentVNode(" Type "),
+						createElementVNode("div", _hoisted_5$1, [createVNode(unref(zinia).TypeField)]),
+						createCommentVNode(" Priority "),
+						createElementVNode("div", _hoisted_6$1, [createVNode(unref(zinia).PriorityField)])
 					]),
-					createCommentVNode(" Description - full width "),
-					createElementVNode("div", _hoisted_6$1, [_cache[6] || (_cache[6] = createElementVNode("label", { class: "label" }, [createElementVNode("span", { class: "label-text font-medium" }, "Description")], -1)), withDirectives(createElementVNode("textarea", {
-						"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => formData.description = $event),
-						class: "textarea textarea-bordered w-full",
-						rows: "6",
-						placeholder: "Describe the ticket in detail",
-						disabled: __props.saving
-					}, null, 8, _hoisted_7$1), [[vModelText, formData.description]])]),
-					createCommentVNode(" Type "),
-					createElementVNode("div", _hoisted_8$1, [_cache[8] || (_cache[8] = createElementVNode("label", { class: "label" }, [createElementVNode("span", { class: "label-text font-medium" }, "Type")], -1)), withDirectives(createElementVNode("select", {
-						"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => formData.type = $event),
-						class: "select select-bordered w-full",
-						disabled: __props.saving
-					}, [..._cache[7] || (_cache[7] = [
-						createElementVNode("option", { value: "IMPROVEMENT" }, "Improvement", -1),
-						createElementVNode("option", { value: "BUG" }, "Bug", -1),
-						createElementVNode("option", { value: "FEATURE_REQUEST" }, "Feature Request", -1),
-						createElementVNode("option", { value: "OPERATIONAL" }, "Operational", -1)
-					])], 8, _hoisted_9$1), [[vModelSelect, formData.type]])]),
-					createCommentVNode(" Priority "),
-					createElementVNode("div", _hoisted_10$1, [_cache[10] || (_cache[10] = createElementVNode("label", { class: "label" }, [createElementVNode("span", { class: "label-text font-medium" }, "Priority")], -1)), withDirectives(createElementVNode("select", {
-						"onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => formData.priority = $event),
-						class: "select select-bordered w-full",
-						disabled: __props.saving
-					}, [..._cache[9] || (_cache[9] = [
-						createElementVNode("option", { value: 1 }, "Low", -1),
-						createElementVNode("option", { value: 2 }, "Medium", -1),
-						createElementVNode("option", { value: 3 }, "High", -1),
-						createElementVNode("option", { value: 4 }, "Critical", -1)
-					])], 8, _hoisted_11$1), [[
-						vModelSelect,
-						formData.priority,
-						void 0,
-						{ number: true }
-					]])])
+					unref(form).submitError ? (openBlock(), createElementBlock("div", _hoisted_7$1, [createElementVNode("span", _hoisted_8$1, toDisplayString(unref(form).submitError), 1)])) : createCommentVNode("v-if", true),
+					createVNode(unref(ZiniaFormErrorsSummary), { title: "Please fix the following errors:" }),
+					createCommentVNode(" Action Buttons "),
+					createElementVNode("div", _hoisted_9$1, [createElementVNode("button", {
+						type: "button",
+						class: "btn btn-ghost",
+						onClick: handleCancel,
+						disabled: saving.value
+					}, " Cancel ", 8, _hoisted_10$1), createVNode(unref(ZiniaSubmitButton), {
+						submitText: "Save",
+						submittingText: "Saving..."
+					})])
 				]),
-				createCommentVNode(" Action Buttons "),
-				createElementVNode("div", _hoisted_12$1, [createElementVNode("button", {
-					class: "btn btn-ghost",
-					onClick: handleCancel,
-					disabled: __props.saving
-				}, "Cancel", 8, _hoisted_13$1), createElementVNode("button", {
-					class: "btn btn-primary",
-					onClick: handleSave,
-					disabled: __props.saving
-				}, [__props.saving ? (openBlock(), createElementBlock("span", _hoisted_15)) : createCommentVNode("v-if", true), createTextVNode(" " + toDisplayString(__props.saving ? "Saving..." : "Save"), 1)], 8, _hoisted_14$1)])
-			]);
+				_: 1
+			})]);
 		};
 	}
 });
@@ -407,14 +463,22 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
 						author: item.data.author,
 						message: item.data.message,
 						timestamp: item.data.timestamp,
+						action: item.data.action,
+						type: item.data.type,
+						details: item.data.details,
 						"old-value": item.data.oldValue,
-						"new-value": item.data.newValue
+						"new-value": item.data.newValue,
+						changes: item.data.changes
 					}, null, 8, [
 						"author",
 						"message",
 						"timestamp",
+						"action",
+						"type",
+						"details",
 						"old-value",
-						"new-value"
+						"new-value",
+						"changes"
 					])) : createCommentVNode("v-if", true)], 64);
 				}), 128))
 			]);
@@ -436,18 +500,14 @@ const _hoisted_5 = { class: "px-4 py-6 max-w-4xl mx-auto" };
 const _hoisted_6 = { class: "mb-6" };
 const _hoisted_7 = { class: "text-2xl font-bold text-base-content break-words leading-tight mt-2" };
 const _hoisted_8 = { class: "mb-6" };
-const _hoisted_9 = {
-	key: 0,
-	class: "flex gap-2 mb-6"
-};
-const _hoisted_10 = { class: "mb-6" };
+const _hoisted_9 = { class: "mb-6" };
+const _hoisted_10 = { class: "mb-8" };
 const _hoisted_11 = { class: "mb-8" };
-const _hoisted_12 = { class: "mb-8" };
-const _hoisted_13 = {
+const _hoisted_12 = {
 	key: 1,
 	class: "alert alert-error mb-4"
 };
-const _hoisted_14 = {
+const _hoisted_13 = {
 	key: 2,
 	class: "flex justify-center items-center py-8"
 };
@@ -464,12 +524,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const router = useRouter();
 		const support_ticket_id = route.params.id;
 		const isEditMode = computed(() => route.query.mode === "edit");
-		const isSaving = ref(false);
 		const refreshTicket = inject("refreshTicket");
-		const isLocked = computed(() => {
-			if (!props.ticket) return false;
-			return !!props.ticket.is_locked;
-		});
 		const isCommentsLocked = computed(() => {
 			if (!props.ticket) return false;
 			return !!props.ticket.archived_at;
@@ -541,7 +596,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			});
 		});
 		const { mutate: createNote } = useMutation((api, input) => api.notes.createNote(input), { invalidate: /^notes?:/ });
-		const { mutate: updateTicket } = useMutation((api, input) => api.supportTickets.updateTicket(input), { invalidate: /^support-tickets?:/ });
 		async function handleAddNote(payload) {
 			try {
 				await createNote({
@@ -578,20 +632,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 				}
 			});
 		}
-		async function handleSave(payload) {
-			isSaving.value = true;
-			try {
-				await updateTicket(payload);
-				await exitEditMode();
-				await nextTick();
-				toast.success("Ticket updated successfully");
-				if (refreshTicket) await refreshTicket();
-			} catch (e) {
-				const errorMessage = e instanceof Error ? e.message : "Failed to update ticket";
-				toast.error(errorMessage);
-			} finally {
-				isSaving.value = false;
-			}
+		async function handleMetadataSaveSuccess() {
+			await exitEditMode();
+			await nextTick();
+			toast.success("Ticket updated successfully");
+			if (refreshTicket) await refreshTicket();
+			await refetchTimeline();
 		}
 		return (_ctx, _cache) => {
 			const _component_router_link = resolveComponent("router-link");
@@ -616,53 +662,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 				createElementVNode("div", _hoisted_6, [createElementVNode("h1", _hoisted_7, toDisplayString(__props.ticket.title), 1)]),
 				createCommentVNode(" Action Banner "),
 				createElementVNode("div", _hoisted_8, [createVNode(CustomerActionBanner_default, { ticket: __props.ticket }, null, 8, ["ticket"])]),
-				createCommentVNode(" Edit / Cancel "),
-				!isLocked.value && !isCommentsLocked.value ? (openBlock(), createElementBlock("div", _hoisted_9, [!isEditMode.value ? (openBlock(), createElementBlock("button", {
-					key: 0,
-					onClick: enterEditMode,
-					class: "btn btn-sm"
-				}, [..._cache[4] || (_cache[4] = [createElementVNode("svg", {
-					xmlns: "http://www.w3.org/2000/svg",
-					fill: "none",
-					viewBox: "0 0 24 24",
-					"stroke-width": "1.5",
-					stroke: "currentColor",
-					class: "w-4 h-4 mr-2"
-				}, [createElementVNode("path", {
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round",
-					d: "M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"
-				})], -1), createTextVNode(" Edit ", -1)])])) : (openBlock(), createElementBlock("button", {
-					key: 1,
-					onClick: exitEditMode,
-					class: "btn btn-sm"
-				}, [..._cache[5] || (_cache[5] = [createElementVNode("svg", {
-					xmlns: "http://www.w3.org/2000/svg",
-					fill: "none",
-					viewBox: "0 0 24 24",
-					"stroke-width": "1.5",
-					stroke: "currentColor",
-					class: "w-4 h-4 mr-2"
-				}, [createElementVNode("path", {
-					"stroke-linecap": "round",
-					"stroke-linejoin": "round",
-					d: "M6 18L18 6M6 6l12 12"
-				})], -1), createTextVNode(" Cancel ", -1)])]))])) : createCommentVNode("v-if", true),
 				createCommentVNode(" Subscribe / Unsubscribe "),
-				createElementVNode("div", _hoisted_10, [createVNode(CustomerSupportTicketSubscribeControl_default, { ticket: __props.ticket }, null, 8, ["ticket"])]),
+				createElementVNode("div", _hoisted_9, [createVNode(CustomerSupportTicketSubscribeControl_default, { ticket: __props.ticket }, null, 8, ["ticket"])]),
 				createCommentVNode(" Metadata Card (Display or Edit) "),
-				createElementVNode("div", _hoisted_11, [!isEditMode.value ? (openBlock(), createBlock(CustomerMetadataCard_default, {
+				createElementVNode("div", _hoisted_10, [!isEditMode.value ? (openBlock(), createBlock(CustomerMetadataCard_default, {
 					key: 0,
-					ticket: __props.ticket
+					ticket: __props.ticket,
+					onEdit: enterEditMode
 				}, null, 8, ["ticket"])) : (openBlock(), createBlock(CustomerMetadataCardEdit_default, {
 					key: 1,
 					ticket: __props.ticket,
-					saving: isSaving.value,
-					onSave: handleSave,
+					onSuccess: handleMetadataSaveSuccess,
 					onCancel: exitEditMode
-				}, null, 8, ["ticket", "saving"]))]),
+				}, null, 8, ["ticket"]))]),
 				createCommentVNode(" Attachments (separate from timeline so adding a comment doesn't cause refetch) "),
-				createElementVNode("div", _hoisted_12, [createVNode(SupportTicketAttachmentsCollapsible_default, {
+				createElementVNode("div", _hoisted_11, [createVNode(SupportTicketAttachmentsCollapsible_default, {
 					"record-id": __props.ticket.id,
 					locked: isCommentsLocked.value,
 					editable: !isCommentsLocked.value,
@@ -688,10 +702,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 					"notes",
 					"system-events",
 					"comments-locked"
-				])) : unref(timelineError) ? (openBlock(), createElementBlock("div", _hoisted_13, [createElementVNode("span", null, toDisplayString(unref(timelineError)?.message ?? "Failed to load timeline"), 1), createElementVNode("button", {
+				])) : unref(timelineError) ? (openBlock(), createElementBlock("div", _hoisted_12, [createElementVNode("span", null, toDisplayString(unref(timelineError)?.message ?? "Failed to load timeline"), 1), createElementVNode("button", {
 					class: "btn btn-sm btn-outline mt-2",
 					onClick: _cache[0] || (_cache[0] = (...args) => unref(refetchTimeline) && unref(refetchTimeline)(...args))
-				}, " Retry ")])) : (openBlock(), createElementBlock("div", _hoisted_14, [..._cache[6] || (_cache[6] = [createElementVNode("span", { class: "loading loading-spinner loading-lg" }, null, -1)])]))])
+				}, " Retry ")])) : (openBlock(), createElementBlock("div", _hoisted_13, [..._cache[4] || (_cache[4] = [createElementVNode("span", { class: "loading loading-spinner loading-lg" }, null, -1)])]))])
 			])], 2112)) : createCommentVNode("v-if", true)], 2112);
 		};
 	}
@@ -700,4 +714,4 @@ var CustomerSupportTicketDetailPage_default = _sfc_main;
 
 //#endregion
 export { CustomerSupportTicketDetailPage_default as default };
-//# sourceMappingURL=CustomerSupportTicketDetailPage-DQa_Zvfe.js.map
+//# sourceMappingURL=CustomerSupportTicketDetailPage-DZQCplSM.js.map