import { o as __toESM } from "../_runtime.mjs";
import { h as require_react, m as require_jsx_runtime } from "../_libs/react+tanstack__react-query.mjs";
import { a as p, i as MyButton, o as pInput, t as AppContainer } from "./src-u_N1opJl.mjs";
import { n as trpc } from "./trpc-client-CQOIB5UU.mjs";
import { l as useNavigate } from "../_libs/@tanstack/react-router+[...].mjs";
import { n as useAuth } from "./auth-context-DzjwonUC.mjs";
//#region node_modules/.nitro/vite/services/ssr/assets/me.edit-profile-jHHMfrY4.js
var import_react = /* @__PURE__ */ __toESM(require_react());
var import_jsx_runtime = require_jsx_runtime();
function EditProfilePage() {
	useNavigate();
	const { user, logout, loginWithToken } = useAuth();
	const [name, setName] = (0, import_react.useState)(user?.name || "");
	const [email, setEmail] = (0, import_react.useState)(user?.email || "");
	const updateMutation = trpc.user.auth.updateProfile.useMutation({ onSuccess: (data) => {
		if (data.token && data.user) loginWithToken(data.token, data.user);
	} });
	const deleteMutation = trpc.user.auth.deleteAccount.useMutation({ onSuccess: () => logout() });
	const handleSubmit = (e) => {
		e.preventDefault();
		updateMutation.mutate({
			name,
			email
		});
	};
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(AppContainer, { children: [
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(p, {
			weight: "bold",
			className: "mb-4 text-xl",
			children: "Edit Profile"
		}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", {
			onSubmit: handleSubmit,
			className: "flex flex-col gap-4",
			children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(pInput, {
					placeholder: "Name",
					value: name,
					onChange: (e) => setName(e.target.value)
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(pInput, {
					placeholder: "Email",
					type: "email",
					value: email,
					onChange: (e) => setEmail(e.target.value)
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(pInput, {
					placeholder: "Mobile",
					value: user?.mobile || "",
					disabled: true,
					className: "bg-gray-50"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, {
					type: "submit",
					fullWidth: true,
					disabled: updateMutation.isPending,
					textContent: updateMutation.isPending ? "Saving..." : "Save Changes",
					className: "bg-brand-500 text-white"
				})
			]
		}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mt-8 border-t border-gray-200 pt-8",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, {
				fullWidth: true,
				variant: "red",
				onClick: () => logout(),
				textContent: "Logout"
			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MyButton, {
				fullWidth: true,
				variant: "red",
				onClick: () => {
					if (window.confirm("Are you sure you want to delete your account?")) deleteMutation.mutate({ mobile: user?.mobile || "" });
				},
				disabled: deleteMutation.isPending,
				textContent: deleteMutation.isPending ? "Deleting..." : "Delete My Account",
				className: "mt-3 bg-red-600 text-white"
			})]
		})
	] });
}
//#endregion
export { EditProfilePage as component };