From c55bef8a794dc1d1c0e602786642c989b532c5ab Mon Sep 17 00:00:00 2001
From: Cheshier <chungup5495@gmail.com>
Date: Sun, 12 Nov 2023 20:28:02 +0900
Subject: [PATCH] =?UTF-8?q?Revert=20"=E2=9C=A8=20Feat(#141):=20=EC=8A=A4?=
 =?UTF-8?q?=ED=85=8C=EB=94=94=20=EC=83=9D=EC=84=B1=20API=20=EC=97=B0?=
 =?UTF-8?q?=EB=8F=99=20=EA=B5=AC=ED=98=84"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |   1 -
 pnpm-lock.yaml                                |   3 -
 src/app/(steady)/steady/create/page.tsx       | 351 +++++-------------
 .../(steady)/steady/create/questions/page.tsx |  75 +---
 src/components/_common/Input/index.tsx        |  13 +-
 .../_common/Selector/Date/index.tsx           |  19 +-
 .../_common/Selector/Multi/index.tsx          |   4 -
 .../_common/Selector/Single/index.tsx         |  12 +-
 src/components/ui/form.tsx                    | 174 ---------
 src/components/ui/label.tsx                   |  25 --
 src/constants/create-steady.ts                |  57 ++-
 src/constants/schemas/steadySchema.ts         |  41 --
 src/services/steady/createSteady.ts           |  17 -
 src/services/types/index.ts                   |  17 +-
 src/stores/createSteadyData.ts                |  25 --
 src/utils/extractValue.ts                     |  16 -
 src/utils/formatDate.ts                       |   6 -
 17 files changed, 130 insertions(+), 726 deletions(-)
 delete mode 100644 src/components/ui/form.tsx
 delete mode 100644 src/components/ui/label.tsx
 delete mode 100644 src/constants/schemas/steadySchema.ts
 delete mode 100644 src/services/steady/createSteady.ts
 delete mode 100644 src/stores/createSteadyData.ts
 delete mode 100644 src/utils/extractValue.ts
 delete mode 100644 src/utils/formatDate.ts

diff --git a/package.json b/package.json
index 73dbb099..ddd75a11 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,6 @@
     "@radix-ui/react-avatar": "^1.0.4",
     "@radix-ui/react-dropdown-menu": "^2.0.6",
     "@radix-ui/react-icons": "^1.3.0",
-    "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-popover": "^1.0.7",
     "@radix-ui/react-scroll-area": "^1.0.5",
     "@radix-ui/react-select": "^2.0.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 86476237..e9c61f86 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,9 +17,6 @@ dependencies:
   '@radix-ui/react-icons':
     specifier: ^1.3.0
     version: 1.3.0(react@18.0.0)
-  '@radix-ui/react-label':
-    specifier: ^2.0.2
-    version: 2.0.2(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0)
   '@radix-ui/react-popover':
     specifier: ^1.0.7
     version: 1.0.7(@types/react-dom@18.0.0)(@types/react@18.0.0)(react-dom@18.0.0)(react@18.0.0)
diff --git a/src/app/(steady)/steady/create/page.tsx b/src/app/(steady)/steady/create/page.tsx
index 69e3dd5c..facb8eeb 100644
--- a/src/app/(steady)/steady/create/page.tsx
+++ b/src/app/(steady)/steady/create/page.tsx
@@ -1,17 +1,6 @@
 "use client";
 
-import { useForm } from "react-hook-form";
-import { useRouter } from "next/navigation";
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormMessage,
-} from "@/components/ui/form";
 import { cn } from "@/lib/utils";
-import useCreateSteadyStore from "@/stores/createSteadyData";
-import { zodResolver } from "@hookform/resolvers/zod";
 import { Separator, TextArea } from "@radix-ui/themes";
 import Button, { buttonSize } from "@/components/_common/Button";
 import Input from "@/components/_common/Input";
@@ -20,8 +9,6 @@ import {
   MultiSelector,
   SingleSelector,
 } from "@/components/_common/Selector";
