refact: 자동 하이픈 함수를 공통 유틸리티 함수로 추출

Author: xaexunxang

src/pages/dashboard/ui/EventInfoPage.tsx

@@ -11,20 +11,14 @@ import { AddressSearch } from '../../../shared/ui/AddressSearch';
 import KakaoMap from '../../../shared/ui/KakaoMap';
 import { UpdateEventRequest } from '../../../features/dashboard/model/event';
 import { useEventDetail } from '../../../entities/event/hook/useEventHook';
+import { formatPhoneNumber } from '../../../shared/utils/phoneFormatter';
 
 const EventInfoPage = () => {
   const queryClient = useQueryClient();
   const [selectedOption, setSelectedOption] = useState('');
   const { data } = useEventDetail();
   const { mutate } = useUpdateEventHook();
 
-  const formatPhoneNumber = (value: string) => {
-    const numbers = value.replace(/[^\d]/g, '').slice(0, 11); // 11자리까지만 허용
-    if (numbers.length <= 3) return numbers;
-    if (numbers.length <= 7) return `${numbers.slice(0, 3)}-${numbers.slice(3)}`;
-    return `${numbers.slice(0, 3)}-${numbers.slice(3, 7)}-${numbers.slice(7, 11)}`;
-  };
-
   const handleSelect = (option: string) => {
     setSelectedOption(option);
   };

src/pages/event/ui/create-event/EventOrganizerInfoPage.tsx

@@ -3,6 +3,7 @@ import { useForm } from 'react-hook-form';
 import UnderlineTextField from '../../../../../design-system/ui/textFields/UnderlineTextField';
 import { useFunnelState } from '../../../../features/event/model/FunnelContext';
 import { OrganizerFormData, organizerZodValidation } from '../../../../shared/lib/formValidation';
+import { formatPhoneNumber } from '../../../../shared/utils/phoneFormatter';
 
 interface EventOrganizerInfoPageProps {
   onValidationChange?: (isValid: boolean) => void;
@@ -11,13 +12,6 @@ interface EventOrganizerInfoPageProps {
 const EventOrganizerInfoPage = ({ onValidationChange }: EventOrganizerInfoPageProps) => {
   const { eventState, setEventState } = useFunnelState();
 
-  const formatPhoneNumber = (value: string) => {
-    const numbers = value.replace(/[^\d]/g, '').slice(0, 11); // 11자리까지만 허용
-    if (numbers.length <= 3) return numbers;
-    if (numbers.length <= 7) return `${numbers.slice(0, 3)}-${numbers.slice(3)}`;
-    return `${numbers.slice(0, 3)}-${numbers.slice(3, 7)}-${numbers.slice(7, 11)}`;
-  };
-
   const {
     register,
     setValue,    

src/pages/join/InfoInputPage.tsx

@@ -7,13 +7,7 @@ import UnderlineTextField from '../../../design-system/ui/textFields/UnderlineTe
 import { FormData, zodValidation } from '../../shared/lib/formValidation';
 import { useUserInfo, useUserUpdate } from '../../features/join/hooks/useUserHook';
 import useAuthStore from '../../app/provider/authStore';
-
-const formatPhoneNumber = (value: string) => {
-  const numbers = value.replace(/[^\d]/g, '').slice(0, 11); // 11자리까지만 허용
-  if (numbers.length <= 3) return numbers;
-  if (numbers.length <= 7) return `${numbers.slice(0, 3)}-${numbers.slice(3)}`;
-  return `${numbers.slice(0, 3)}-${numbers.slice(3, 7)}-${numbers.slice(7, 11)}`;
-};
+import { formatPhoneNumber } from '../../shared/utils/phoneFormatter';
 
 const InfoInputPage = () => {
   const { data, isLoading } = useUserInfo();

src/shared/utils/phoneFormatter.ts

@@ -0,0 +1,6 @@
+export const formatPhoneNumber = (value: string) => {
+  const numbers = value.replace(/[^\d]/g, '').slice(0, 11); // 11자리까지만 허용
+  if (numbers.length <= 3) return numbers;
+  if (numbers.length <= 7) return `${numbers.slice(0, 3)}-${numbers.slice(3)}`;
+  return `${numbers.slice(0, 3)}-${numbers.slice(3, 7)}-${numbers.slice(7, 11)}`;
+};