refactor: Refactor form state and schema names

app/business/auth/user.command.ts

@@ -3,7 +3,8 @@
 import { State } from '@/app/ui/view/molecule/form/form-root';
 import { z } from 'zod';
 
-const SimpleSignUpFormSchema = z
+// message name은 logic 구현할 때 통일할 예정
+const SignUpFormSchema = z
   .object({
     userId: z
       .string()
@@ -33,18 +34,17 @@ const SimpleSignUpFormSchema = z
     }
   });
 
-type User = z.infer<typeof SimpleSignUpFormSchema>;
+type User = z.infer<typeof SignUpFormSchema>;
 
 export async function createUser(prevState: State, formData: FormData): Promise<State> {
-  const validatedFields = SimpleSignUpFormSchema.safeParse({
+  const validatedFields = SignUpFormSchema.safeParse({
     userId: formData.get('userId'),
     password: formData.get('password'),
     confirmPassword: formData.get('confirmPassword'),
     studentNumber: formData.get('studentNumber'),
     english: formData.get('english'),
   });
 
-  console.log(validatedFields);
   if (!validatedFields.success) {
     return {
       errors: validatedFields.error.flatten().fieldErrors,

app/ui/view/molecule/form/form-root.tsx

@@ -3,11 +3,12 @@ import { useFormState } from 'react-dom';
 import { FormSubmitButton } from './form-submit-button';
 import { FormContext } from './form.context';
 
-export type State = {
+export type FormState = {
   message: string | null;
   errors: Record<string, string[] | undefined>;
 };
 
+// Refactor: 애를 따로 빼고싶은데 utils 폴더에 어떤 파일명이 좋을까?
 export const filterChildrenByType = (children: React.ReactNode, elementType: React.ElementType) => {
   const childArray = React.Children.toArray(children);
   return childArray.filter((child) => React.isValidElement(child) && child.type === elementType);
@@ -19,12 +20,12 @@ const getFormSubmitButton = (children: React.ReactNode) => {
 
 type FormRootProps = {
   id: string;
-  action: (prevState: State, formData: FormData) => Promise<State> | State;
+  action: (prevState: FormState, formData: FormData) => Promise<FormState> | FormState;
 };
 
 export function FormRoot({ id, action, children }: React.PropsWithChildren<FormRootProps>) {
-  const initialState = { message: null, errors: {} };
-  const [state, dispatch] = useFormState(action, initialState);
+  const initialState: FormState = { message: null, errors: {} };
+  const [formState, dispatch] = useFormState(action, initialState);
 
   const formSubmitButton = getFormSubmitButton(children);
 
@@ -41,7 +42,7 @@ export function FormRoot({ id, action, children }: React.PropsWithChildren<FormR
   };
 
   return (
-    <FormContext.Provider value={{ ...state, formId: id }}>
+    <FormContext.Provider value={{ ...formState, formId: id }}>
       <form id={id} action={dispatch}>
         {renderWithoutSubmitButton()}
         <div className="mt-8">{formSubmitButton}</div>

app/ui/view/molecule/form/form.context.ts

@@ -1,7 +1,7 @@
 import { createContext } from 'react';
-import type { State } from './form-root';
+import type { FormState } from './form-root';
 
-type FormContext = State & { formId: string };
+type FormContext = FormState & { formId: string };
 
 export const FormContext = createContext<FormContext>({
   formId: '',