From 65a6c02eaa93b3d7c682503a83bbd48f4a8656d3 Mon Sep 17 00:00:00 2001
From: ttaerrim <ltr0121@naver.com>
Date: Thu, 1 Feb 2024 15:01:54 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A8=20=EA=B7=B8=EB=A3=B9=EB=AA=85=20us?=
 =?UTF-8?q?eController=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/frontend/src/pages/Groups/Create/index.tsx | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/app/frontend/src/pages/Groups/Create/index.tsx b/app/frontend/src/pages/Groups/Create/index.tsx
index b5da30f1..b61f8632 100644
--- a/app/frontend/src/pages/Groups/Create/index.tsx
+++ b/app/frontend/src/pages/Groups/Create/index.tsx
@@ -1,4 +1,4 @@
-import { useForm } from 'react-hook-form';
+import { useController, useForm } from 'react-hook-form';
 
 import { TextLabel, Button } from '@morak/ui';
 
@@ -22,13 +22,27 @@ export function GroupCreatePage() {
     mode: 'all',
   });
 
+  const {
+    field: { value: nameValue, onChange: onChangeName },
+  } = useController({
+    name: 'name',
+    control,
+    rules: {
+      required: true,
+    },
+  });
   return (
     <form
       className={styles.container}
       // TODO: POST 요청
       onSubmit={handleSubmit((data) => console.log(data))}
     >
-      <FormInput label="그룹명" required />
+      <FormInput
+        label="그룹명"
+        required
+        value={nameValue}
+        onChange={onChangeName}
+      />
       <div className={styles.inputWrapper}>
         <TextLabel label="그룹 유형" required />
         <GroupTypeRadio control={control} />