Merge pull request #35 from nguswjd/feat/signup

Feat/signup

Author: nguswjd

src/auth/sign-up.tsx

@@ -22,7 +22,6 @@ import {
 } from '../store/slices/signup-address-slice';
 
 import { useCompleteSignupMutation } from '../store/api/authApi';
-import { clearAuth } from '../store/slices/authSlice';
 import type { RootState } from '../store/index';
 import type { CompleteSignupRequest } from '../types/authTypes';
 
@@ -130,7 +129,7 @@ const SUBMIT_BUTTON_LABELS: Record<UserType, string> = {
 interface LabeledInputProps {
   id?: string;
   label: string;
-  type?: 'text' | 'password' | 'email' | 'tel';
+  type?: 'text' | 'password' | 'tel';
   placeholder?: string;
   className?: string;
   value?: string;
@@ -254,7 +253,6 @@ export function Signup() {
   // 폼 데이터 상태
   const [formData, setFormData] = useState({
     name: '',
-    email: '',
     phoneNumber: '',
     // 사업자 정보
     shopName: '',
@@ -322,7 +320,7 @@ export function Signup() {
     }
 
     // 폼 검증
-    if (!formData.name || !formData.email || !formData.phoneNumber) {
+    if (!formData.name || !formData.phoneNumber) {
       alert('필수 정보를 모두 입력해주세요.');
       return;
     }
@@ -343,7 +341,6 @@ export function Signup() {
     try {
       const requestData: CompleteSignupRequest = {
         name: formData.name,
-        email: formData.email,
         phoneNumber: formData.phoneNumber,
         smsAgreement: agreements.notification || false,
         marketingAgreement: agreements.marketing || false,
@@ -360,13 +357,6 @@ export function Signup() {
     }
   };
 
-  const handleCancel = () => {
-    if (confirm('회원가입을 취소하시겠습니까?')) {
-      dispatch(clearAuth());
-      navigate('/');
-    }
-  };
-
   return (
     <div className="flex w-screen flex-col items-center gap-4 p-4">
       <div className="flex w-full max-w-md gap-2">
@@ -397,24 +387,16 @@ export function Signup() {
           />
         )}
 
-        <LabeledInput
-          id="email"
-          label="이메일"
-          type="email"
-          value={formData.email}
-          onChange={(e) => setFormData({ ...formData, email: e.target.value })}
-          placeholder="example@email.com"
-        />
-
-        <LabeledInput
+        <LabeledInputWithButton
           id="phone"
           label="휴대폰번호"
+          buttonLabel="휴대폰인증"
           type="tel"
           value={formData.phoneNumber}
           onChange={(e) =>
             setFormData({ ...formData, phoneNumber: e.target.value })
           }
-          placeholder="010-1234-5678"
+          // placeholder="010-1234-5678"
         />
 
         {isBusinessUser && (
@@ -444,7 +426,7 @@ export function Signup() {
               onChange={(e) =>
                 setFormData({ ...formData, businessNumber: e.target.value })
               }
-              placeholder="000-00-00000"
+              // placeholder="000-00-00000"
             />
 
             <div className="flex flex-col gap-1">
@@ -481,7 +463,7 @@ export function Signup() {
                 <label htmlFor="businessType">업종</label>
                 <SelectBox
                   options={[
-                    { value: '', label: '선택해주세요' },
+                    { value: '', label: '' },
                     { value: 'retail', label: '소매업' },
                     { value: 'manufacturing', label: '제조업' },
                   ]}
@@ -495,7 +477,7 @@ export function Signup() {
                 <label htmlFor="businessCategory">업태</label>
                 <SelectBox
                   options={[
-                    { value: '', label: '선택해주세요' },
+                    { value: '', label: '' },
                     { value: 'craft', label: '공예품' },
                     { value: 'art', label: '예술품' },
                   ]}
@@ -511,14 +493,14 @@ export function Signup() {
               id="businessCert"
               label="사업자등록증 업로드"
               buttonLabel="업로드"
-              placeholder="파일을 선택해주세요"
+              // placeholder="파일을 선택해주세요"
             />
 
             <div className="flex w-full flex-col gap-2">
               <label htmlFor="mainCategory">주요 카테고리</label>
               <SelectBox
                 options={[
-                  { value: '', label: '선택해주세요' },
+                  { value: '', label: '' },
                   { value: 'pottery', label: '도자기' },
                   { value: 'textile', label: '섬유/직물' },
                   { value: 'wood', label: '목공예' },
@@ -561,13 +543,6 @@ export function Signup() {
         </div>
 
         <div className="flex gap-2">
-          <Button
-            type="button"
-            label="취소"
-            variant="secondaryLight"
-            onClick={handleCancel}
-            className="flex-1"
-          />
           <Button
             type="submit"
             label={isLoading ? '처리 중...' : SUBMIT_BUTTON_LABELS[userType]}

src/store/slices/authSlice.ts

@@ -35,18 +35,8 @@ const authSlice = createSlice({
     setSignupRequired: (state, action: PayloadAction<boolean>) => {
       state.signupRequired = action.payload;
     },
-
-    clearAuth: (state) => {
-      state.accessToken = null;
-      state.user = null;
-      state.isAuthenticated = false;
-      state.signupRequired = false;
-      localStorage.removeItem('accessToken');
-      localStorage.removeItem('user');
-    },
   },
 });
 
-export const { setAccessToken, setUser, setSignupRequired, clearAuth } =
-  authSlice.actions;
+export const { setAccessToken, setUser, setSignupRequired } = authSlice.actions;
 export default authSlice.reducer;

src/types/authTypes.ts

@@ -2,7 +2,6 @@ export type UserRole = 'TEMP' | 'CUSTOMER' | 'ARTIST' | 'SHOP';
 
 export interface AuthUser {
   userId: number;
-  email: string | null;
   name: string | null;
   phoneNumber: string | null;
   profileImage: string | null;
@@ -11,7 +10,6 @@ export interface AuthUser {
 
 export interface CompleteSignupRequest {
   name: string;
-  email: string;
   phoneNumber: string;
   smsAgreement: boolean;
   marketingAgreement: boolean;