From 8159ee5e686ac2a9b39aae6dfc06550985d5f43c Mon Sep 17 00:00:00 2001
From: Application-drop-up <msts.oo0131@gmail.com>
Date: Sun, 5 Jul 2026 18:36:24 +0900
Subject: [PATCH] feat(user): add UserCreateContainer wiring form state to
 useCreateUser

---
 .../user/containers/user-create-container.tsx | 29 +++++++++++++++++++
 .../app/features/user/mapper/user.types.ts    | 11 +++++++
 2 files changed, 40 insertions(+)
 create mode 100644 client/src/app/features/user/containers/user-create-container.tsx
 create mode 100644 client/src/app/features/user/mapper/user.types.ts

diff --git a/client/src/app/features/user/containers/user-create-container.tsx b/client/src/app/features/user/containers/user-create-container.tsx
new file mode 100644
index 0000000..cf3ca3b
--- /dev/null
+++ b/client/src/app/features/user/containers/user-create-container.tsx
@@ -0,0 +1,29 @@
+import { useCallback, useState } from "react";
+import { useCreateUser } from "../hooks/use-create-user";
+import { DEFAULT_CREATE_USER_FORM_VALUES } from "../mapper/user.types";
+import type { CreateUserFormValues } from "../types";
+import { UserCreateForm } from "../components/UserCreateForm";
+
+export function UserCreateContainer() {
+  const [draft, setDraft] = useState<CreateUserFormValues>(DEFAULT_CREATE_USER_FORM_VALUES);
+  const { submit, data, isLoading, error } = useCreateUser();
+
+  const handleChange = useCallback((next: CreateUserFormValues) => {
+    setDraft(next);
+  }, []);
+
+  const handleSubmit = useCallback(() => {
+    void submit(draft);
+  }, [draft, submit]);
+
+  return (
+    <UserCreateForm
+      value={draft}
+      onChange={handleChange}
+      onSubmit={handleSubmit}
+      isLoading={isLoading}
+      error={error}
+      createdUser={data}
+    />
+  );
+}
diff --git a/client/src/app/features/user/mapper/user.types.ts b/client/src/app/features/user/mapper/user.types.ts
new file mode 100644
index 0000000..d751fcd
--- /dev/null
+++ b/client/src/app/features/user/mapper/user.types.ts
@@ -0,0 +1,11 @@
+import type { CreateUserFormValues } from "../types";
+
+export const DEFAULT_CREATE_USER_FORM_VALUES: CreateUserFormValues = {
+  firstName: "",
+  lastName: "",
+  email: "",
+  password: "",
+  ageRange: "teens",
+  subscriptionTier: "free",
+  subscriptionExpiresAt: null,
+};