-import { extractValue } from "@/utils/extractValue";
-import { formatDate } from "@/utils/formatDate";
 import {
   RECRUITMENT_SECTION_INTRO,
   STEADY_RECRUITMENT_EXAMPLE,
@@ -33,263 +20,105 @@ import {
   steadyRecruitmentFields,
   steadyRunningMethods,
 } from "@/constants/create-steady";
-import type { SteadyStateType } from "@/constants/schemas/steadySchema";
-import { SteadySchema } from "@/constants/schemas/steadySchema";
 
 const CreateSteadyPage = () => {
-  const router = useRouter();
-  const { setSteadyState } = useCreateSteadyStore();
-  const steadyForm = useForm<SteadyStateType>({
-    resolver: zodResolver(SteadySchema),
-  });
-
-  const onSubmit = (data: SteadyStateType) => {
-    setSteadyState(data);
-    router.push("/steady/create/questions");
-  };
-
   return (
     <div className={cn("mt-30")}>
-      <Form {...steadyForm}>
-        <form onSubmit={steadyForm.handleSubmit(onSubmit)}>
-          <h1 className={cn("mx-8 font-semibold")}>{STEADY_SECTION_INTRO}</h1>
-          <Separator
-            size={"4"}
-            my={"3"}
-            className={cn("h-5 bg-st-gray-400")}
+      <div>
+        <h1 className={cn("mx-8 font-semibold")}>{STEADY_SECTION_INTRO}</h1>
+        <Separator
+          size={"4"}
+          my={"3"}
+          className={cn("h-5 bg-st-gray-400")}
+        />
+        <div className={cn("mx-40 flex flex-row justify-between")}>
+          <SingleSelector
+            initialLabel={"프로젝트 / 스터디"}
+            items={steadyCategories}
+            className={cn("w-430")}
           />
-          <div className={cn("mx-40 flex flex-row justify-between")}>
-            <FormField
-              control={steadyForm.control}
-              name={"type"}
-              render={({ field }) => (
-                <FormItem>
-                  <SingleSelector
-                    initialLabel={"프로젝트 / 스터디"}
-                    items={steadyCategories}
-                    className={cn("w-430")}
-                    onSelectedChange={(selected) => {
-                      field.onChange(selected);
-                    }}
-                  />
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-            <FormField
-              control={steadyForm.control}
-              name={"participantLimit"}
-              render={({ field }) => (
-                <FormItem>
-                  <SingleSelector
-                    initialLabel={"스테디 정원"}
-                    items={steadyParticipantsLimit}
-                    className={cn("w-430")}
-                    onSelectedChange={(selected) => {
-                      field.onChange(Number(selected));
-                    }}
-                  />
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-          </div>
-          <Separator
-            size={"4"}
-            my={"3"}
-            className={cn("h-5 bg-st-gray-400")}
+          <SingleSelector
+            initialLabel={"스테디 정원"}
+            items={steadyParticipantsLimit}
+            className={cn("w-430")}
           />
-          <FormField
-            control={steadyForm.control}
-            name={"name"}
-            render={({ field }) => (
-              <FormItem>
-                <FormControl>
-                  <Input
-                    inputName={"steady-title-input"}
-                    onValueChange={(value) => {
-                      field.onChange(value);
-                    }}
-                  />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            )}
+        </div>
+        <Separator
+          size={"4"}
+          my={"3"}
+          className={cn("h-5 bg-st-gray-400")}
+        />
+        <Input inputName={"steady-title-input"} />
+        <TextArea
+          className={cn("h-380 w-full")}
+          my={"3"}
+        />
+      </div>
+      <div className={cn("mt-30")}>
+        <h1 className={cn("mx-8 font-semibold")}>
+          {RECRUITMENT_SECTION_INTRO}
+        </h1>
+        <Separator
+          size={"4"}
+          my={"3"}
+          className={cn("h-5 bg-st-gray-400")}
+        />
+        <div className={cn("mx-20 flex flex-row justify-between gap-15")}>
+          <MultiSelector
+            initialLabel={"모집 분야"}
+            items={steadyRecruitmentFields}
+            className={cn("w-200")}
           />
-          <FormField
-            control={steadyForm.control}
-            name={"bio"}
-            render={({ field }) => (
-              <FormItem>
-                <FormControl>
-                  <TextArea
-                    className={cn("h-380 w-full")}
-                    my={"3"}
-                    placeholder={"스테디 소개"}
-                    onChange={(event) => {
-                      field.onChange(event.target.value);
-                    }}
-                  />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            )}
+          <SingleSelector
+            initialLabel={"진행 방식"}
+            items={steadyRunningMethods}
+            className={cn("w-200")}
           />
-          <div className={cn("mt-30")}>
-            <h1 className={cn("mx-8 font-semibold")}>
-              {RECRUITMENT_SECTION_INTRO}
-            </h1>
-            <Separator
-              size={"4"}
-              my={"3"}
-              className={cn("h-5 bg-st-gray-400")}
-            />
-            <div className={cn("mx-20 flex flex-row justify-between gap-15")}>
-              <FormField
-                control={steadyForm.control}
-                name={"positions"}
-                render={({ field }) => (
-                  <FormItem>
-                    <MultiSelector
-                      initialLabel={"모집 분야"}
-                      items={steadyRecruitmentFields}
-                      className={cn("w-200")}
-                      onSelectedChange={(selected) => {
-                        field.onChange(extractValue(selected).map(Number));
-                      }}
-                    />
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-
-              <FormField
-                control={steadyForm.control}
-                name={"steadyMode"}
-                render={({ field }) => (
-                  <FormItem>
-                    <SingleSelector
-                      initialLabel={"진행 방식"}
-                      items={steadyRunningMethods}
-                      className={cn("w-200")}
-                      onSelectedChange={(selected) => {
-                        field.onChange(selected);
-                      }}
-                    />
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-
-              <FormField
-                control={steadyForm.control}
-                name={"scheduledPeriod"}
-                render={({ field }) => (
-                  <FormItem>
-                    <SingleSelector
-                      initialLabel={"예상 기간"}
-                      items={steadyExpectedPeriods}
-                      className={cn("w-200")}
-                      onSelectedChange={(selected) => {
-                        field.onChange(selected);
-                      }}
-                    />
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-              <FormField
-                control={steadyForm.control}
-                name={"deadline"}
-                render={({ field }) => (
-                  <FormItem>
-                    <DateSelector
-                      initialLabel={"마감일"}
-                      className={cn("w-200")}
-                      onDateChange={(date) => {
-                        field.onChange(formatDate(date));
-                      }}
-                    />
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-            </div>
-            <div className={cn("mx-20 flex flex-row justify-start gap-15")}>
-              <FormField
-                control={steadyForm.control}
-                name={"stacks"}
-                render={({ field }) => (
-                  <FormItem>
-                    <MultiSelector
-                      initialLabel={"기술 스택"}
-                      items={steadyExpectedTechStacks}
-                      className={cn("w-280")}
-                      onSelectedChange={(selected) => {
-                        field.onChange(extractValue(selected).map(Number));
-                      }}
-                    />
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-            </div>
+          <SingleSelector
+            initialLabel={"예상 기간"}
+            items={steadyExpectedPeriods}
+            className={cn("w-200")}
+          />
+          <DateSelector
+            initialLabel={"마감일"}
+            className={cn("w-200")}
+          />
+        </div>
+        <div className={cn("mx-20 flex flex-row justify-start gap-15")}>
+          <MultiSelector
+            initialLabel={"기술 스택"}
+            items={steadyExpectedTechStacks}
+            className={cn("w-280")}
+          />
+        </div>
 
-            <Separator
-              size={"4"}
-              my={"3"}
-              className={cn("h-5 bg-st-gray-400")}
-            />
-            <FormField
-              control={steadyForm.control}
-              name={"title"}
-              render={({ field }) => (
-                <FormItem>
-                  <Input
-                    inputName={"title-input"}
-                    onValueChange={(value) => {
-                      field.onChange(value);
-                    }}
-                  />
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-            <FormField
-              control={steadyForm.control}
-              name={"content"}
-              render={({ field }) => (
-                <FormItem>
-                  <TextArea
-                    className={cn("h-720 w-full")}
-                    my={"3"}
-                    defaultValue={STEADY_RECRUITMENT_EXAMPLE}
-                    onChange={(event) => {
-                      field.onChange(event.target.value);
-                    }}
-                  />
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-            <div className={"flex justify-end gap-20"}>
-              <Button
-                className={cn(`${buttonSize.sm} items-center justify-center`)}
-              >
-                취소
-              </Button>
-              <Button
-                className={cn(
-                  `bg-st-primary ${buttonSize.sm} items-center justify-center text-st-white`,
-                )}
-                type={"submit"}
-              >
-                다음
-              </Button>
-            </div>
-          </div>
-        </form>
-      </Form>
+        <Separator
+          size={"4"}
+          my={"3"}
+          className={cn("h-5 bg-st-gray-400")}
+        />
+        <Input inputName={"title-input"} />
+        <Input inputName={"tag-input"} />
+        <TextArea
+          className={cn("h-720 w-full")}
+          my={"3"}
+          defaultValue={STEADY_RECRUITMENT_EXAMPLE}
+        />
+        <div className={"flex justify-end gap-20"}>
+          <Button
+            className={cn(`${buttonSize.sm} items-center justify-center`)}
+          >
+            취소
+          </Button>
+          <Button
+            className={cn(
+              `bg-st-primary ${buttonSize.sm} items-center justify-center text-st-white`,
+            )}
+          >
+            다음
+          </Button>
+        </div>
+      </div>
     </div>
   );
 };
diff --git a/src/app/(steady)/steady/create/questions/page.tsx b/src/app/(steady)/steady/create/questions/page.tsx
index 6d99f444..8002dd27 100644
--- a/src/app/(steady)/steady/create/questions/page.tsx
+++ b/src/app/(steady)/steady/create/questions/page.tsx
@@ -1,46 +1,17 @@
 "use client";
 
-import { useEffect, useState } from "react";
-import { useRouter } from "next/navigation";
+import { useState } from "react";
 import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { useToast } from "@/components/ui/use-toast";
 import { cn } from "@/lib/utils";
-import useCreateSteadyStore from "@/stores/createSteadyData";
 import { Separator } from "@radix-ui/themes";
-import createSteady from "@/services/steady/createSteady";
 import Button, { buttonSize } from "@/components/_common/Button";
 import Icon from "@/components/_common/Icon";
 import { SingleSelector } from "@/components/_common/Selector";
 
 const CreateQuestionsPage = () => {
-  const [question, setQuestion] = useState([{ id: 1, question: "" }]);
+  const [question, setQuestion] = useState([{ id: 1 }]);
   const { toast } = useToast();
-  const router = useRouter();
-  const { steadyState } = useCreateSteadyStore();
-
-  useEffect(() => {
-    if (!steadyState || Object.keys(steadyState).length === 0) {
-      toast({
-        description: "스테디 신청서를 먼저 작성해 주세요.",
-        variant: "red",
-      });
-      router.push("/steady/create");
-    }
-  }, [router, steadyState, toast]);
-
-  const handleCreateQuestion = () => {
-    if (question.length === 10) {
-      toast({
-        description: "질문은 최대 10개까지만 추가할 수 있습니다.",
-        variant: "red",
-      });
-      return;
-    }
-    setQuestion((prev) => [
-      ...prev,
-      { id: prev[prev.length - 1].id + 1, question: "" },
-    ]);
-  };
 
   const handleDeleteQuestion = (id: number) => {
     if (question.length === 1) {
@@ -52,27 +23,6 @@ const CreateQuestionsPage = () => {
     }
     setQuestion((prev) => prev.filter((item) => item.id !== id));
   };
-
-  const handleSubmitTotalData = () => {
-    const questions = question.map((item) => item.question);
-    const totalData = { ...steadyState, questions };
-    createSteady(totalData)
-      .then(() => {
-        toast({
-          description: "스테디가 성공적으로 등록되었습니다.",
-          variant: "green",
-        });
-        useCreateSteadyStore.persist.clearStorage();
-        router.push("/");
-      })
-      .catch(() => {
-        toast({
-          description: "스테디 등록에 실패하였습니다.",
-          variant: "red",
-        });
-      });
-  };
-
   return (
     <div className={cn("mt-30")}>
       <div className={"flex w-1000 items-center justify-between"}>
@@ -88,7 +38,10 @@ const CreateQuestionsPage = () => {
               `h-40 w-130 items-center justify-center bg-st-primary text-st-white`,
             )}
             onClick={() => {
-              handleCreateQuestion();
+              setQuestion((prev) => [
+                ...prev,
+                { id: prev[prev.length - 1].id + 1 },
+              ]);
             }}
           >
             질문 추가
@@ -123,19 +76,6 @@ const CreateQuestionsPage = () => {
                   className={cn(
                     "h-50 w-300 text-20 font-semibold text-st-black outline-none",
                   )}
-                  onChange={(event) => {
-                    setQuestion((prev) =>
-                      prev.map((pItem) => {
-                        if (pItem.id === item.id) {
-                          return {
-                            ...pItem,
-                            question: event.target.value,
-                          };
-                        }
-                        return pItem;
-                      }),
-                    );
-                  }}
                 />
                 <div
                   className={cn("cursor-pointer")}
@@ -177,9 +117,6 @@ const CreateQuestionsPage = () => {
           className={cn(
             `bg-st-primary ${buttonSize.sm} items-center justify-center text-st-white`,
           )}
-          onClick={() => {
-            handleSubmitTotalData();
-          }}
         >
           등록
         </Button>
diff --git a/src/components/_common/Input/index.tsx b/src/components/_common/Input/index.tsx
index dff76696..36d4730c 100644
--- a/src/components/_common/Input/index.tsx
+++ b/src/components/_common/Input/index.tsx
@@ -10,11 +10,9 @@ interface InputProps {
     | "tag-input"
     | "introduce-input";
   initialValue?: string;
-  // eslint-disable-next-line no-unused-vars
-  onValueChange?: (value: string) => void;
 }
 
-const Input = ({ inputName, initialValue, onValueChange }: InputProps) => {
+const Input = ({ inputName, initialValue }: InputProps) => {
   let input;
 
   switch (inputName) {
@@ -45,9 +43,6 @@ const Input = ({ inputName, initialValue, onValueChange }: InputProps) => {
             type="text"
             value={initialValue}
             placeholder="닉네임을 입력해주세요."
-            onChange={(event) => {
-              onValueChange?.(event.target.value);
-            }}
           />
         </div>
       );
@@ -60,9 +55,6 @@ const Input = ({ inputName, initialValue, onValueChange }: InputProps) => {
             type="text"
             value={initialValue}
             placeholder="스테디명"
-            onChange={(event) => {
-              onValueChange?.(event.target.value);
-            }}
           />
         </div>
       );
@@ -75,9 +67,6 @@ const Input = ({ inputName, initialValue, onValueChange }: InputProps) => {
             type="text"
             value={initialValue}
             placeholder="제목을 입력해주세요."
-            onChange={(event) => {
-              onValueChange?.(event.target.value);
-            }}
           />
         </div>
       );
diff --git a/src/components/_common/Selector/Date/index.tsx b/src/components/_common/Selector/Date/index.tsx
index ff7bc9e0..5bbfa2ce 100644
--- a/src/components/_common/Selector/Date/index.tsx
+++ b/src/components/_common/Selector/Date/index.tsx
@@ -16,26 +16,20 @@ interface DateSelectorProps {
   className?: string;
   initialLabel?: string;
   initialDate?: Date;
-  // eslint-disable-next-line no-unused-vars
-  onDateChange?: (date: Date) => void;
 }
 
 const DateSelector = ({
   className,
   initialLabel,
   initialDate,
-  onDateChange,
 }: DateSelectorProps) => {
   const [date, setDate] = useState<Date | undefined>(undefined);
 
   useEffect(() => {
     if (initialDate) {
       setDate(initialDate);
-      if (onDateChange) {
-        onDateChange(initialDate);
-      }
     }
-  }, [initialDate, onDateChange]);
+  }, [initialDate]);
 
   return (
     <Popover>
@@ -49,9 +43,7 @@ const DateSelector = ({
           )}
         >
           {date ? (
-            <span className={"mx-auto"}>
-              {format(date, "yyyy년 MM월 dd일")}
-            </span>
+            format(date, "PPP")
           ) : (
             <span className={"mx-auto"}>{initialLabel}</span>
           )}
@@ -62,12 +54,7 @@ const DateSelector = ({
         <Calendar
           mode="single"
           selected={date}
-          onSelect={(selected) => {
-            setDate(selected);
-            if (onDateChange && selected) {
-              onDateChange(selected);
-            }
-          }}
+          onSelect={setDate}
           initialFocus
         />
       </PopoverContent>
diff --git a/src/components/_common/Selector/Multi/index.tsx b/src/components/_common/Selector/Multi/index.tsx
index 7b2fdac1..f20ae597 100644
--- a/src/components/_common/Selector/Multi/index.tsx
+++ b/src/components/_common/Selector/Multi/index.tsx
@@ -14,8 +14,6 @@ interface MultiSelectorProps {
   initialLabel?: string;
   initialData?: SelectItem[];
   className?: string;
-  // eslint-disable-next-line no-unused-vars
-  onSelectedChange?: (selected: SelectItem[]) => void;
 }
 
 const MultiSelector = ({
@@ -23,7 +21,6 @@ const MultiSelector = ({
   initialLabel,
   initialData,
   className,
-  onSelectedChange,
 }: MultiSelectorProps) => {
   const inputRef = useRef<HTMLInputElement>(null);
   const [open, setOpen] = useState(false);
@@ -138,7 +135,6 @@ const MultiSelector = ({
                     onSelect={() => {
                       setInputValue("");
                       setSelected((prev) => [...prev, item]);
-                      onSelectedChange?.([...selected, item]);
                     }}
                     className={
                       "cursor-pointer px-35 py-8 hover:bg-accent hover:text-accent-foreground"
diff --git a/src/components/_common/Selector/Single/index.tsx b/src/components/_common/Selector/Single/index.tsx
index 34238465..2a3665c3 100644
--- a/src/components/_common/Selector/Single/index.tsx
+++ b/src/components/_common/Selector/Single/index.tsx
@@ -14,8 +14,6 @@ interface SingleSelectorProps {
   initialLabel?: string;
   initialData?: SelectItemProps;
   className?: string;
-  // eslint-disable-next-line no-unused-vars
-  onSelectedChange?: (selected: string) => void;
 }
 
 const SingleSelector = ({
@@ -23,17 +21,9 @@ const SingleSelector = ({
   initialLabel,
   initialData,
   className,
-  onSelectedChange,
 }: SingleSelectorProps) => {
   return (
-    <Select
-      defaultValue={initialData?.value}
-      onValueChange={(value) => {
-        if (onSelectedChange) {
-          onSelectedChange(value);
-        }
-      }}
-    >
+    <Select defaultValue={initialData?.value}>
       <SelectTrigger className={cn(className)}>
         <SelectValue
           className={cn("font-semibold")}
diff --git a/src/components/ui/form.tsx b/src/components/ui/form.tsx
deleted file mode 100644
index db317ce9..00000000
--- a/src/components/ui/form.tsx
+++ /dev/null
@@ -1,174 +0,0 @@
-import * as React from "react";
-import type { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
-import { Controller, FormProvider, useFormContext } from "react-hook-form";
-import { Label } from "@/components/ui/label";
-import { cn } from "@/lib/utils";
-import type * as LabelPrimitive from "@radix-ui/react-label";
-import { Slot } from "@radix-ui/react-slot";
-
-const Form = FormProvider;
-
-type FormFieldContextValue<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
-> = {
-  name: TName;
-};
-
-const FormFieldContext = React.createContext<FormFieldContextValue>(
-  {} as FormFieldContextValue,
-);
-
-const FormField = <
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
->({
-  ...props
-}: ControllerProps<TFieldValues, TName>) => {
-  return (
-    <FormFieldContext.Provider value={{ name: props.name }}>
-      <Controller {...props} />
-    </FormFieldContext.Provider>
-  );
-};
-
-const useFormField = () => {
-  const fieldContext = React.useContext(FormFieldContext);
-  const itemContext = React.useContext(FormItemContext);
-  const { getFieldState, formState } = useFormContext();
-
-  const fieldState = getFieldState(fieldContext.name, formState);
-
-  if (!fieldContext) {
-    throw new Error("useFormField should be used within <FormField>");
-  }
-
-  const { id } = itemContext;
-
-  return {
-    id,
-    name: fieldContext.name,
-    formItemId: `${id}-form-item`,
-    formDescriptionId: `${id}-form-item-description`,
-    formMessageId: `${id}-form-item-message`,
-    ...fieldState,
-  };
-};
-
-type FormItemContextValue = {
-  id: string;
-};
-
-const FormItemContext = React.createContext<FormItemContextValue>(
-  {} as FormItemContextValue,
-);
-
-const FormItem = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => {
-  const id = React.useId();
-
-  return (
-    <FormItemContext.Provider value={{ id }}>
-      <div
-        ref={ref}
-        className={cn("space-y-2", className)}
-        {...props}
-      />
-    </FormItemContext.Provider>
-  );
-});
-FormItem.displayName = "FormItem";
-
-const FormLabel = React.forwardRef<
-  React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>
->(({ className, ...props }, ref) => {
-  const { error, formItemId } = useFormField();
-
-  return (
-    <Label
-      ref={ref}
-      className={cn(error && "text-destructive", className)}
-      htmlFor={formItemId}
-      {...props}
-    />
-  );
-});
-FormLabel.displayName = "FormLabel";
-
-const FormControl = React.forwardRef<
-  React.ElementRef<typeof Slot>,
-  React.ComponentPropsWithoutRef<typeof Slot>
->(({ ...props }, ref) => {
-  const { error, formItemId, formDescriptionId, formMessageId } =
-    useFormField();
-
-  return (
-    <Slot
-      ref={ref}
-      id={formItemId}
-      aria-describedby={
-        !error
-          ? `${formDescriptionId}`
-          : `${formDescriptionId} ${formMessageId}`
-      }
-      aria-invalid={!!error}
-      {...props}
-    />
-  );
-});
-FormControl.displayName = "FormControl";
-
-const FormDescription = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
->(({ className, ...props }, ref) => {
-  const { formDescriptionId } = useFormField();
-
-  return (
-    <p
-      ref={ref}
-      id={formDescriptionId}
-      className={cn("text-sm text-muted-foreground", className)}
-      {...props}
-    />
-  );
-});
-FormDescription.displayName = "FormDescription";
-
-const FormMessage = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLParagraphElement>
->(({ className, children, ...props }, ref) => {
-  const { error, formMessageId } = useFormField();
-  const body = error ? String(error?.message) : children;
-
-  if (!body) {
-    return null;
-  }
-
-  return (
-    <p
-      ref={ref}
-      id={formMessageId}
-      className={cn("text-sm font-medium text-destructive", className)}
-      {...props}
-    >
-      {body}
-    </p>
-  );
-});
-FormMessage.displayName = "FormMessage";
-
-export {
-  useFormField,
-  Form,
-  FormItem,
-  FormLabel,
-  FormControl,
-  FormDescription,
-  FormMessage,
-  FormField,
-};
diff --git a/src/components/ui/label.tsx b/src/components/ui/label.tsx
deleted file mode 100644
index bbe96b49..00000000
--- a/src/components/ui/label.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-"use client";
-
-import * as React from "react";
-import { cn } from "@/lib/utils";
-import * as LabelPrimitive from "@radix-ui/react-label";
-import { type VariantProps, cva } from "class-variance-authority";
-
-const labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
-);
-
-const Label = React.forwardRef<
-  React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
-    VariantProps<typeof labelVariants>
->(({ className, ...props }, ref) => (
-  <LabelPrimitive.Root
-    ref={ref}
-    className={cn(labelVariants(), className)}
-    {...props}
-  />
-));
-Label.displayName = LabelPrimitive.Root.displayName;
-
-export { Label };
diff --git a/src/constants/create-steady.ts b/src/constants/create-steady.ts
index 931f6cae..cfc4f9fc 100644
--- a/src/constants/create-steady.ts
+++ b/src/constants/create-steady.ts
@@ -45,8 +45,8 @@ export const STEADY_RESPONSE_MOCK_DATA = {
 };
 
 export const steadyCategories = [
-  { value: "STUDY", label: "스터디" },
-  { value: "PROJECT", label: "프로젝트" },
+  { value: "study", label: "스터디" },
+  { value: "project", label: "프로젝트" },
 ];
 
 export const steadyParticipantsLimit = [
@@ -62,18 +62,17 @@ export const steadyParticipantsLimit = [
 ];
 
 export const steadyRecruitmentFields = [
-  { value: "1", label: "프론트엔드" },
-  { value: "2", label: "백엔드" },
-  { value: "3", label: "디자인" },
-  { value: "4", label: "기획" },
-  { value: "5", label: "마케팅" },
-  { value: "6", label: "기타" },
+  { value: "frontend", label: "프론트엔드" },
+  { value: "backend", label: "백엔드" },
+  { value: "design", label: "디자인" },
+  { value: "planning", label: "기획" },
+  { value: "marketing", label: "마케팅" },
+  { value: "etc", label: "기타" },
 ];
 
 export const steadyRunningMethods = [
-  { value: "OFFLINE", label: "오프라인" },
-  { value: "ONLINE", label: "온라인" },
-  { value: "BOTH", label: "혼합" },
+  { value: "offline", label: "오프라인" },
+  { value: "online", label: "온라인" },
 ];
 
 export const steadyExpectedPeriods = [
@@ -92,25 +91,25 @@ export const steadyExpectedPeriods = [
 ];
 
 export const steadyExpectedTechStacks = [
-  { value: "1", label: "React" },
-  { value: "2", label: "Next.js" },
-  { value: "3", label: "Vue" },
-  { value: "4", label: "Nuxt.js" },
-  { value: "5", label: "Angular" },
-  { value: "6", label: "Svelte" },
-  { value: "7", label: "Express" },
-  { value: "8", label: "Nest.js" },
-  { value: "9", label: "Django" },
-  { value: "10", label: "Flask" },
-  { value: "11", label: "Spring" },
-  { value: "12", label: "MyBatis" },
-  { value: "13", label: "JPA" },
-  { value: "14", label: "Hibernate" },
-  { value: "15", label: "MySQL" },
-  { value: "16", label: "MariaDB" },
+  { value: "react", label: "React" },
+  { value: "nextjs", label: "Next.js" },
+  { value: "vue", label: "Vue" },
+  { value: "nuxtjs", label: "Nuxt.js" },
+  { value: "angular", label: "Angular" },
+  { value: "svelte", label: "Svelte" },
+  { value: "express", label: "Express" },
+  { value: "nestjs", label: "Nest.js" },
+  { value: "django", label: "Django" },
+  { value: "flask", label: "Flask" },
+  { value: "spring", label: "Spring" },
+  { value: "mybatis", label: "MyBatis" },
+  { value: "jpa", label: "JPA" },
+  { value: "hibernate", label: "Hibernate" },
+  { value: "mysql", label: "MySQL" },
+  { value: "mariadb", label: "MariaDB" },
 ];
 
 export const steadyRecruitmentStatus = [
-  { value: "RECRUITING", label: "모집중" },
-  { value: "CLOSED", label: "모집 마감" },
+  { value: "recruiting", label: "모집중" },
+  { value: "recruited", label: "모집 마감" },
 ];
diff --git a/src/constants/schemas/steadySchema.ts b/src/constants/schemas/steadySchema.ts
deleted file mode 100644
index 79255405..00000000
--- a/src/constants/schemas/steadySchema.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import * as z from "zod";
-import { number } from "zod";
-import { extractValue } from "@/utils/extractValue";
-import {
-  steadyCategories,
-  steadyExpectedPeriods,
-  steadyRunningMethods,
-} from "@/constants/create-steady";
-
-export const SteadySchema = z.object({
-  name: z.string({ required_error: "스테디의 이름을 입력해주세요." }),
-  bio: z.string({ required_error: "스테디의 소개를 입력해주세요." }),
-  type: z.enum(extractValue(steadyCategories), {
-    required_error: "스테디의 유형을 선택해주세요.",
-  }),
-  participantLimit: z
-    .number({ required_error: "스테디의 정원을 선택해주세요." })
-    .min(2)
-    .max(10),
-  steadyMode: z.enum(extractValue(steadyRunningMethods), {
-    required_error: "스테디의 진행 방식을 선택해주세요.",
-  }),
-  scheduledPeriod: z.enum(extractValue(steadyExpectedPeriods), {
-    required_error: "스테디의 예상 진행 기간을 선택해주세요.",
-  }),
-  deadline: z.string({
-    required_error: "스테디의 모집 마감일을 선택해주세요.",
-  }),
-  title: z.string({ required_error: "스테디의 모집글 제목을 입력해주세요." }),
-  content: z.string({
-    required_error: "스테디의 모집글 내용을 입력해주세요.",
-  }),
-  positions: z.array(number(), {
-    required_error: "스테디의 모집 분야를 선택해주세요.",
-  }),
-  stacks: z.array(number(), {
-    required_error: "스테디의 기술 스택을 선택해주세요.",
-  }),
-});
-
-export type SteadyStateType = z.infer<typeof SteadySchema>;
diff --git a/src/services/steady/createSteady.ts b/src/services/steady/createSteady.ts
deleted file mode 100644
index 015c53cb..00000000
--- a/src/services/steady/createSteady.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { axiosInstance } from "@/services";
-import type { CreateSteadyRequestBodyType } from "@/services/types";
-
-const createSteady = async (data: CreateSteadyRequestBodyType) => {
-  try {
-    const response = await axiosInstance.post("/api/v1/steadies", data);
-    if (Math.floor(response.status / 10) !== 20) {
-      throw new Error("Failed to fetch create steady api!");
-    }
-    return response.data;
-  } catch (error) {
-    console.error(error);
-    throw error;
-  }
-};
-
-export default createSteady;
diff --git a/src/services/types/index.ts b/src/services/types/index.ts
index 687efcf6..aff76d5e 100644
--- a/src/services/types/index.ts
+++ b/src/services/types/index.ts
@@ -57,21 +57,6 @@ export interface SteadyDetailsType {
   promotionCount: number;
 }
 
-export interface CreateSteadyRequestBodyType {
-  name: string;
-  bio: string;
-  type: string;
-  participantLimit: number;
-  steadyMode: string;
-  scheduledPeriod: string;
-  deadline: string;
-  title: string;
-  content: string;
-  positions: number[];
-  stacks: number[];
-  questions: string[];
-}
-
 export interface ApplicationSurveyType {
   question: string;
   answer: string;
@@ -90,4 +75,4 @@ export interface ApplicationsListType {
   content: UserType[];
   numberOfElements: number;
   hasNext: boolean;
-}
+}
\ No newline at end of file
diff --git a/src/stores/createSteadyData.ts b/src/stores/createSteadyData.ts
deleted file mode 100644
index 2b40fd0a..00000000
--- a/src/stores/createSteadyData.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { create } from "zustand";
-import { persist } from "zustand/middleware";
-import type { SteadyStateType } from "@/constants/schemas/steadySchema";
-
-const CreateSteadyStorageKey = "create-steady-key";
-
-interface CreateSteadyState {
-  steadyState: SteadyStateType;
-  // eslint-disable-next-line no-unused-vars
-  setSteadyState: (steadyState: SteadyStateType) => void;
-}
-
-export const useCreateSteadyStore = create(
-  persist<CreateSteadyState>(
-    (set) => ({
-      steadyState: {} as SteadyStateType,
-      setSteadyState: (steadyState: SteadyStateType) => set({ steadyState }),
-    }),
-    {
-      name: CreateSteadyStorageKey,
-    },
-  ),
-);
-
-export default useCreateSteadyStore;
diff --git a/src/utils/extractValue.ts b/src/utils/extractValue.ts
deleted file mode 100644
index 1c0b27e6..00000000
--- a/src/utils/extractValue.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// thanks to @Souperman at https://stackoverflow.com/questions/73825273/creating-a-zod-enum-from-an-object
-export const extractValue = (target: { value: string; label: string }[]) => {
-  if (
-    !target ||
-    target.length === 0 ||
-    target.some((item) => item === undefined || item.value === undefined)
-  ) {
-    return [];
-  }
-  type property = (typeof target)[number]["value"];
-  const valueArray: [property, ...property[]] = [
-    target[0].value,
-    ...target.slice(1).map((item) => item.value),
-  ];
-  return valueArray;
-};
diff --git a/src/utils/formatDate.ts b/src/utils/formatDate.ts
deleted file mode 100644
index 7286ab35..00000000
--- a/src/utils/formatDate.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export const formatDate = (date: Date): string => {
-  const year = date.getFullYear();
-  const month = date.getMonth() + 1;
-  const day = date.getDate();
-  return `${year}-${month}-${day < 10 ? `0${day}` : day}`;
-};