@funhub/platform 0.2.16 → 0.2.17

package/dist/components/pages/edit/page.mjs

@@ -1,688 +1,2 @@
 
-'use client';
-
-import { useUserStore } from "../../../store/modules/user-store.mjs";
-import { gUserGetUserEditInfo, gUserGetUserInfo, pUserEditUserInfo } from "../../../service/generated/client.mjs";
-import { usePageLifecycle } from "../../../utils/tracking.mjs";
-import { uploadFile } from "../../../utils/upload-file.mjs";
-import { Avatar, AvatarFallback, AvatarImage } from "../../ui/avatar.mjs";
-import { Box } from "../../ui/box.mjs";
-import { InputGroup, InputGroupAddon, InputGroupTextarea } from "../../ui/input-group.mjs";
-import { Text } from "../../ui/text.mjs";
-import { useDeleteRequest, useMutation, useRequest } from "../../../hooks/query/use-query.mjs";
-import { HeaderNav } from "../../common/header-nav/client.mjs";
-import { PickerDrawer } from "../../common/picker/picker-drawer/picker-drawer.mjs";
-import { GenderPicker } from "../../common/picker/gender-picker/gender-picker.mjs";
-import { ImageCropModal } from "../../common/image-crop-modal/image-crop-modal.mjs";
-import { useEffect, useRef, useState } from "react";
-import { ChevronDown } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { toast } from "sonner";
-import { useTranslations } from "next-intl";
-import { produce } from "immer";
-
-//#region components/pages/edit/page.tsx
-const apiGenderMap = {
-	0: "secret",
-	1: "male",
-	2: "female"
-};
-const formGenderMap = {
-	male: 1,
-	female: 2,
-	secret: 0
-};
-const nicknameMaxLength = 24;
-const signatureMaxLength = 100;
-const acceptedAvatarFileTypes = ".jpg,.jpeg,.png,image/jpeg,image/png";
-const allowedAvatarMimeTypes = ["image/jpeg", "image/png"];
-const nicknameAllowedPattern = /^[\u4E00-\u9FFF\w.-]+$/;
-/**
-* 校验头像文件格式是否受支持。
-*/
-function isSupportedAvatarFile(file) {
-	const fileName = file.name.toLowerCase();
-	const fileType = file.type.toLowerCase();
-	return allowedAvatarMimeTypes.includes(fileType) || /\.(?:jpg|jpeg|png)$/i.test(fileName);
-}
-/**
-* 将接口性别值转换为表单值。
-*/
-function normalizeGenderValue(value) {
-	if (!value) return "secret";
-	if (formGenderMap[value] !== void 0) return value;
-	return apiGenderMap[value] ?? "secret";
-}
-/**
-* 将表单性别转换为接口值。
-*/
-function resolveGenderPayload(value) {
-	if (!value) return;
-	if (formGenderMap[value] !== void 0) return formGenderMap[value];
-	const numericValue = Number(value);
-	return Number.isNaN(numericValue) ? void 0 : numericValue;
-}
-/**
-* 生成默认表单状态。
-*/
-function createDefaultFormState(editInfo) {
-	return {
-		nickname: editInfo?.nick_name ?? "",
-		gender: normalizeGenderValue(editInfo?.gender?.toString()),
-		signature: editInfo?.signature ?? "",
-		avatar: editInfo?.avatar ?? ""
-	};
-}
-/**
-* 聚焦文本域并将光标移动到末尾。
-*/
-function focusTextareaToEnd(textarea) {
-	if (!textarea) return;
-	textarea.focus();
-	const valueLength = textarea.value.length;
-	textarea.setSelectionRange(valueLength, valueLength);
-}
-/**
-* 编辑资料客户端组件。
-*/
-function EditClient({ id }) {
-	const t = useTranslations("components.pages.edit");
-	usePageLifecycle("page_edit_profile", "编辑资料");
-	const { userId, userInfo, setUserInfo } = useUserStore();
-	const targetUserId = id ?? userId;
-	const invalidateRequest = useDeleteRequest();
-	const genderLabelMap = {
-		male: t("page.genderMale"),
-		female: t("page.genderFemale"),
-		secret: t("page.genderSecret")
-	};
-	const fileInputRef = useRef(null);
-	const nicknameInputRef = useRef(null);
-	const signatureInputRef = useRef(null);
-	const savingFieldRef = useRef(null);
-	const [form, setForm] = useState(() => createDefaultFormState());
-	const [isAvatarUploading, setIsAvatarUploading] = useState(false);
-	const [savingField, setSavingField] = useState(null);
-	const [cropModalOpen, setCropModalOpen] = useState(false);
-	const [selectedImage, setSelectedImage] = useState("");
-	const [isNicknameDialogOpen, setIsNicknameDialogOpen] = useState(false);
-	const [nicknameDraft, setNicknameDraft] = useState("");
-	const [isGenderPickerOpen, setIsGenderPickerOpen] = useState(false);
-	const [genderDraft, setGenderDraft] = useState("secret");
-	const [isSignatureDialogOpen, setIsSignatureDialogOpen] = useState(false);
-	const [signatureDraft, setSignatureDraft] = useState("");
-	const emptyUserEditInfoResponse = {
-		code: 0,
-		message: "",
-		data: {}
-	};
-	const emptyUserInfoResponse = {
-		code: 0,
-		message: "",
-		data: {}
-	};
-	const { data: userEditInfoResponse, isLoading: isLoadingUserInfo } = useRequest(["user-edit-info", targetUserId], () => {
-		if (!targetUserId) return Promise.resolve(emptyUserEditInfoResponse);
-		return gUserGetUserEditInfo({ user_id: targetUserId });
-	});
-	const { data: userInfoResponse } = useRequest(["user-info-basic", targetUserId], () => {
-		if (!targetUserId) return Promise.resolve(emptyUserInfoResponse);
-		return gUserGetUserInfo({ user_id: targetUserId });
-	});
-	const { mutateAsync: saveUserInfo, isPending: isSaving } = useMutation(async (payload) => pUserEditUserInfo(payload));
-	const isProfileSaving = isAvatarUploading || isSaving || savingField !== null;
-	const isFormDisabled = isLoadingUserInfo || isProfileSaving;
-	const fieldInteractiveClassName = isFormDisabled ? "cursor-not-allowed opacity-60" : "cursor-pointer";
-	const displayId = userInfoResponse?.data?.display_id || userInfo?.display_id || "--";
-	const resolvedGender = form.gender || "secret";
-	const isNicknameSubmitDisabled = isFormDisabled || nicknameDraft.trim() === form.nickname;
-	const isGenderSubmitDisabled = isFormDisabled || genderDraft === resolvedGender;
-	const isSignatureSubmitDisabled = isFormDisabled || signatureDraft === form.signature;
-	const fieldCardClassName = "flex h-12 w-full items-center rounded-md bg-[var(--color-surface-field-bg)] px-4";
-	const fieldLabelClassName = "text-sm leading-6 text-text3";
-	const fieldValueClassName = "block min-w-0 flex-1 truncate text-sm leading-5 text-text3";
-	/**
-	* 同步接口返回的用户资料。
-	*/
-	useEffect(() => {
-		const editInfo = userEditInfoResponse?.data;
-		if (!editInfo) return;
-		setForm(createDefaultFormState(editInfo));
-	}, [userEditInfoResponse]);
-	/**
-	* 昵称弹窗打开后自动聚焦输入框。
-	*/
-	useEffect(() => {
-		if (!isNicknameDialogOpen) return;
-		const timer = window.setTimeout(() => {
-			focusTextareaToEnd(nicknameInputRef.current);
-		}, 250);
-		return () => {
-			window.clearTimeout(timer);
-		};
-	}, [isNicknameDialogOpen]);
-	/**
-	* 个性签名弹窗打开后自动聚焦输入框。
-	*/
-	useEffect(() => {
-		if (!isSignatureDialogOpen) return;
-		const timer = window.setTimeout(() => {
-			focusTextareaToEnd(signatureInputRef.current);
-		}, 250);
-		return () => {
-			window.clearTimeout(timer);
-		};
-	}, [isSignatureDialogOpen]);
-	/**
-	* 组件卸载时清理头像预览 URL。
-	*/
-	useEffect(() => {
-		return () => {
-			if (selectedImage) URL.revokeObjectURL(selectedImage);
-		};
-	}, [selectedImage]);
-	/**
-	* 更新表单字段。
-	*/
-	function handleUpdateFormField(key, value) {
-		setForm(produce((draft) => {
-			draft[key] = value;
-		}));
-	}
-	/**
-	* 清理当前待裁剪图片。
-	*/
-	function clearSelectedImage() {
-		if (!selectedImage) return;
-		URL.revokeObjectURL(selectedImage);
-		setSelectedImage("");
-	}
-	/**
-	* 统一失效编辑页相关缓存。
-	*/
-	function invalidateEditRelatedRequest() {
-		if (!targetUserId) return;
-		invalidateRequest(["user-edit-info", targetUserId]);
-		invalidateRequest(["user-info-basic", targetUserId]);
-		invalidateRequest(["user-profile", "mine"]);
-		invalidateRequest([
-			"user-profile",
-			"mine",
-			targetUserId
-		]);
-		invalidateRequest([
-			"user-profile",
-			"profile",
-			targetUserId
-		]);
-	}
-	/**
-	* 同步当前登录用户缓存资料。
-	*/
-	function syncCurrentUserInfo(updates) {
-		if (!targetUserId || targetUserId !== userId) return;
-		setUserInfo({
-			...userInfo,
-			user_id: targetUserId,
-			...updates
-		});
-	}
-	/**
-	* 提示当前正在保存，暂时不可编辑其他字段。
-	*/
-	function notifySavingInProgress() {
-		toast.info(t("page.editBlockedWhileSaving"));
-	}
-	/**
-	* 判断当前交互是否需要被保存态拦截。
-	*/
-	function shouldBlockEditAction() {
-		if (isLoadingUserInfo) return true;
-		if (!isProfileSaving) return false;
-		notifySavingInProgress();
-		return true;
-	}
-	/**
-	* 进入字段保存态。
-	*/
-	function beginFieldSaving(field) {
-		if (savingFieldRef.current) {
-			notifySavingInProgress();
-			return false;
-		}
-		savingFieldRef.current = field;
-		setSavingField(field);
-		return true;
-	}
-	/**
-	* 结束字段保存态。
-	*/
-	function endFieldSaving(field) {
-		if (savingFieldRef.current !== field) return;
-		savingFieldRef.current = null;
-		setSavingField(null);
-	}
-	/**
-	* 串行执行字段保存流程，并统一展示保存提示。
-	*/
-	async function runFieldSave(field, action) {
-		if (!beginFieldSaving(field)) return false;
-		const loadingToastId = toast.loading(t("page.savingInProgress"));
-		try {
-			return await action();
-		} finally {
-			toast.dismiss(loadingToastId);
-			endFieldSaving(field);
-		}
-	}
-	/**
-	* 聚合当前表单数据，并将当前修改字段放到请求对象最后。
-	*/
-	function buildAggregatedUpdatePayload(changedField, formPatch) {
-		const nextForm = {
-			...form,
-			...formPatch
-		};
-		const payloadMap = {
-			nickname: ["nick_name", nextForm.nickname || void 0],
-			avatar: ["avatar", nextForm.avatar || void 0],
-			signature: ["signature", nextForm.signature || void 0],
-			gender: ["gender", resolveGenderPayload(nextForm.gender)]
-		};
-		const orderedPayloadEntries = Object.keys(payloadMap).filter((field) => field !== changedField).map((field) => payloadMap[field]);
-		orderedPayloadEntries.push(payloadMap[changedField]);
-		return Object.fromEntries(orderedPayloadEntries);
-	}
-	/**
-	* 提交用户资料更新。
-	*/
-	async function submitUserProfileUpdate(changedField, formPatch) {
-		if (!targetUserId) {
-			toast.error(t("page.userNotFound"));
-			return false;
-		}
-		const payload = buildAggregatedUpdatePayload(changedField, formPatch);
-		try {
-			await saveUserInfo({
-				user_id: targetUserId,
-				...payload
-			});
-			invalidateEditRelatedRequest();
-			return true;
-		} catch (error) {
-			console.error("更新用户信息失败", error);
-			toast.error(t("page.updateFailed"));
-			return false;
-		}
-	}
-	/**
-	* 触发头像更换。
-	*/
-	function handleAvatarChange() {
-		if (shouldBlockEditAction() || isAvatarUploading) return;
-		fileInputRef.current?.click();
-	}
-	/**
-	* 处理头像文件变更。
-	*/
-	function handleAvatarFileChange(event) {
-		if (shouldBlockEditAction()) {
-			if (event.target) event.target.value = "";
-			return;
-		}
-		const file = event.target.files?.[0];
-		if (!file) return;
-		if (!isSupportedAvatarFile(file)) {
-			toast.error(t("page.imageTypeInvalid"));
-			if (event.target) event.target.value = "";
-			return;
-		}
-		setSelectedImage(URL.createObjectURL(file));
-		setCropModalOpen(true);
-		if (event.target) event.target.value = "";
-	}
-	/**
-	* 处理头像裁剪确认。
-	*/
-	async function handleCropConfirm(croppedBlob) {
-		await runFieldSave("avatar", async () => {
-			try {
-				setIsAvatarUploading(true);
-				const result = await uploadFile(new File([croppedBlob], "avatar.jpg", { type: "image/jpeg" }), 1);
-				if (!await submitUserProfileUpdate("avatar", { avatar: result.objectKey })) return false;
-				handleUpdateFormField("avatar", result.objectKey);
-				syncCurrentUserInfo({ avatar: result.objectKey });
-				handleCropCancel();
-				toast.success(t("page.avatarUpdateSuccess"));
-				return true;
-			} catch (error) {
-				console.error("上传头像失败", error);
-				toast.error(t("page.avatarUploadFailed"));
-				return false;
-			} finally {
-				setIsAvatarUploading(false);
-			}
-		});
-	}
-	/**
-	* 处理头像裁剪取消。
-	*/
-	function handleCropCancel() {
-		setCropModalOpen(false);
-		clearSelectedImage();
-	}
-	/**
-	* 打开昵称弹窗。
-	*/
-	function handleOpenNicknameDialog() {
-		if (shouldBlockEditAction()) return;
-		setNicknameDraft(form.nickname);
-		setIsNicknameDialogOpen(true);
-	}
-	/**
-	* 处理昵称输入。
-	*/
-	function handleNicknameDraftChange(event) {
-		const nextValue = event.target.value;
-		if (nextValue.length > nicknameMaxLength) return;
-		setNicknameDraft(nextValue);
-	}
-	/**
-	* 校验昵称。
-	*/
-	function validateNickname(value) {
-		if (!value) return t("page.nicknameRequired");
-		if (value.length < 2) return t("page.nicknameTooShort");
-		if (!nicknameAllowedPattern.test(value)) return t("page.nicknameInvalidChars");
-		return "";
-	}
-	/**
-	* 提交昵称修改。
-	*/
-	async function handleSubmitNickname(nextValue) {
-		if (isNicknameSubmitDisabled) return false;
-		const nextNickname = nextValue.trim();
-		const validationMessage = validateNickname(nextNickname);
-		if (validationMessage) {
-			toast.error(validationMessage);
-			return false;
-		}
-		if (!await runFieldSave("nickname", async () => {
-			return submitUserProfileUpdate("nickname", { nickname: nextNickname });
-		})) return false;
-		handleUpdateFormField("nickname", nextNickname);
-		syncCurrentUserInfo({ nick_name: nextNickname });
-		setNicknameDraft(nextNickname);
-		toast.success(t("page.nicknameUpdateSuccess"));
-		return true;
-	}
-	/**
-	* 打开性别选择器。
-	*/
-	function handleOpenGenderPicker() {
-		if (shouldBlockEditAction()) return;
-		setGenderDraft(resolvedGender);
-		setIsGenderPickerOpen(true);
-	}
-	/**
-	* 关闭性别选择器。
-	*/
-	function handleCloseGenderPicker() {
-		setIsGenderPickerOpen(false);
-	}
-	/**
-	* 处理性别滚轮选择。
-	*/
-	function handleGenderValueChange(value) {
-		setGenderDraft(value);
-	}
-	/**
-	* 提交性别修改。
-	*/
-	async function handleConfirmGender(value) {
-		const nextGender = value || genderDraft || "secret";
-		if (nextGender === resolvedGender) return false;
-		const resolvedGenderPayload = resolveGenderPayload(nextGender);
-		if (!await runFieldSave("gender", async () => {
-			return submitUserProfileUpdate("gender", { gender: nextGender });
-		})) return false;
-		handleUpdateFormField("gender", nextGender);
-		syncCurrentUserInfo({ gender: resolvedGenderPayload });
-		setGenderDraft(nextGender);
-		toast.success(t("page.genderUpdateSuccess"));
-		return true;
-	}
-	/**
-	* 打开个人签名弹窗。
-	*/
-	function handleOpenSignatureDialog() {
-		if (shouldBlockEditAction()) return;
-		setSignatureDraft(form.signature);
-		setIsSignatureDialogOpen(true);
-	}
-	/**
-	* 处理个人签名输入。
-	*/
-	function handleSignatureDraftChange(event) {
-		const nextValue = event.target.value;
-		if (nextValue.length > signatureMaxLength) return;
-		setSignatureDraft(nextValue);
-	}
-	/**
-	* 校验个人签名。
-	*/
-	function validateSignature(value) {
-		const trimmedValue = value.trim();
-		if (trimmedValue.length > 0 && trimmedValue.length < 2) return t("page.signatureTooShort");
-		return "";
-	}
-	/**
-	* 提交个人签名修改。
-	*/
-	async function handleSubmitSignature(nextValue) {
-		if (isSignatureSubmitDisabled) return false;
-		const validationMessage = validateSignature(nextValue);
-		if (validationMessage) {
-			toast.error(validationMessage);
-			return false;
-		}
-		if (!await runFieldSave("signature", async () => {
-			return submitUserProfileUpdate("signature", { signature: nextValue });
-		})) return false;
-		handleUpdateFormField("signature", nextValue);
-		syncCurrentUserInfo({ signature: nextValue });
-		setSignatureDraft(nextValue);
-		toast.success(t("page.signatureUpdateSuccess"));
-		return true;
-	}
-	return /* @__PURE__ */ jsxs(Box, {
-		className: "min-h-screen bg-[var(--color-surface-panel-dark)]",
-		children: [
-			/* @__PURE__ */ jsx(HeaderNav, {
-				className: "h-11 !border-none !bg-[var(--color-surface-panel-dark)]",
-				title: t("page.title")
-			}),
-			/* @__PURE__ */ jsxs(Box, {
-				className: "mx-auto flex w-full max-w-[390px] flex-col px-8 pb-10 pt-17",
-				children: [/* @__PURE__ */ jsxs("button", {
-					type: "button",
-					onClick: handleAvatarChange,
-					className: `flex flex-col items-center gap-4 pb-10 ${fieldInteractiveClassName}`,
-					children: [
-						/* @__PURE__ */ jsx("input", {
-							ref: fileInputRef,
-							type: "file",
-							accept: acceptedAvatarFileTypes,
-							className: "hidden",
-							onChange: handleAvatarFileChange
-						}),
-						/* @__PURE__ */ jsx(Box, {
-							className: "flex h-[72px] w-[72px] items-center justify-center rounded-full bg-[var(--color-surface-white20)]",
-							children: /* @__PURE__ */ jsxs(Avatar, {
-								className: "h-[60px] w-[60px] border-[3px] border-[var(--color-surface-white20)]",
-								children: [/* @__PURE__ */ jsx(AvatarImage, { src: form.avatar }), /* @__PURE__ */ jsx(AvatarFallback, {})]
-							})
-						}),
-						/* @__PURE__ */ jsxs(Text, {
-							className: "text-base leading-5 text-text3",
-							children: [
-								"ID:",
-								" ",
-								isLoadingUserInfo ? t("page.loading") : isAvatarUploading ? t("page.avatarUploading") : `${displayId}`
-							]
-						})
-					]
-				}), /* @__PURE__ */ jsxs(Box, {
-					className: "flex flex-col gap-6",
-					children: [
-						/* @__PURE__ */ jsxs(Box, {
-							className: "flex flex-col gap-2",
-							children: [/* @__PURE__ */ jsx(Text, {
-								as: "p",
-								className: fieldLabelClassName,
-								children: t("page.label")
-							}), /* @__PURE__ */ jsx("button", {
-								type: "button",
-								onClick: handleOpenNicknameDialog,
-								className: `${fieldCardClassName} ${fieldInteractiveClassName}`,
-								children: /* @__PURE__ */ jsx(Text, {
-									className: fieldValueClassName,
-									children: form.nickname || t("page.nicknamePlaceholder")
-								})
-							})]
-						}),
-						/* @__PURE__ */ jsxs(Box, {
-							className: "flex flex-col gap-2",
-							children: [/* @__PURE__ */ jsx(Text, {
-								as: "p",
-								className: fieldLabelClassName,
-								children: t("page.genderLabel")
-							}), /* @__PURE__ */ jsxs("button", {
-								type: "button",
-								onClick: handleOpenGenderPicker,
-								className: `${fieldCardClassName} justify-between gap-3 ${fieldInteractiveClassName}`,
-								children: [/* @__PURE__ */ jsx(Text, {
-									className: fieldValueClassName,
-									children: genderLabelMap[resolvedGender] || t("page.genderSecret")
-								}), /* @__PURE__ */ jsx(ChevronDown, {
-									className: "h-5 w-5 shrink-0 text-text3",
-									strokeWidth: 1.75
-								})]
-							})]
-						}),
-						/* @__PURE__ */ jsxs(Box, {
-							className: "flex flex-col gap-2",
-							children: [/* @__PURE__ */ jsx(Text, {
-								as: "p",
-								className: fieldLabelClassName,
-								children: t("page.signatureLabel")
-							}), /* @__PURE__ */ jsx("button", {
-								type: "button",
-								onClick: handleOpenSignatureDialog,
-								className: `${fieldCardClassName} ${fieldInteractiveClassName}`,
-								children: /* @__PURE__ */ jsx(Text, {
-									className: fieldValueClassName,
-									children: form.signature || t("page.signaturePlaceholder")
-								})
-							})]
-						})
-					]
-				})]
-			}),
-			/* @__PURE__ */ jsx(PickerDrawer, {
-				open: isNicknameDialogOpen,
-				onClose: () => setIsNicknameDialogOpen(false),
-				title: t("page.label"),
-				confirmText: t("page.submit"),
-				onConfirm: (value) => handleSubmitNickname(String(value)),
-				confirmDisabled: isNicknameSubmitDisabled,
-				children: ({ onValueChange }) => /* @__PURE__ */ jsx(Box, {
-					className: "px-4 py-4 min-h-[230px]",
-					children: /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupTextarea, {
-						ref: nicknameInputRef,
-						className: "!bg-bg1 p-2.5",
-						rows: 4,
-						maxLength: nicknameMaxLength,
-						placeholder: t("page.nicknamePlaceholder"),
-						value: nicknameDraft,
-						onChange: (event) => {
-							handleNicknameDraftChange(event);
-							onValueChange(event.target.value);
-						},
-						disabled: isFormDisabled
-					}), /* @__PURE__ */ jsx(InputGroupAddon, {
-						className: "!bg-bg1",
-						align: "block-end",
-						children: /* @__PURE__ */ jsx("div", {
-							className: "text-right w-full",
-							children: /* @__PURE__ */ jsxs("span", {
-								className: "text-xs",
-								children: [
-									nicknameDraft.length,
-									"/",
-									nicknameMaxLength
-								]
-							})
-						})
-					})] })
-				})
-			}),
-			/* @__PURE__ */ jsx(GenderPicker, {
-				open: isGenderPickerOpen,
-				onClose: handleCloseGenderPicker,
-				value: genderDraft,
-				onValueChange: handleGenderValueChange,
-				onConfirm: handleConfirmGender,
-				confirmDisabled: isGenderSubmitDisabled
-			}),
-			/* @__PURE__ */ jsx(PickerDrawer, {
-				open: isSignatureDialogOpen,
-				onClose: () => setIsSignatureDialogOpen(false),
-				title: t("page.signatureLabel"),
-				confirmText: t("page.submit"),
-				onConfirm: (value) => handleSubmitSignature(String(value)),
-				confirmDisabled: isSignatureSubmitDisabled,
-				children: ({ onValueChange }) => /* @__PURE__ */ jsx(Box, {
-					className: "px-4 py-4 min-h-[230px]",
-					children: /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupTextarea, {
-						ref: signatureInputRef,
-						className: "!bg-bg1 p-2.5",
-						rows: 4,
-						maxLength: signatureMaxLength,
-						placeholder: t("page.signaturePlaceholder"),
-						value: signatureDraft,
-						onChange: (event) => {
-							handleSignatureDraftChange(event);
-							onValueChange(event.target.value);
-						},
-						disabled: isFormDisabled
-					}), /* @__PURE__ */ jsx(InputGroupAddon, {
-						className: "!bg-bg1",
-						align: "block-end",
-						children: /* @__PURE__ */ jsx("div", {
-							className: "text-right w-full",
-							children: /* @__PURE__ */ jsxs("span", {
-								className: "text-xs",
-								children: [
-									signatureDraft.length,
-									"/",
-									signatureMaxLength
-								]
-							})
-						})
-					})] })
-				})
-			}),
-			/* @__PURE__ */ jsx(ImageCropModal, {
-				open: cropModalOpen,
-				onClose: handleCropCancel,
-				imageSrc: selectedImage,
-				onConfirm: handleCropConfirm,
-				cropShape: "round"
-			})
-		]
-	});
-}
-
-//#endregion
-export { EditClient };
+"use client";import{useUserStore as e}from"../../../store/modules/user-store.mjs";import{gUserGetUserEditInfo as t,gUserGetUserInfo as n,pUserEditUserInfo as r}from"../../../service/generated/client.mjs";import{usePageLifecycle as i}from"../../../utils/tracking.mjs";import{uploadFile as ee}from"../../../utils/upload-file.mjs";import{Avatar as te,AvatarFallback as ne,AvatarImage as re}from"../../ui/avatar.mjs";import{Box as a}from"../../ui/box.mjs";import{InputGroup as ie,InputGroupAddon as ae,InputGroupTextarea as oe}from"../../ui/input-group.mjs";import{Text as o}from"../../ui/text.mjs";import{useDeleteRequest as se,useMutation as ce,useRequest as s}from"../../../hooks/query/use-query.mjs";import{HeaderNav as le}from"../../common/header-nav/client.mjs";import{PickerDrawer as c}from"../../common/picker/picker-drawer/picker-drawer.mjs";import{GenderPicker as ue}from"../../common/picker/gender-picker/gender-picker.mjs";import{ImageCropModal as de}from"../../common/image-crop-modal/image-crop-modal.mjs";import{toast as l}from"sonner";import{useEffect as u,useRef as d,useState as f}from"react";import{ChevronDown as fe}from"lucide-react";import{jsx as p,jsxs as m}from"react/jsx-runtime";import{useTranslations as pe}from"next-intl";import{produce as me}from"immer";const he={0:`secret`,1:`male`,2:`female`},h={male:1,female:2,secret:0},g=[`image/jpeg`,`image/png`],ge=/^[\u4E00-\u9FFF\w.-]+$/;function _e(e){let t=e.name.toLowerCase(),n=e.type.toLowerCase();return g.includes(n)||/\.(?:jpg|jpeg|png)$/i.test(t)}function _(e){return e?h[e]===void 0?he[e]??`secret`:e:`secret`}function ve(e){if(!e)return;if(h[e]!==void 0)return h[e];let t=Number(e);return Number.isNaN(t)?void 0:t}function ye(e){return{nickname:e?.nick_name??``,gender:_(e?.gender?.toString()),signature:e?.signature??``,avatar:e?.avatar??``}}function be(e){if(!e)return;e.focus();let t=e.value.length;e.setSelectionRange(t,t)}function xe({id:he}){let h=pe(`components.pages.edit`);i(`page_edit_profile`,`编辑资料`);let{userId:g,userInfo:_,setUserInfo:xe}=e(),v=he??g,y=se(),Se={male:h(`page.genderMale`),female:h(`page.genderFemale`),secret:h(`page.genderSecret`)},Ce=d(null),b=d(null),x=d(null),S=d(null),[C,w]=f(()=>ye()),[T,E]=f(!1),[we,D]=f(null),[Te,O]=f(!1),[k,A]=f(``),[j,M]=f(!1),[N,P]=f(``),[Ee,F]=f(!1),[I,L]=f(`secret`),[R,De]=f(!1),[z,B]=f(``),Oe={code:0,message:``,data:{}},ke={code:0,message:``,data:{}},{data:V,isLoading:H}=s([`user-edit-info`,v],()=>v?t({user_id:v}):Promise.resolve(Oe)),{data:Ae}=s([`user-info-basic`,v],()=>v?n({user_id:v}):Promise.resolve(ke)),{mutateAsync:je,isPending:Me}=ce(async e=>r(e)),Ne=T||Me||we!==null,U=H||Ne,W=U?`cursor-not-allowed opacity-60`:`cursor-pointer`,Pe=Ae?.data?.display_id||_?.display_id||`--`,G=C.gender||`secret`,Fe=U||N.trim()===C.nickname,Ie=U||I===G,Le=U||z===C.signature,K=`flex h-12 w-full items-center rounded-md bg-[var(--color-surface-field-bg)] px-4`,q=`text-sm leading-6 text-text3`,J=`block min-w-0 flex-1 truncate text-sm leading-5 text-text3`;u(()=>{let e=V?.data;e&&w(ye(e))},[V]),u(()=>{if(!j)return;let e=window.setTimeout(()=>{be(b.current)},250);return()=>{window.clearTimeout(e)}},[j]),u(()=>{if(!R)return;let e=window.setTimeout(()=>{be(x.current)},250);return()=>{window.clearTimeout(e)}},[R]),u(()=>()=>{k&&URL.revokeObjectURL(k)},[k]);function Y(e,t){w(me(n=>{n[e]=t}))}function Re(){k&&(URL.revokeObjectURL(k),A(``))}function ze(){v&&(y([`user-edit-info`,v]),y([`user-info-basic`,v]),y([`user-profile`,`mine`]),y([`user-profile`,`mine`,v]),y([`user-profile`,`profile`,v]))}function X(e){!v||v!==g||xe({..._,user_id:v,...e})}function Be(){l.info(h(`page.editBlockedWhileSaving`))}function Z(){return H?!0:Ne?(Be(),!0):!1}function Ve(e){return S.current?(Be(),!1):(S.current=e,D(e),!0)}function He(e){S.current===e&&(S.current=null,D(null))}async function Q(e,t){if(!Ve(e))return!1;let n=l.loading(h(`page.savingInProgress`));try{return await t()}finally{l.dismiss(n),He(e)}}function Ue(e,t){let n={...C,...t},r={nickname:[`nick_name`,n.nickname||void 0],avatar:[`avatar`,n.avatar||void 0],signature:[`signature`,n.signature||void 0],gender:[`gender`,ve(n.gender)]},i=Object.keys(r).filter(t=>t!==e).map(e=>r[e]);return i.push(r[e]),Object.fromEntries(i)}async function $(e,t){if(!v)return l.error(h(`page.userNotFound`)),!1;let n=Ue(e,t);try{return await je({user_id:v,...n}),ze(),!0}catch(e){return console.error(`更新用户信息失败`,e),l.error(h(`page.updateFailed`)),!1}}function We(){Z()||T||Ce.current?.click()}function Ge(e){if(Z()){e.target&&(e.target.value=``);return}let t=e.target.files?.[0];if(t){if(!_e(t)){l.error(h(`page.imageTypeInvalid`)),e.target&&(e.target.value=``);return}A(URL.createObjectURL(t)),O(!0),e.target&&(e.target.value=``)}}async function Ke(e){await Q(`avatar`,async()=>{try{E(!0);let t=await ee(new File([e],`avatar.jpg`,{type:`image/jpeg`}),1);return await $(`avatar`,{avatar:t.objectKey})?(Y(`avatar`,t.objectKey),X({avatar:t.objectKey}),qe(),l.success(h(`page.avatarUpdateSuccess`)),!0):!1}catch(e){return console.error(`上传头像失败`,e),l.error(h(`page.avatarUploadFailed`)),!1}finally{E(!1)}})}function qe(){O(!1),Re()}function Je(){Z()||(P(C.nickname),M(!0))}function Ye(e){let t=e.target.value;t.length>24||P(t)}function Xe(e){return e?e.length<2?h(`page.nicknameTooShort`):ge.test(e)?``:h(`page.nicknameInvalidChars`):h(`page.nicknameRequired`)}async function Ze(e){if(Fe)return!1;let t=e.trim(),n=Xe(t);return n?(l.error(n),!1):await Q(`nickname`,async()=>$(`nickname`,{nickname:t}))?(Y(`nickname`,t),X({nick_name:t}),P(t),l.success(h(`page.nicknameUpdateSuccess`)),!0):!1}function Qe(){Z()||(L(G),F(!0))}function $e(){F(!1)}function et(e){L(e)}async function tt(e){let t=e||I||`secret`;if(t===G)return!1;let n=ve(t);return await Q(`gender`,async()=>$(`gender`,{gender:t}))?(Y(`gender`,t),X({gender:n}),L(t),l.success(h(`page.genderUpdateSuccess`)),!0):!1}function nt(){Z()||(B(C.signature),De(!0))}function rt(e){let t=e.target.value;t.length>100||B(t)}function it(e){let t=e.trim();return t.length>0&&t.length<2?h(`page.signatureTooShort`):``}async function at(e){if(Le)return!1;let t=it(e);return t?(l.error(t),!1):await Q(`signature`,async()=>$(`signature`,{signature:e}))?(Y(`signature`,e),X({signature:e}),B(e),l.success(h(`page.signatureUpdateSuccess`)),!0):!1}return m(a,{className:`min-h-screen bg-[var(--color-surface-panel-dark)]`,children:[p(le,{className:`h-11 !border-none !bg-[var(--color-surface-panel-dark)]`,title:h(`page.title`)}),m(a,{className:`mx-auto flex w-full max-w-[390px] flex-col px-8 pb-10 pt-17`,children:[m(`button`,{type:`button`,onClick:We,className:`flex flex-col items-center gap-4 pb-10 ${W}`,children:[p(`input`,{ref:Ce,type:`file`,accept:`.jpg,.jpeg,.png,image/jpeg,image/png`,className:`hidden`,onChange:Ge}),p(a,{className:`flex h-[72px] w-[72px] items-center justify-center rounded-full bg-[var(--color-surface-white20)]`,children:m(te,{className:`h-[60px] w-[60px] border-[3px] border-[var(--color-surface-white20)]`,children:[p(re,{src:C.avatar}),p(ne,{})]})}),m(o,{className:`text-base leading-5 text-text3`,children:[`ID:`,` `,H?h(`page.loading`):T?h(`page.avatarUploading`):`${Pe}`]})]}),m(a,{className:`flex flex-col gap-6`,children:[m(a,{className:`flex flex-col gap-2`,children:[p(o,{as:`p`,className:q,children:h(`page.label`)}),p(`button`,{type:`button`,onClick:Je,className:`${K} ${W}`,children:p(o,{className:J,children:C.nickname||h(`page.nicknamePlaceholder`)})})]}),m(a,{className:`flex flex-col gap-2`,children:[p(o,{as:`p`,className:q,children:h(`page.genderLabel`)}),m(`button`,{type:`button`,onClick:Qe,className:`${K} justify-between gap-3 ${W}`,children:[p(o,{className:J,children:Se[G]||h(`page.genderSecret`)}),p(fe,{className:`h-5 w-5 shrink-0 text-text3`,strokeWidth:1.75})]})]}),m(a,{className:`flex flex-col gap-2`,children:[p(o,{as:`p`,className:q,children:h(`page.signatureLabel`)}),p(`button`,{type:`button`,onClick:nt,className:`${K} ${W}`,children:p(o,{className:J,children:C.signature||h(`page.signaturePlaceholder`)})})]})]})]}),p(c,{open:j,onClose:()=>M(!1),title:h(`page.label`),confirmText:h(`page.submit`),onConfirm:e=>Ze(String(e)),confirmDisabled:Fe,children:({onValueChange:e})=>p(a,{className:`px-4 py-4 min-h-[230px]`,children:m(ie,{children:[p(oe,{ref:b,className:`!bg-bg1 p-2.5`,rows:4,maxLength:24,placeholder:h(`page.nicknamePlaceholder`),value:N,onChange:t=>{Ye(t),e(t.target.value)},disabled:U}),p(ae,{className:`!bg-bg1`,align:`block-end`,children:p(`div`,{className:`text-right w-full`,children:m(`span`,{className:`text-xs`,children:[N.length,`/`,24]})})})]})})}),p(ue,{open:Ee,onClose:$e,value:I,onValueChange:et,onConfirm:tt,confirmDisabled:Ie}),p(c,{open:R,onClose:()=>De(!1),title:h(`page.signatureLabel`),confirmText:h(`page.submit`),onConfirm:e=>at(String(e)),confirmDisabled:Le,children:({onValueChange:e})=>p(a,{className:`px-4 py-4 min-h-[230px]`,children:m(ie,{children:[p(oe,{ref:x,className:`!bg-bg1 p-2.5`,rows:4,maxLength:100,placeholder:h(`page.signaturePlaceholder`),value:z,onChange:t=>{rt(t),e(t.target.value)},disabled:U}),p(ae,{className:`!bg-bg1`,align:`block-end`,children:p(`div`,{className:`text-right w-full`,children:m(`span`,{className:`text-xs`,children:[z.length,`/`,100]})})})]})})}),p(de,{open:Te,onClose:qe,imageSrc:k,onConfirm:Ke,cropShape:`round`})]})}export{xe as EditClient};