refactor: branding color register 네이밍 수정

sopt-makers · Dec 23, 2024 · 28e1cb1 · 28e1cb1
1 parent ac98fce
commit 28e1cb1
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 18 deletions.
diff --git a/src/components/org/OrgAdmin/CommonSection/BrandingColor.tsx b/src/components/org/OrgAdmin/CommonSection/BrandingColor.tsx
@@ -22,9 +22,9 @@ const BrandingColor = () => {
           <StDescription>다크 모드를 고려하여 선정해주세요.</StDescription>
         </StTitleWrapper>
         <StInputWrapper>
-          <ColorInputField label="키컬러 (메인)" id="brandingColor_main" />
-          <ColorInputField label="키컬러 (저명도)" id="brandingColor_low" />
-          <ColorInputField label="키컬러 (고명도)" id="brandingColor_high" />
+          <ColorInputField label="키컬러 (메인)" id="brandingColor.main" />
+          <ColorInputField label="키컬러 (저명도)" id="brandingColor.low" />
+          <ColorInputField label="키컬러 (고명도)" id="brandingColor.high" />
           <BrandingSubColor onInfoToggle={onInfoToggle} />
         </StInputWrapper>
       </StWrapper>{' '}

diff --git a/src/components/org/OrgAdmin/CommonSection/BrandingSubColor.tsx b/src/components/org/OrgAdmin/CommonSection/BrandingSubColor.tsx
@@ -27,7 +27,7 @@ const BrandingSubColor = ({
           <IconInfoCircle />
         </StInfoButton>
         <StInput
-          {...register('brandingColor_point', {
+          {...register('brandingColor.point', {
             required: true && VALIDATION_CHECK.required.errorText,
           })}
           required
@@ -37,13 +37,13 @@ const BrandingSubColor = ({
           type="text"
           maxLength={9}
           placeholder="ex. #ffffff"
-          isError={errors.brandingColor_point?.message != undefined}
-          errorMessage={errors.brandingColor_point?.message as string}
+          isError={!!(errors as any).brandingColor?.point?.message}
+          errorMessage={(errors as any).brandingColor?.point?.message as string}
         />
         <StColorPreview
           type="color"
-          value={expandHexColor(watch('brandingColor_point'))}
-          onChange={(e) => setValue('brandingColor_point', e.target.value)}
+          value={expandHexColor(watch('brandingColor.point'))}
+          onChange={(e) => setValue('brandingColor.point', e.target.value)}
         />
       </StColorWrapper>
     </StInputBox>

diff --git a/src/components/org/OrgAdmin/CommonSection/ColorInputField.tsx b/src/components/org/OrgAdmin/CommonSection/ColorInputField.tsx
@@ -18,6 +18,7 @@ const ColorInputField = ({ label, id }: ColorInputFieldProps) => {
     watch,
     setValue,
   } = useFormContext();
+  const [brandingColor, color] = id.split('.');
 
   return (
     <StColorWrapper>
@@ -31,8 +32,10 @@ const ColorInputField = ({ label, id }: ColorInputFieldProps) => {
         type="text"
         maxLength={9}
         placeholder="ex. #ffffff"
-        isError={errors[id]?.message != undefined}
-        errorMessage={errors[id]?.message as string}
+        isError={!!(errors as any)[brandingColor]?.[color]?.message}
+        errorMessage={
+          (errors as any)[brandingColor]?.[color]?.message as string
+        }
       />
       <StColorPreview
         type="color"

diff --git a/src/components/org/OrgAdmin/index.tsx b/src/components/org/OrgAdmin/index.tsx
@@ -130,10 +130,7 @@ function OrgAdmin() {
 
     if (isScheduleValid && isCurriculumValid && isFnaValid) {
       const {
-        brandingColor_high,
-        brandingColor_low,
-        brandingColor_main,
-        brandingColor_point,
+        brandingColor,
         generation,
         name,
         recruitHeaderImage: { fileName: recruitHeaderImageFileName },
@@ -177,10 +174,10 @@ function OrgAdmin() {
           },
         ],
         brandingColor: {
-          main: brandingColor_main,
-          low: brandingColor_low,
-          high: brandingColor_high,
-          point: brandingColor_point,
+          main: brandingColor.main,
+          low: brandingColor.low,
+          high: brandingColor.high,
+          point: brandingColor.point,
         },
         mainButton: {
           text: '지원하기',