From c6f2befbf6930e83b5d8edaeeebbadadc973f328 Mon Sep 17 00:00:00 2001
From: Application-drop-up <msts.oo0131@gmail.com>
Date: Tue, 28 Jul 2026 09:24:19 +0900
Subject: [PATCH 1/2] feat(user): require age_range when creating a user (#466)

---
 client/src/app/features/user/apis/user-api.ts   |  1 +
 .../features/user/components/UserCreateForm.tsx | 17 +++++++++++++++++
 .../user/mapper/to-create-user-request.ts       |  1 +
 .../src/app/features/user/mapper/user.types.ts  |  1 +
 client/src/app/features/user/types.ts           |  1 +
 5 files changed, 21 insertions(+)

diff --git a/client/src/app/features/user/apis/user-api.ts b/client/src/app/features/user/apis/user-api.ts
index 047080b..50fe142 100644
--- a/client/src/app/features/user/apis/user-api.ts
+++ b/client/src/app/features/user/apis/user-api.ts
@@ -10,6 +10,7 @@ export type CreateUserRequest = {
   last_name: string;
   email: string;
   password: string;
+  age_range: AgeRange;
 };
 
 export type UpdateUserRequest = {
diff --git a/client/src/app/features/user/components/UserCreateForm.tsx b/client/src/app/features/user/components/UserCreateForm.tsx
index ecf53c7..1a52c90 100644
--- a/client/src/app/features/user/components/UserCreateForm.tsx
+++ b/client/src/app/features/user/components/UserCreateForm.tsx
@@ -1,8 +1,10 @@
 import type { FormEvent } from "react";
+import MenuItem from "@mui/material/MenuItem";
 import TextField from "@shared/uis/TextField.tsx";
 import { Button } from "@shared/uis/Button.tsx";
 import { ErrorPanel } from "@shared/uis/ErrorPanel.tsx";
 import { useText } from "@shared/locale/ui-text.ts";
+import { AGE_RANGES } from "../types";
 import type { CreateUserFormValues } from "../types";
 import type { ApiUserDto } from "../apis/user-api";
 
@@ -75,6 +77,21 @@ export function UserCreateForm({
         onChange={(e) => handleField("password", e.target.value)}
         required
       />
+      <TextField
+        select
+        label={text.userAgeRange}
+        value={value.ageRange}
+        onChange={(e) =>
+          handleField("ageRange", e.target.value as CreateUserFormValues["ageRange"])
+        }
+        required
+      >
+        {AGE_RANGES.map((ageRange) => (
+          <MenuItem key={ageRange} value={ageRange}>
+            {ageRange}
+          </MenuItem>
+        ))}
+      </TextField>
 
       <Button type="submit" variant="primary" isLoading={isLoading}>
         {text.userCreateSubmit}
diff --git a/client/src/app/features/user/mapper/to-create-user-request.ts b/client/src/app/features/user/mapper/to-create-user-request.ts
index 644e807..751b771 100644
--- a/client/src/app/features/user/mapper/to-create-user-request.ts
+++ b/client/src/app/features/user/mapper/to-create-user-request.ts
@@ -6,4 +6,5 @@ export const toCreateUserRequest = (values: CreateUserFormValues): CreateUserReq
   last_name: values.lastName.trim(),
   email: values.email.trim(),
   password: values.password,
+  age_range: values.ageRange,
 });
diff --git a/client/src/app/features/user/mapper/user.types.ts b/client/src/app/features/user/mapper/user.types.ts
index 0b60ebe..460b570 100644
--- a/client/src/app/features/user/mapper/user.types.ts
+++ b/client/src/app/features/user/mapper/user.types.ts
@@ -5,4 +5,5 @@ export const DEFAULT_CREATE_USER_FORM_VALUES: CreateUserFormValues = {
   lastName: "",
   email: "",
   password: "",
+  ageRange: "teens",
 };
diff --git a/client/src/app/features/user/types.ts b/client/src/app/features/user/types.ts
index b525261..0b5997b 100644
--- a/client/src/app/features/user/types.ts
+++ b/client/src/app/features/user/types.ts
@@ -9,6 +9,7 @@ export type CreateUserFormValues = {
   lastName: string;
   email: string;
   password: string;
+  ageRange: AgeRange;
 };
 
 export type UserProfile = {

From 0f1a21a24e80c0e03aad49ac9bbbf0090bead0b4 Mon Sep 17 00:00:00 2001
From: Application-drop-up <msts.oo0131@gmail.com>
Date: Tue, 28 Jul 2026 09:24:24 +0900
Subject: [PATCH 2/2] test(user): update tests for age_range on user creation

---
 client/src/app/features/user/apis/index.test.ts    |  1 +
 .../components/__tests__/UserCreateForm.test.tsx   | 14 +++++++++++---
 .../user/hooks/__tests__/use-create-user.test.ts   |  2 ++
 .../__tests__/to-create-user-request.test.ts       |  2 ++
 4 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/client/src/app/features/user/apis/index.test.ts b/client/src/app/features/user/apis/index.test.ts
index e000c52..cdc847a 100644
--- a/client/src/app/features/user/apis/index.test.ts
+++ b/client/src/app/features/user/apis/index.test.ts
@@ -32,6 +32,7 @@ const makeRequest = (overrides: Partial<CreateUserRequest> = {}): CreateUserRequ
   last_name: "Yamada",
   email: "taro@example.com",
   password: "password123",
+  age_range: "teens",
   ...overrides,
 });
 
diff --git a/client/src/app/features/user/components/__tests__/UserCreateForm.test.tsx b/client/src/app/features/user/components/__tests__/UserCreateForm.test.tsx
index ef5e1db..c2d46ec 100644
--- a/client/src/app/features/user/components/__tests__/UserCreateForm.test.tsx
+++ b/client/src/app/features/user/components/__tests__/UserCreateForm.test.tsx
@@ -13,6 +13,7 @@ const renderForm = (props: Partial<React.ComponentProps<typeof UserCreateForm>>
     lastName: "",
     email: "",
     password: "",
+    ageRange: "teens",
   };
 
   const defaultProps: React.ComponentProps<typeof UserCreateForm> = {
@@ -35,15 +36,15 @@ const renderForm = (props: Partial<React.ComponentProps<typeof UserCreateForm>>
 };
 
 describe("UserCreateForm", () => {
-  it("renders only first name, last name, email, and password fields", () => {
+  it("renders first name, last name, email, password, and age range fields, but not subscription", () => {
     renderForm();
 
     expect(screen.getByLabelText(/^First Name/)).toBeInTheDocument();
     expect(screen.getByLabelText(/^Last Name/)).toBeInTheDocument();
     expect(screen.getByLabelText(/^Email/)).toBeInTheDocument();
     expect(screen.getByLabelText(/^Password/)).toBeInTheDocument();
+    expect(screen.getByLabelText(/age range/i)).toBeInTheDocument();
 
-    expect(screen.queryByLabelText(/age range/i)).not.toBeInTheDocument();
     expect(screen.queryByLabelText(/subscription/i)).not.toBeInTheDocument();
   });
 
@@ -54,7 +55,13 @@ describe("UserCreateForm", () => {
     fireEvent.change(screen.getByLabelText(/^First Name/), { target: { value: "Taro" } });
 
     expect(onChange).toHaveBeenCalledWith(
-      expect.objectContaining({ firstName: "Taro", lastName: "", email: "", password: "" }),
+      expect.objectContaining({
+        firstName: "Taro",
+        lastName: "",
+        email: "",
+        password: "",
+        ageRange: "teens",
+      }),
     );
   });
 
@@ -65,6 +72,7 @@ describe("UserCreateForm", () => {
       lastName: "Yamada",
       email: "taro@example.com",
       password: "password123",
+      ageRange: "20s",
     };
     renderForm({ onSubmit, value });
 
diff --git a/client/src/app/features/user/hooks/__tests__/use-create-user.test.ts b/client/src/app/features/user/hooks/__tests__/use-create-user.test.ts
index df43c19..5c1f721 100644
--- a/client/src/app/features/user/hooks/__tests__/use-create-user.test.ts
+++ b/client/src/app/features/user/hooks/__tests__/use-create-user.test.ts
@@ -32,6 +32,7 @@ const formValues: CreateUserFormValues = {
   lastName: "Yamada",
   email: "taro@example.com",
   password: "password123",
+  ageRange: "teens",
 };
 
 const request: CreateUserRequest = {
@@ -39,6 +40,7 @@ const request: CreateUserRequest = {
   last_name: "Yamada",
   email: "taro@example.com",
   password: "password123",
+  age_range: "teens",
 };
 
 const user: ApiUserDto = {
diff --git a/client/src/app/features/user/mapper/__tests__/to-create-user-request.test.ts b/client/src/app/features/user/mapper/__tests__/to-create-user-request.test.ts
index c018f63..6bfed2d 100644
--- a/client/src/app/features/user/mapper/__tests__/to-create-user-request.test.ts
+++ b/client/src/app/features/user/mapper/__tests__/to-create-user-request.test.ts
@@ -7,6 +7,7 @@ const makeFormValues = (overrides: Partial<CreateUserFormValues> = {}): CreateUs
   lastName: "Yamada",
   email: "taro@example.com",
   password: "password123",
+  ageRange: "20s",
   ...overrides,
 });
 
@@ -19,6 +20,7 @@ describe("toCreateUserRequest", () => {
       last_name: "Yamada",
       email: "taro@example.com",
       password: "password123",
+      age_range: "20s",
     });
   });