From 70709fa86069f63144e495759da4628a96f652da Mon Sep 17 00:00:00 2001
From: ttaerrim <ltr0121@naver.com>
Date: Thu, 1 Feb 2024 15:01:27 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A5=20=EB=B9=84=EA=B3=B5=EA=B0=9C=20?=
 =?UTF-8?q?=EA=B7=B8=EB=A3=B9=EC=9D=98=20=EC=B2=B4=ED=81=AC=EB=B0=95?=
 =?UTF-8?q?=EC=8A=A4=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Groups/Create/GroupJoinTypeCheckbox.tsx   | 49 -------------------
 .../src/pages/Groups/Create/index.tsx         | 14 +-----
 2 files changed, 1 insertion(+), 62 deletions(-)
 delete mode 100644 app/frontend/src/pages/Groups/Create/GroupJoinTypeCheckbox.tsx

diff --git a/app/frontend/src/pages/Groups/Create/GroupJoinTypeCheckbox.tsx b/app/frontend/src/pages/Groups/Create/GroupJoinTypeCheckbox.tsx
deleted file mode 100644
index db3e35fa..00000000
--- a/app/frontend/src/pages/Groups/Create/GroupJoinTypeCheckbox.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import { Control, useController } from 'react-hook-form';
-
-import * as styles from './index.css';
-import { GroupCreate } from './types';
-
-type GroupJoin = 'approve' | 'code';
-
-export function GroupJoinTypeCheckbox({
-  control,
-  required,
-}: {
-  control: Control<GroupCreate>;
-  required: boolean;
-}) {
-  const {
-    field: { value, onChange },
-  } = useController({
-    name: 'joinType',
-    control,
-    rules: {
-      validate: {
-        moreThanOne: (v) => required && v.length > 0,
-      },
-    },
-  });
-
-  const onChangeCheckbox = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const joinType = e.target.id as GroupJoin;
-    if (value.includes(joinType)) {
-      const newValue = value.filter((item) => item !== joinType);
-      onChange(newValue);
-    } else {
-      onChange([...value, joinType]);
-    }
-  };
-
-  return ['approve', 'code'].map((type) => (
-    <label key={type} className={styles.inputField} htmlFor={type}>
-      <input
-        type="checkbox"
-        id={type}
-        name={type}
-        checked={value.includes(type as GroupJoin)}
-        onChange={onChangeCheckbox}
-      />
-      {type === 'approve' ? '그룹장의 가입 승인 필요' : '참여 코드로 바로 가입'}
-    </label>
-  ));
-}
diff --git a/app/frontend/src/pages/Groups/Create/index.tsx b/app/frontend/src/pages/Groups/Create/index.tsx
index 096546dd..b5da30f1 100644
--- a/app/frontend/src/pages/Groups/Create/index.tsx
+++ b/app/frontend/src/pages/Groups/Create/index.tsx
@@ -4,7 +4,6 @@ import { TextLabel, Button } from '@morak/ui';
 
 import { FormInput } from '@/components';
 
-import { GroupJoinTypeCheckbox } from './GroupJoinTypeCheckbox';
 import { GroupTypeRadio } from './GroupTypeRadio';
 import * as styles from './index.css';
 import { GroupCreate } from './types';
@@ -14,7 +13,6 @@ export function GroupCreatePage() {
     control,
     handleSubmit,
     formState: { isValid },
-    watch,
   } = useForm<GroupCreate>({
     defaultValues: {
       name: '',
@@ -24,11 +22,10 @@ export function GroupCreatePage() {
     mode: 'all',
   });
 
-  const groupType = watch('type');
-
   return (
     <form
       className={styles.container}
+      // TODO: POST 요청
       onSubmit={handleSubmit((data) => console.log(data))}
     >
       <FormInput label="그룹명" required />
@@ -36,15 +33,6 @@ export function GroupCreatePage() {
         <TextLabel label="그룹 유형" required />
         <GroupTypeRadio control={control} />
       </div>
-      {groupType === 'private' && (
-        <div className={styles.inputWrapper}>
-          <TextLabel label="가입 방식" required />
-          <GroupJoinTypeCheckbox
-            control={control}
-            required={groupType === 'private'}
-          />
-        </div>
-      )}
       <Button
         type="submit"
         theme="primary"