[Feature] - touroot v1.0.0 (#405)

* [Feature] - 프로젝트 환경 세팅 (#4)

* chore: 초기 package.json 설정

* chore: .gitignore 추가

* chore: tsconfig.json 초기 설정

* chore: react 내 webpack 세팅

1. webpack 관련 의존성 추가

2. build scrpit 수정

3. webpack.common.js 추가

4. public 디렉터리 내 index.html 추가

5. src 디렉터리 내 App.tsx 및 main.tsx 추가

* chore: prettier & eslint 설정

* chore: emotion 설정

* docs: pull request 템플릿 추가

* chore: package.json 내 broswerslist 변경

1%에서 5%로 변경(크롬, 사파리, 엣지만 점유율이 5% 이상이기 때문)

사소한 설정으로 인해 develop에 바로 push

* [Feature] - stylelint 설정 (#51)

* chore: stylelint 관련 의존성 추가

* chore: stylelint 규칙 stylelintrc.json에 추가

* chore: vscode 관련 설정 추가

* [Feature] - 여행기 상세 기능 구현 (#42)

* feat: 기본 폰트 설정

1. webpack 내 asset/resource 옵션 추가

2. pretendard 폰트 추가

3. woff에 대한 타입 추가

4. globalStyle 내 기본 폰트를 pretendard로 변경

* feat: svg 내 asset 설정

* feat: ThemeProvider 추가

1. theme 관련 declare 파일 추가

2. theme 추가

3. theme을 ThemeProvider 적용

* feat: svg를 컴포넌트 형태로 사용하도록 변경

1. @svgr/webpack 의존성 추가

2. webpack.common.js 내 관련 설정 추가(url, component 모두 사용)

3. svg.d.ts 내 svg 관련 타입 설정 추가

* feat: font 관련 local 함수 추가

* feat: assets/index.ts 내 marker url 설정 추가

* feat: tanstack query 의존성 추가

* chore: prettier 내 sort 순서 변경

* chore: 환경 변수 세팅

1. dotenv-webpack 의존성 추가

2. webpack config 파일 내 DotenvWebpack를 통해 환경변수 파일 동적으로 변경하도록 설정

* feat: axios instance 객체 생성

baseUrl 지정

* feat: react-query 및 devtools 설정 추가

* chore: @apis path alias 추가

* refactor: theme 내 detail에 font-family 제거

* feat: Box 컴포넌트 구현

* feat: Carousel 컴포넌트 구현

* feat: Header 컴포넌트 구현

* feat: Tab 컴포넌트 구현

* feat: TransformBottomSheet 컴포넌트 구현

* feat: PlaceDetailCard 컴포넌트 구현

* feat: TravelogueTabContent 컴포넌트 구현

* feat: GoogleMapView 컴포넌트 구현

* chore: re-export 관련 설정 추가

* feat: 초기 여행기 상세 페이지 구현

* chore: .gitignore 내 .env.development, .env.production만 오도록 변경

* chore: @react-google-maps/api 의존성 추가

* fix(Carousel): 이미지가 이동하지 않는 문제 해결

max-width 대신 transform 속성 추가

* [Feature] - codeowner 및 자동 할당 설정 (#59)

* chore: codeowners 설정 추가

* [Feature] - 테스트 환경 설정 추가 (#58)

* chore: storybook 관련 설정 추가

* chore: jest 관련 의존성 및 script 추가

* chore: jest config 파일 관련 의존성 추가

* chore: eslint 파일 내 jest plugin 추가

* [Feature] Storybook 배포 설정 (#61)

* chore: chromatic 배포 설정 추가

* feat: TransformBottomSheet story 파일 추가

* chore: chromatic ci/cd 설정 추가

* [Feature] - react-router-dom 설정  (#71)

* chore: react-router-dom 세팅

* chore: createBrowserRouter 적용

* chore: @Constants path alias 추가

* feat: AppLayout 컴포넌트 추가

1. TravelogueDetailPage 내 margin-top 제거

2. AppLayout 컴포넌트 구현

* feat: router path 관련 상수 추가

* refactor: router 세팅 변경

1. App 내 router router.tsx로 이동

2. router.tsx 내 AppLayout 추가 및 router path 설정

* chore: storybook-addon-remix-react-router 의존성 추가

* chore: storybook 내 router addon 설정 추가

---------

Co-authored-by: 손진영 <[email protected]>

* [Feature] - 서비스 Foundation 설정 (#76)

* chore: styles 내 declare 파일들 types 폴더로 이동

* chore: foundation 정의

1. color, spacing, typography에 대한 foundation 추가

2. global theme 변경

3. emotion.d.ts 내 declare theme 타입 변경

* refactor: foundation 컴포넌트 들에 적용

* chore: stylelint 적용

* [Feature] - msw 설정 (#73)

* chore: msw 의존성 추가

* fix: msw v2 내 발생하는 문제 해결을 위한 폴리필 코드 추가

ReferenceError: TextEncoder is not defined 에러 발생 방지를 위해 폴리필 코드 추가

1. package.json 내 undici 의존성 추가

2. jest.polyfills.js 내 관련 설정 추가

3. jest.config.js 내 폴리필 관련 설정 추가

* chore: @Mocks 관련 설정 추가

1. path alias 추가(webpack, tsconfig)

2. prettier import sort 내 mocks 추가

* chore: typescript 환경에서 jest api를 제공하기 위한 설정 추가

* chore: msw 기본 설정 추가

* chore: 불필요한 chromatic_publish 파일 제거

* chore: msw-storybook-addon 의존성 추가

* chore: storybook 내 msw 설정 추가

1. main.ts 내 환경 변수 설정 추가

2. preview.tsx 내 initialize & mswLoader 설정, handler 추가

3. npx msw init public/ 명령어 실행(mockServiceWorker.js & package.json 내 msw workerDirectory 추가

* [Feature] - 여행기 등록 페이지에 필요한 공통 컴포넌트 구현(지니) (#91)

* feat(assets): 휴지통 아이콘 추가

* feat(Accordian): 아코디언 컴포넌트 구현

* test(Accordion): 아코디언 컴포넌트 스토리북 추가

* feat(Button): 버튼 컴포넌트 구현

* test(Button): 버튼 컴포넌트 스토리북 추가

* test(Accordion): 테스트 케이스 네이밍을 영어로 수정

* feat(asset): asset 추가

* feat(Icon): 아이콘 컴포넌트 구현

* test(Icon): Icon 컴포넌트 스토리북 추가

* feat(IconButton): IconButton 컴포넌트 구현

* test(IconButton): IconButton 컴포넌트 스토리북 추가

* feat(Icon): svg들에 대한 json 파일 추가

* feat(Text): Text 컴포넌트 구현

* test(Text): Text 컴포넌트 스토리북 추가

* refactor(preview): 스토리북 root에 rootStyle 추가

* test(Text): Overview 스토리 추가

* test(preview): 스토리북 환경 root style 변경

1. preview.tsx 내 rootStyle 변경 후 다른 story들에 적용

* refactor(Button): ButtonVariants import 시 type 추가

* refactor(Text): 변수 내에서 export 하도록 변경

* refactor(Icon): type들 type.ts로 분리

* refactor(Icon): import 방식 변경

* [Feature] - 여행기 등록 페이지에 필요한 공통 컴포넌트 구현(시모) (#90)

* feat(Input): 컴포넌트 구현

* feat(InputField): 컴포넌트 구현

* fix(tsconfig): 개행으로 인한 오류 해결

* test(Input): 스토리북 구현

* test(InputField): 스토리북 구현

* refactor(InputContainer): 파일명 수정 및 count 컴포넌트 분리

* feat(Textarea): 컴포넌트 구현

* refactor(Textarea): props 및 css 수정

* test(Textarea): 스토리북 구현

* refactor(Count): 네이밍 직관적으로 수정

* refactor(Input): InputContainer를 Input으로 단일화

* refactor(Textarea): title 수정

* feat(BackDrop): 컴포넌트 구현

* feat(asset): Tturi svg 추가

* refactor(BackDrop): position 수정

* feat(asset): close-button svg 추가

* feat(Button): 컴포넌트 구현

* feat(ModalContainer): 컴포넌트 구현

* feat(ModalContent): 컴포넌트 구현

* feat(ModalFooter): 컴포넌트 구현

* feat(ModalHeader): 컴포넌트 구현

* feat(Modal): 컴포넌트 구현

* test(Modal): 스토리북 구현

* refactor(asset): close button 삭제

* refactor: modalBottomSheet로 네이밍 수정

* refactor(storybook): 모바일 환경을 위한 preview 수정, 불필요한 스토리북 테스트 삭제 및 네이밍 수정

* feat(Container): 에니메이션 추가

---------

Co-authored-by: jinyoung <[email protected]>

* [Feature] - 여행기 등록 페이지에 필요한 공통 컴포넌트 구현(리버) (#89)

* feat: MultiImageUpload 컴포넌트 구현

* feat: ThumbnailUpload 컴포넌트 구현

* fix: emotion css를 styled로 수정

- storybook에서 emotion css가 적용되지 않는 문제가 있어서 emotion styled로 수정

* test: ThumnailUpload 컴포넌트 storybook 추가

* feat: MultiImageUpload 컴포넌트 이미지 삭제 기능 구현

* refactor: MultiImageUpload 컴포넌트에서 함수명 코드 컨벤션에 맞게 수정

* feat: ThumbnailUpload 컴포넌트 썸네일 수정 기능 구현

* feat: ThumbnailUploadButton에 gap 수정

* refactor: ThumbnailUpload 컴포넌트에서 중복 제거

* refactor: ThumbnailUpload 컴포넌트에서 화살표 함수로 단순화

* fix: MulitiImageUpload 컴포넌트에서 emotion css를 emotion styled로 수정

- storybook에서 emotion css 적용 되지 않는 이슈때문에 수정

* refactor: 이미지 업로드 로직을 useImageUpload로 분리

* test: MultiImageUpload 컴포넌트 storybook 추가

* fix: ThumbnailUpload 컴포넌트 storybook title 수정

* fix: MultiImageUpload 컴포넌트 storybook title 수정

* refactor: ThumbnailUpload 컴포넌트 storybook에서 base64를 mageUrl로 수정

-CORS 정책때문에 외부 URL에서 이미지를 직접 가져오는 것이 안됐었다.
- 이 때문에 imageUrl 대신 base64를 사용했었다
- base64 값이 너무 길다
- 때문에 무료 CORS 프록시 서비를 사용하여 imageUrl을 사용하는 방법으로 수정

* feat: MultiImageUpload 컴포넌트의 이미지 렌더링 부분에 스크롤 추가

* test: MultiImageUpload 컴포넌트 storybook에 이미지 많이 첨부한 경우 추가

* refactor: MultiImageUpload 컴포넌트 삭제 버튼에 svg 사용

* refactor: MultiImageUpload 컴포넌트에서 styled 컴포넌트명 수정

* feat: useDragScroll hook 구현

* feat: MultiImageUpload 컴포넌트에 드래그 스크롤 기능 추가

* feat: MultiImageUpload 컴포넌트에 y축 스크롤 hidden 추가

* refactor: MultiImageUpload 컴포넌트에서 사진 추가 버튼 UI 수정

---------

Co-authored-by: jinyoung <[email protected]>

* [Feature] - 여행기 등록 기능 구현 (#115)

* feat: types path alias 추가

* refactor(AccordionRoot): 다른 attributes들도 받을 수 있도록 변경

* fix(preview): 스토리북 열리지 않는 문제 해결

div 태그 추가

* chore: type, queries, hooks에 대한 type alias 추가

* feat: DayContent 컴포넌트 구현

* refactor(GoogleMapView): LoadScript 외부로 분리

1. GoogleMapView에서 LoadScript 제거

2. GoogleMapLoadScript 추가

* feat(GoogleSearchPopup): GoogleSearchPopup 컴포넌트 구현

* refactor(ModalBottomSheet): currentY 값 open시 0이 되도록 변경

* refactor(ModalBottomSheet): stylelint 적용

* refactor(MultiImageUpload): useImageUpload 반환 값을 외부에서 주입 받도록 변경

* feat(PageInfo): PageInfo 컴포넌트 구현

* test(PageInfo): PageInfo 컴포넌트 스토리북 구현

* chore: useDragScroll, useImageUpload 경로 변경

hooks에 위치하도록 변경

* refactor(ThumbnailUpload): useImageUpload 반환 값을 외부에서 주입 받도록 변경

* feat(TravelogueMultiImgaeUpload): TravelogueMultiImgaeUpload 컴포넌트 구현

* feat: register route path 추가

* feat(useTravelDays): useTravelDays hook 구현

* feat: travelogue 공통 타입들 추가

* feat: usePostTrevelogue 구현

* feat: usePostUploadImages 구현

* chore: reexport 추가

* feat: 여행기 등록 기능 구현

1. router에 추가

2. 여행기 등록 페이지 추가

* feat: 여행기 등록 완료 시 해당 상세 페이지로 이동하는 기능 추가

* [Feature] - 로그인 페이지 구현 (#80)

* chore(stylelint): properties 추가

* refactor(style): 스타일린트 적용

* feat(theme): white 컬러 추가

* refactor(Header): 재사용성을 위한 컴포넌트 수정

* refactor(style): Header align-items 추가

* feat(assets): Tturi webp asset 추가

* feat(Login): 로그인 페이지 컴포넌트 구현

* chore: dev 실행을 위한 dotenv-webpack 설치

* feat(assets): kakao symbol 추가

* feat(theme): yellow color 추가

* feat(LoginPage): 네이밍 변경 및 로그인 버튼 UI 추가 구현

* feat(LoginPage): 카카오 로그인 구현

* chore(webpack.common.js): publicPath 추가

* feat: IconButton 구현

* refactor(Header): Header 내 content를 내부에 넣도록 변경

* refactor(ExcitedTturi): tturi에서 네이밍 수정

* feat(constants): ROUTE_PATHS 추가

* refactor(LoginPage): 불필요한 주석 삭제 및 핸들러 네이밍 수정

* feat(KakaoCallbackPage): 페이지 구현

* feat(router): kakaoCallbackPage 추가

* feat(App): useContext 추가

---------

Co-authored-by: 손진영 <[email protected]>
Co-authored-by: jinyoung <[email protected]>

* [Feature] - 여행 계획 등록 페이지 구현 (#125)

* chore: react-datepicker 임시로 사용(데모데이때 빠르게 보여주기 위함)

* chore: css-loader, style-loader 추가

데모데이때 사용하는 date-picker를 위해 임시로 설치

* feat(DateRangePicker): 임시로 사용할 DateRangePicker 컴포넌트 구현

* refactor(Input): maxCount, count optional로 변경

* chore(main): datepicker css 추가

* refactor: Place 내 name을 placeName으로 변경

* refactor(useTravelDays): onAddDay에 useCallback 추가

* feat(usePostTravelPlan): 여행 계획 post 요청 hook 구현

* feat(TravelogueRegisterPage): 여행 계획 등록 페이지 구현

* [Feature] - 메인 페이지 구현 (#78)

* feat: AvatarCircle 컴포넌트 구현

* test: AvatarCircle 컴포넌트 storybook 추가

* feat: TravelogueCard 컴포넌트 구현

* test: TravelogueCard 컴포넌트 storybook 추가

* feat: MainPage 구현

* refactor: AvatarCircle 컴포넌트 useAvatar가 undefined일때도 기본 이미지 보이도록 수정

* feat: TravelCard 컴포넌트에서 likes 기본값 0으로 설정

* feat: useIntersectionObserver 훅 구현

* feat: useInfiniteTravelogues 구현

- 5개씩 fetch해옵니다.

* refactor: 메인페이지에서 useInfiniteTravelogues 사용하도록 수정

* feat: Drawer 컴포넌트 구현

* feat: Header 컴포넌트에 Drawer 추가

* test: Drawer storybook 추가

* feat: Drawer 컴포넌트 style 수정

* refactor: 잘못된 image url 다루는 부분 useImageError 훅으로 분리

* feat: TravelCard 컴포넌트에서 잘못된 image url 핸들 추가

* test: TravelogueCard 컴포넌트 strorybook에 유요하지 않은 썸네일 케이스 추가

---------

Co-authored-by: jinyoung <[email protected]>

* [Feature] - 여행 계획 상세조회 페이지 구현 (#127)

* chore: 업데이트된 다른 파일과 동기화

* feat(TravelPlansTabContent): 컴포넌트 구현

* feat(TravelPlansDetail): 컴포넌트 구현

* refactor(TravelogueDetailPage): 타입 분리 및 TransformBottomSheet props 수정에 따른 변경

* refactor: 네이밍 변경에 따른 수정 및 불 필요한 코드 삭제

Co-authored-by: choi river <[email protected]>
Co-authored-by: simorimi <[email protected]>

* refactor: 스타일링 조정 및 stylelint에 맞게 순서 수정

* refactor(storybook): decorator 수정

* chore(createPathElement): 설정

* [Feature] - 2차 스프린트 QA 진행 (#141)

* refactor: 네이밍 변경에 따른 수정 및 불 필요한 코드 삭제

Co-authored-by: choi river <[email protected]>
Co-authored-by: simorimi <[email protected]>

* refactor: 스타일링 조정 및 stylelint에 맞게 순서 수정

* refactor(storybook): decorator 수정

* chore(createPathElement): 설정

* fix(router): router 수정

1. travelPlans url에 TravelPlansDetailPage 추가

2. travelPlansRegister url에 TravelPlanRegisterPage 추가

* fix(Header): title style 변경

align-items center 추가

* fix(Drawer): DrawerHeader 스타일 조정

align-items center 추가

* fix(TravelogueCard): 카드 디자인 시안 변경

1. CardHeader가 밑으로 가도록 변경

2. Layout의 animation 제거 후 border 관련 스타일 추가

* fix(TravelPlansTabContent): name을 placeName으로 변경

* fix: ROUTE_PATHS 수정

1. travelPlans 추가

2. travelPlansRegister의 url endpoint 변경

* refactor(TravelPlansTabContent): stylelint 적용

* refactor(TravelogueDetailPage): 불필요한 import 제거

* test(MultiImageUpload): storybook 오류 수정

* test(ThumbnailUpload): ThumbnailUpload 스토리북 수정

* refactor(MainPage): stylelint 적용

* fix(TravelPlansDetail): 여행 계획 api 오류 수정

1. headers 추가(Authorization)

2. queryKey 변경

3. useGetTravelPlan 분리

* fix(Header): 헤더 관련 오류 수정

1. 로그인 내 click 액션 시 로그인 페이지로 이동하도록 수정

2. access token 결과에 따라 로그인/로그아웃 분기 처리하도록 변경

3. HeaderTitle 컴포넌트 제거

* chore: type 관련 import sort 추가

* fix: TravelPlanRegisterPage navigate url 수정

* feat(asset): svg-icons.json 내 asset 추가

* feat: MainPage 내 FloatingButton 추가

* refactor(useGetTravelPlan): queryFn 형태 변경

* fix(TravelogueDetailPage): margin-top 변경

* fix(TransformBottomSheet): text-align center 변경

* refactor: declare file 관리

1. 불필요한 emotion.d.ts 파일 제거

2. style.d.ts에 모든 declare type 추가

* chore: context path alias 설정 추가

* chore: jest 내 moduleNameMapper 수정

* refactor(AvatarCircle): userAvatar props 변경

profileImageUrl로 변경

* test(AvatarCircle): argTypes(userAvatar)를 profileImageUrl로 변경

* refactor: App 내 Context들 UserProvider로 분리

* refactor: useUser hook 분리

* style: 불필요한 파일 제거

* fix(Header): 로그인 화면에서 뒤로가기 아이콘의 색이 잘못된 이슈 해결

* refactor(TravelPlansDetailPage): Context import 경로 및 네이밍 변경

* refactor(Container): stylelint 적용

* refactor(MainPage): TravelogueCard 컴포넌트 내 key prop 추가

* fix(LoginPage): 뚜리 이미지가 배포 환경에서 보이지 않는 문제 해결

webp에서 gif 파일로 변경

* refactor(KakaoCallbackPage): UseSetUseContext import 경로 및 네이밍 변경

* refactor(TravelogueCard): AvatarCircle prop name 변경

* refactor(TravelPlansDetail): stylelint 적용

* refactor(PlaceDetailCard): 이미지가 1개 일때 캐러셀이 아닌 일반 이미지를 보여주도록 변경

* refactor(TravelogueDetailPage): TitleContainer 스타일 변경

* refactor(TravelogueDetailPage): font title이 아닌 subtitle로 변경

* feat: favicon 추가

* chore: storybook path alias 추가(contexts)

* chore: 변경사항 반영

* refactor: queries 디렉터리 구조 변경

* chore: 불필요한 console.log 제거

* refactor(useImageUpload): 해당 hook 제거

local state로 관리하는 것이 아닌 서버로 부터 받은 url을 컴포넌트에 주입하는 방식으로 변경

* refactor(TravelogueDetailPage): 리액트 쿼리 hook 로직 분리

useGetTravelogue로 분리

---------

Co-authored-by: choi river <[email protected]>
Co-authored-by: simorimi <[email protected]>

* chore: chromatic 배포 yml 파일 추가 (#117)

* [Feature] - CI 설정 (#66)

* fix: __tests__ 내 jest 타입 에러 해결

* chore: styled 파일 내 stylelint 적용

* chore: 프론트엔드 ci 설정 github actions 추가

* chore: jest-junit 의존성 추가

* chore: jest.config.js 내 reporters 옵션 추가

* chore: ci 스크립트 내 check 코멘트 추가

* feat: 통과 하는 테스트 추가

* test: 예제 테스트 제거

* chore: jest 설정 내 --passWithNoTests config 추가

* [Feature] - 3주차 스프린트 리팩토링 (#145)

* feat: 아코디언 toggle trigger부분을 확장

* feat: FloatingButton이 가려지지 않게 z-index 추가

* feat: description에 포함된 개행 문자 적용되도록 수정

* feat: tab 컴포넌트에서 3일 이상인 경우 마지막 tab은 반만 보이도록 구현

* fix: 이미지와 컨테이너 border가 각각 보이는 부분 수정

* chore: yarn.lock 업데이트

* fix: ci 에러 해결 (#150)

install --frozen-lockfile 제거

* [Feature] - sentry 세팅하기 (#168)

* chore: sentry/react 설치

* feat: ApiError 객체 구현

* feat: sentry 초기 설정

* fix: 잘못된 name 수정

* fix: 존재하지 않는 함수 import 수정

* [Feature] - 2차 스프린트 리팩토링 (#164)

* refactor(useGetTravelogue): queryFn 수정

* chore: datepicker 추가에 따른 변경

* fix(globalStyle): 모바일 환경에서 주소창이 전체 화면 크기에 포함되는 문제 해결

* refactor(Header): 불 필요한 z-index 제거

* fix(ModalBottomSheet): useBottomSheet 분리 및 모바일 환경에서 작동하도록 수정

* refactor: z-index 추가

* refactor(useBottomSheet): 상수화

* [Feature] - 전환 기능 구현 (#146)

* fix(useGetTravelogue): merge 과정에서 queryFn 사라진 오류 수정

* fix(App): 사용자 정보를 제대로 받지 못하는 오류 수정

App 이외 다른 페이지에서 유저 정보를 받아오지 못하는 오류 해결

* fix(useGetTravelogue): 반환하는 데이터 형태가 달라 런타임 에러 발생 해결

data return 형태 변경

* refactor(Header): useContext로 유저 정보를 받는 것이 아닌 useUser hook을 사용하도록 변경

* feat: 여행기 - 여행 계획 변환 기능 구현

1. TravelogueProvider 구현

2. App 내 TravelogueProvider 추가

3. TransformBottomSheet 내 onTransform prop 추가

4. TravelogueDetailPage 내 onTransform 로직 추가

5. TravelPlanRegisterPage 내 travelogue 데이터 추가

6. useTravelDays 내 days 파라미터로 받도록 변경

* feat: 여행계획 - 여행기 전환 기능 구현

* refactor: 여행 계획 - 여행기 변환 시 공통되는 부분을 TransformDetail로 통일

* refactor: 여행 계획 변환 시 title 제거

변환 시 title이 없도록 변경

* refactor(TravelogueProvider): import 내 type 추가

* refactor: import 내 type 추가

* refactor(TravelPlanDetailPage): 컴포넌트 명 및 디렉터리 변경

1. TravelPlansDetail에서 travelPlanDetail로 디렉터리 변경

2. TravelPlanDetailPage로 컴포넌트 네이밍 변경

3. 변경 사항 다른 컴포넌트들에 반영

* refactor(TravelTransformDetailProvider): 여행 전환 정보 데이터를 TravelTransformDetail로 변경

1. type을 TravelTransformPlaces와 TravelTransformDetail로 변경

2. TravelTransformDetailProvider로 네이밍 변경

* refactor: travelogue 타입 파일 내에서 travelTransform으로 분리

1. TravelTransformPlaces와 TravelTransformDetail 타입 파일 분리

2. 변경 사항 적용

* chore: utils path alias 추가

* refactor: onTransformTravelDetail context hook 내부로 이동

* [Feature] - 인가 처리 추가 (#176)

* refactor(ApiError): Error 스택트레이스 수정

AxiosError가 아닌 custom name이 들어가도록 변경

* feat: 전역 axios interceptor 설정 추가

1. request 전 accessToken 확인 처리 및 authorization header 내 access token 추가

2. APIError 발생 시 sentry 스택트레이서 추가

3. AxiosError가 아닌 APIError를 throw

* feat(TravelPlanRegisterPage): 여행 계획 등록 페이지 내 인가 처리 추가

액세스 토큰이 없다면 login 페이지로 redirect

* feat(TravelogueRegisterPage): 여행기 등록 페이지 내 인가 처리 추가

액세스 토큰이 없다면 login 페이지로 redirect

* refactor(main): sentry init 설정 변경

* refactor(useGetTravelPlan): accessToken 처리 로직 제거

* feat(usePostUploadImages): 이미지 업로드에 대한 인가처리 추가

* refactor(interceptor): ErrorResponse에 대한타입 추가

* feat(usePostTravelPlan): 여행 계획 추가에 대한 인가 처리 추가

* feat(usePostTravelogue): 여행기 추가에 대한 인가 처리 추가

* refactor(interceptor): import type 변경

* refactor: error response가 없는 경우에 대한 분기 처리

post query 내 cors 에러의 경우 error response가 없기 때문에 이에 대한 분기 처리 작업을 위해 union 타입으로 설정

* [Feature] - 상수화 작업 진행 (#188)

* refactor: route path 상수화 추가

1. 여행 계획, 여행기에 대한 route path 형태 변경(optional 형태로 id를 받는 함수 형태)

2. navigate 함수 내 하드 코딩 된 url 값 상수화

3. ROUTE_PATHS_MAP으로 변경

* refactor: storage key 상수화

* refactor: api endpoint 상수화

* refactor: status code 관련 map(record) constants 디렉터리로 이동

* refactor: 쿼리키 상수화

* refactor: api endpoint 내 detail 네이밍 빠진 부분 추가

* refactor: 에러 메시지 상수화

* [Feature] - 타입 구조 변경 (#191)

* refactor: 타입 구조 변경

1. travelogue, travelplan, traveltransformdetail에 대한 타입을 구분하는 것으로 변경

2. 변경 사항 적용(useTravelogueDays, useTraveloguePlanDays 분리)

3. DayContent 제거 후 TravelogueDayAccordion, TravelPlanDayAccordion각각 추가

* fix: 충돌 난 부분 수정

* refactor: DayAccordion들에 대한 interface 분리

각각 TravelPlanDayAccordionProps과 TravelPlanDayAccordionProps로 분리

* [Feature] - 여행기 무한 스크롤 관련 테스트 추가 (#166)

* refactor(prettier): queries import order 수정

* fix(jest.config.js): msw가 실행되지 않는 문제 해결

setupFilesAfterEnv 내 jest-setup.ts 추가

* test(mainPage): 여행기 무한 스크롤 테스트 로직 추가

1. 무한스크롤 관련 핸들러 추가

2. 여행기 mock 데이터 추가

3. useInfiniteTravelogue를 renderHook으로 wrapping한 hook 추가(createInfiniteTravelogueHook)

4. 테스트 로직 추가

* fix(useGetTravelogue): queryFn 변경

* [Feature] - 모달 컴포넌트 구현 (#200)

* fix: 여행 전환 후 다른 페이지에서 다시 등록 페이지로 접근 시 데이터가 남아있는 문제 해결 (#207)

페이지를 벗어나면 transformDetail를 null로 변경

* [Fix] - 등록 페이지에서 제목과 여행 장소 설명란 한글 입력시 제한 길이보다 1자 더 입력되는 문제 해결 (#210)

* fix(TravelogueRegisterPage): 한글 입력시 21자까지 입력되는 오류 해결

* fix(TravelPlanRegisterPage): 한글 입력시 21자까지 입력되는 오류 해결

* fix(useTravelogueDays): 장소 설명란 한글 입력시 301자까지 입력되는 오류 해결

* fix(useTravelPlanDays): 장소 설명란 한글 입력시 301자까지 입력되는 오류 해결

* [Feature] - Login 명세 변경 (#181)

* refactor(KakaoCallbackPage): http method를 get으로 변경

* refactor(KakaoCallbackPage): encoding된 redirect-uri params에 추가

* fix: 로그인 명세 변경

1. http method post로 변경

2. params에 추가하는 것이 아닌 url내 code 및 redirectUri 추가

* fix: ci 실패 하는 원인 수정

1. api endpoint map 내 loginOauth 수정

2. KakaoCallbackPage 내 반영

---------

Co-authored-by: simhorim <[email protected]>

* [Feature] - 메인페이지 skeleton 작업 (#221)

* feat: TravelogueCardSkeleton 컴포넌트 구현

* test: TravelogueCardSkeleton storybook 추가

* feat: 메인 페이지에 skeleton UI 추가

* feat: 스켈레톤 컴포넌트에 key 추가

* fix: styled 컴포넌트 이름 컨벤션에 맞도록 수정

* fix: styled 컴포넌트 이름 컨벤션에 맞도록 수정

* [Feature] - Drawer가 열려져있는 경우 화면 스크롤 안되도록 수정 (#222)

* feat: Drawer가 열려져있는 경우 화면 스크롤 안되도록 수정

* refactor: Drawer에서 DrawerProvider를 contexts로 분리

* refactor: useModalControl 훅을 이용하여 리팩토링

* [Feature] - user 컨텍스트에 access token만 담도록 수정 & 로그인/로그아웃 버튼 수정 (#224)

* feat: useUserProfile 훅 구현

Co-Authored-By: eunjungL <[email protected]>

* refactor: UserProvider에 accessToken만 저장하도록 수정

* feat: 카카오 로그인시 accessToken만 로컬스토리지에 저장하도록 수정

* fix: Header의 Drawer에 로그인/로그아웃 버튼 변하도록 수정

* feat: 로그아웃 구현

---------

Co-authored-by: eunjungL <[email protected]>

* [Feature] - 여행 계획 등록 기능 변경 & 테스트 추가 (#225)

* chore: react-datepick 라이브러리 제거

* feat: useCalendar hook 구현

* feat: useClickAway hook 구현

* feat: Calendar 컴포넌트 구현

* test: 캘린더 컴포넌트 스토리북 추가

* feat(TravelPlanRegisterPage): 캘린더 컴포넌트 페이지 내 연결

* fix: 여행 계획 및 여행기 아코디언을 연 상태에서 삭제 시 마음대로 열리고 닫히는 문제 수정

value가 배열 index로 되어있어 삭제 할 때 인덱스 값이 수정되어 발생했던 문제이므로 place 및 day를 추가할 때 uuid를 id로 하여 추가하도록 변경

* refactor(useTravelPlanDays): onChangePlaceDescription 함수 파라미터 변경

event를 받는 것이 아닌 description을 받도록 변경

* test(travelPlanRegisterPage): 여행 계획 등록 페이지 테스트 구현

1. 여행 계획 등록 msw 핸들러 추가

2. usePostTravelPlan를 wrapping한 createTravelPlanRegisterHook 추가

3. 여행 계획 등록 페이지 테스트 코드 구현

* refactor: px단위 rem으로 변경

* refactor: StartDate를 StartDateLabel로 네이밍 수정

* [Feature] - 여행 공유하기 기능 구현 (#226)

* feat: 개발 환경에서 browser 모킹 가능하도록 설정

* feat: travelPlan mock 데이터 추가

* chore: prettier import 순서 추가(contexts, utils)

* refactor: url에서 id 분리하는 유틸함수 추가

* refactor: 여행기, 여행 계획 endpoint 내 id type을 string으로 변경

* feat: uuid 검증 함수 및 정규 표현식 추가

* feat: 테스트 환경/브라우저 환경 구분하기 위한 변수 추가

* refactor(travelogueInfinteHandler): 환경에 따라 request url 다르게 설정하도록 변경

* feat: 여행 계획 mock 핸들러 추가

* refactor(travelPlan.json): 여행 계획 데이터 내 shareKey 추가

* refactor(travelPlanHandler): 404 httpResponse statusText 변경

* refactor(usePostTravelPlan): mutationFn variable type 수정

shareKey를 뺀 타입인 TravelPlanPayload 타입 추가

* feat(asset): icon 추가

* feat(ShareModal): 공유 모달 구현

* feat: url 복사를 위한 함수 구현

copyLinkToClipboard 구현

* refactor(ROUTE_PATHS_MAP): travelogue 및 travelPlan의 id variable 타입 변경

uuid와 id 모두 받을 수 있도록 타입 변경

* refactor(colors): green 컬러 theme 내 추가

toast 구현을 위한 green 컬러 PRIMITIVE_COLORS 내 추가

* feat: Toast 컴포넌트 구현

* test: Toast 컴포넌트 스토리북 추가

* refactor(Input): forwardRef 추가

input 내 ref를 추가하기 위해 컴포넌트 내 forwardRef wrapping

* feat(main): main.tsx 내 ToastProvider 추가

* feat: 공유하기 기능 구현

1. ShareModal 내 복사 시 toast 추가

2. endpoint 추가 및 변경

3. TravelPlanPage 내 shareModal 연결 및 icon button(공유, 더보기) 추가

* test(Modal): 복사하기 기능 Modal 컴포넌트 내 추가

* refactor(Toast): gap 내 spacing 적용

* refactor(endpoint): 여행 계획 상세 및 공유된 여행 계획 상세 prefix(/) 추가

* refactor: extractId 함수 개선

* [Feature] - �여행 계획 & 여행기 삭제 기능 구현 (#229)

* feat(Dropdown): 컴포넌트 구현

* test(Dropdown): 스토리북 테스트 구현

* feat(svg-icons): 데이터 추가

* feat(useDeleteTravelogue): mutation 훅 구현

* feat(useDeleteTravelPlan): mutation 훅 구현

* feat(TravelogueDeleteModal): 컴포넌트 구현

* feat(TravelPlanDeleteModal): 컴포넌트 구현

* feat(TravelogueDetailPage): Text 컴포넌트로 수정 및 불필요한 css 제거, Dropdown 기능 추가

* feat(TravelPlanDetailPage): Dropdown 기능 추가

* refactor(Button): 개행 수정

* refactor(Dropdown): 스토리북 수정

* refactor(Dropdown): 의미의 명확성을 위해 css 값으로 변경

* refactor(Dropdown): import type으로 수정

* refactor(index): Dropdown, Modal index에서 호출하도록 수정

* refactor(TravelogueDetailPage): style 속성을 css로 일관성 있게 변경, spacing 추가 및 의미의 명확성을 위한 isOpen 밖에서 보이도록 수정

* refactor(TravelPlanDetailPage): style 속성을 css로 일관성 있게 변경, spacing 추가 및 의미의 명확성을 위한 isOpen 밖에서 보이도록 수정

* refactor(TravelogueDeleteModal): style 속성을 css로 일관성 있게 변경

* refactor(TravelPlanDeleteModal): style 속성을 css로 일관성 있게 변경

* refactor: title과 subtitle이 바뀌어있는 부분 수정

---------

Co-authored-by: 손진영 <[email protected]>

* [Feature] - 마이 페이지 구현 (#236)

* feat: Tab 컴포넌트에 새로고침해도 선택된 tab 그대로이도록 수정

* feat: AvatarCircle에 medium 사이즈 추가

* test: AvatarCircle의 medium 사이즈 storybook 추가

* feat: 마이페이지 route 설정

* feat: Header Drawer에 마이페이지 route 처리

* feat: 마이페이지 tab content에서 사용될 TabContent 컴포넌트 구현

* fix: Tab 컴포넌트 unmount 될 때 선택된 탭이 첫번째 탭이 되도록 수정

* style: 필요없는 주석 삭제

* refactor: Tab 컴포넌트에 새로고침할 때 처음 버튼으로 돌아갔다가 최근껄로 보이는거 수정

* feat: useInfiniteMyTravelPlans 구현

* fix: renderItem type 수정

* feat: 날짜 문자열에 숫자로 일수 더해주는 util 함수 구현

* fix: TravelPlanDetail 페이지를 useGetTravelPlan 반환 타입에 맞춰 수정

* feat:  MyTravelPlans 컴포넌트 구현

* feat: MyTravelogues 컴포넌트 구현

* feat: 마이 페이지 구현

* fix: 쓰지 않는 변수들 삭제

* fix: type 이름 수정

* fix: 여행기 등록페이지에서 type 맞춰서 수정

* refactor: Tab 컴포넌트 상수 분리

* refactor: state 초기값을 localStorage에서 가져오도록 수정

* style: border css 순서 수정

* style: 색상 코드 하드코딩 대신 디자인 토큰값 사용

* refactor: MyPage에서 필요없는 useEffect 제거

* style: font-weight값 수정

* style: 긴 css를 styled.ts로 분리

* refactor: TabContent 컴포넌트 이름을 MyPageTapContent로 수정

* refactor: MyTravelogue 타입을 types폴더로 이동

* refactor: MyPageTabContent의 props명 수정

* refactor: queries에서 try catch 제거

* refactor: data 평탄화를 select로 리팩토링

* fix: useGetTravelPlan에서 id string만 받도록 수정

---------

Co-authored-by: 손진영 <[email protected]>

* [Fix] - 3차 스프린트 QA 반영(리버)  (#255)

* feat: 여행 계획 상세 페이지 내에서 로그아웃 했을 때, 로그인 페이지로 이동할 수 있도록 수정

* fix: Tab 컴포넌트가 마운트될 때 로컬스토리지의 selected index로 값 초기화 안되던 이슈 수정

* fix: 여행계획 상세페이지, 마이페이지에서 로그아웃 할 시, 로그인 페이지로 이동하도록 수정

* style: Drawer의 z-index가 transformbottomsheet보다 높도록 수정

* fix: 여행기,여행계획 삭제에 무효화 추가, 여행기 작성에 무효화 추가

* fix: 메인 페이지에서 여행기 작성자들 프로필 이미지 보이도록 수정

* style: zIndex 디자인 토큰 추가 및 적용

* feat: Spinner 컴포넌트 구현

- Icon 컴포넌트를 사용하려했으나, Icon 컴포넌트 사용시 뚜리 눈이 사라지는 이슈가있어서 사용하지 않았습니다

* test: Spinner storybook 추가

* feat: LoginFallback 컴포넌트 구현 및 적용

* test: LoginFallback storybook 추가

* feat: 여행 계획 상세 페이지에 날짜 정보 추가

* fix: Tab 컴포넌트에 day가 3개일 때 탭버튼 가로 넓이 잘못 설정되는거 수정

* fix: api 명세 수정에 따라서 수정

* style: drawerOverlay 따로 추가

* [Fix] - 3차 스프린트 QA 반영(지니)  (#256)

* fix(TravelPlanDetailPage): 공유 url 접근에 대한 더보기 버튼 분기 처리 추가

* fix(TravelogueDetailPage): 런타임 에러 발생 해결

TravelogueTabContent 내 places에 옵셔널 체이닝 추가

* fix(TravelPlanRegisterPage): 아무것도 입력하지 않고 등록을 눌렀을 때 아무 것도 처리되지 않는 문제 해결

startDate가 없을 경우 빈 문자열로 request 날리도록 변경

* fix(TravelPlanRegisterPage): handleAddTravelPlan를 mutate가 아닌 mutateAsync로 변경

mutateAsync로 인해 런타임 에러 발생하는 부분 해결

* fix(MyPage): 로그인 없이 마이페이지로 접근할 경우 2번 alert가 발생하는 문제 해결

* fix(TravelogueDetailPage): 여행기 상세 페이지 내 작성자 및 작성 일자 추가

* fix(TravelogueRegisterPage): TravelogueDayAccordion 내 key를 id 값으로 변경

* feat: 여행기 상세페이지 내 스켈레톤 추가

1. GoogleMapLoadScript에서 loadingElement를 props로 받도록 변경

2. Skeleton 컴포넌트 구현

3. 여행기 상세 스켈레톤 컴포넌트 구현

4. 여행기 상세 페이지에 스켈레톤 반영

* refactor(Skeleton): 스타일 파일 분리

* feat: 여행 계획 페이지 내 스켈레톤 ui 추가

* feat: 마이페이지 내 스켈레톤 ui 적용

* fix: 여행기 & 여행 계획 등록 페이지 내 구글 검색 ui loading 개선

* fix(TravelPlanDetailPage): 여행 계획 상세 페이지 내 작성자가 아닐 경우 뒤로 가도록 처리

* fix(TravelPlanDetailPage): 런타임 에러 해결

옵셔널 체이닝 추가

* fix(interceptor): 만료된 토큰에 대한 처리 추가

* refactor: 아코디언의 기본 상태가 열려있도록 변경

* fix(interceptor): access token 없을 시 인증 헤더에 빈 값을 보내도록 변경

* [Feature] - sentry 초기 설정 변경 & 소스맵 설정 추가 (#261)

* chore(main): dev 환경에서만 sentry가 동작하도록 변경

* chore: @sentry/webpack-plugin 의존성 추가

* chore: webpack 설정 파일 내 sourcemap 관련 설정 추가

* [Fix] - 3차 스프린트 QA 반영(시모)  (#262)

* refactor(FloatingButton): 불 필요한 버튼들 제거

* refactor(Dropdown): dropdown 외부 클릭시 닫치도록 수정

* refactor(travelogue): 타입 수정

* refactor(user): 글 작성자인지 파악하기위해서 memberId 를 전역으로 관리하도록 수정

* fix: 삭제시 쿼리 캐싱 최신화되지 않는 문제, error 객체 그대로 반환하는 문제, 그리고 navigation route 수정

* fix: 삭제시 쿼리 캐싱 최신화되지 않는 문제 해결

* fix(TravelogueDetailPage): ci 문제 해결

---------

Co-authored-by: 손진영 <[email protected]>

* [Feature] - 배포한 서비스를 모니터링 하는 도구 GA 세팅  (#263)

* chore: react-ga4 설치

* feat(main): ga4 init

* chore: 전환 버튼 클릭 시 이벤트 집계하도록 설정

---------

Co-authored-by: 손진영 <[email protected]>

* [Fix] - 한 Day 내 중복된 장소 이름이 존재할 경우 게시물이 지속적으로 생기는 문제 해결 (#266)

* fix(TravePlansTabContent): 한 Day 내 중복된 장소 이름이 존재할 경우 게시물이 지속적으로 생기는 문제 해결

중복된 key로 인해 발생했던 문제이므로 고유한 값인 id로 변경

* fix: 잘못된 key prop 해결

1. calendar의 key를 index가 아닌 date 값으로 변경

2. CarouselImageItem의 key를 imageUrl로 변경

3. TravelogueTabContent의 key를 place id로 변경

* [Fix] - 3차 스프린트 QA 반영 2차 (리버)  (#276)

* style: 프로필 이미지 납작하게 보이던것 수정

* style: Drawer에서 클릭되지 않는 부분에 마우스 커서 pointer이던것 수정

* feat: Drawer에 메인 페이지로 이동하는 홈 버튼 추가

* [Fix] - 3차 스프린트 QA 반영 2차 (시모) (#275)

* fix: 삭제 이후 마이 페이지로 돌아왔을 때 캐시 최신화 되지않는 문제 해결

* fix(useGetTravelogue): retry 3회로 지연되는 현상 해결

* fix: 존재하지 않는 상세 조회시 alert 띄우고 페이지 뒤로 이동하도록 수정

* refactor(TransformBottomSheet): IconButton으로 수정, 불 필요한 css 제거 및 up-arrow layout에 붙은 문제 해결

* [Fix] - 3차 스프린트 QA 반영 2차 (지니) (#280)

* fix: 크롬 브라우저 환경에서 캘린더 밑줄 보이는 문제 해결

meta tag 추가

* fix(TravelPlansTabContent): 여행 상세 페이지 내 마지막 요소가 바텀 시트로 인해 보여지지 않는 문제 해결

* refactor(TravelPlansTabContent): 여행 계획 내 description 추가

* fix(TravelogueMultiImageUpload): 장소 별 사진 10장 이하로 업로드 가능하도록 변경

* refactor(GoogleMapView): 마커 내 순서 표시 텍스트 추가

* fix(Calendar): key prop 변경

* refactor(TravelPlanRegisterPage): 주석 처리 된 부분 수정

* refactor: 마커 색상 변경 & 여행기 상세 페이지 title & subtitle 순서 변경 (#283)

* refactor: 마커 색상 변경

* refactor(TravelogueDetailPage): 여행기 상세 페이지 title, subtitle 수정

* [Fix] - 만료된 access token 핸들링 (#292)

* fix(interceptor): 만료 토큰 에러 시 early return 하여 error를 throw 하지 않도록 변경

* fix: onSuccess callback 내에서 구조 분해 할당을 하지 않도록 변경

* refactor: 수정 ui 제거

* [Fix] - 삭제 및 등록 시 여러번 요청하지 못하게 수정 (#295)

* feat(useLeadingDebounce): 선행 디바운드 훅 구현

* fix: 삭제 반복 요청하지 않도록 수정

* fix: 등록 반복 요청하지 않도록 수정

* refactor(useLeadingDebounce): 렌더링과 무관하기에 useState 에서 useRef로 수정

* [Feature] - refresh token 클라이언트 내 적용 (#307)

* feat: 리프레시 토큰 추가

1. 로그아웃 시 refresh token empty string으로 변경

2. 로그인 시 refresh token localstorage 내 추가

3. AuthTokenResponse 내 refreshToken 추가

* feat: 리프레시 토큰 클라이언트 내 적용

1. handleAPIError 내 401 에러 시 access token 재발급 로직 추가

2. 리프레시 토큰 만료 시 logout 로직 추가

* [Feature] - TravelogueCard 컴포넌트 리팩터링 (#314)

* refactor(svg-icons): empty-heart 아이콘 변경

* refactor: travelogue mock data 수정

* refactor(travelogue): TravelogueRepsonse 타입 변경

현재 명세에 맞게 변경

* test(TravelogueCard): likes 필드를 likeCount로 변경

* refactor: TravelogueCard ui 형태 리팩터링

* refactor: 여행기 mock data 추가

* refactor: TravelogueOverview 타입 제거

TravelogueResponse 타입을 Pick 하는 형태로 변경

* [Feature] - Input 컴포넌트 리팩토링 (#310)

* feat: Input 컴포넌트에 variants 추가

- border bottom이 있는 input 추가
- focus 했을 때만 border bottom이 생기는 input 추가

* test: 추가된 Input storybook 추가

* fix: 안쓰는 import문 삭제

* refactor: InputVariants type 수정

* Fix - image error 처리 누락, 여행기 삭제시 마이페이지로 넘어갈 때 tab 초기값 수정 , 여행기 썸네일 (#296)

* fix: PlaceDetailCard에서 이미지 에러 핸들링 추가

* test: PlaceDetailCard storybook 추가

* fix: 여행기 상세 조회 썸네일 가운데가 아니라 위쪽 보이는 이슈 수정

* fix: 내 여행기 삭제 후 마이페이지 이동시, tab이 내 여행기로 가있도록 수정

* [Fix] - Icon, Icon Button storybook에서 iconType option 적용되도록 수정 (#327)

* test: Icon storybook iconType option 적용되도록 수정

* test: IconButton storybook iconType option 적용되도록 수정

* [Feature] - 여행 계획 TO DO 기능 구현 (#333)

* feat: asset 추가(check)

* feat: Checkbox 컴포넌트 구현

* test(Checkbox): 스토리북 추가

* refactor(Input): label과 count가 있을 경우 컴포넌트를 렌더링하도록 변경

* test: Input 컴포넌트 변경으로 인한 Calendar & Modal 컴포넌트 스토리북 업데이트

* feat: PlaceTodoListItem 컴포넌트 구현

* test: PlaceTodoListItem 스토리북 추가

* refactor(Input): Input 스타일링 변경

* refactor(travelPlan): TravelPlanPlace 타입 명세 변경

1. todos 필드 추가

2. TravelPlanTodo 인터페이스 추가

* refactor(travelPlan): TravelPlanTodo id 명세 변경

* refactor(TravelPlanRegisterPage): description이 아닌 todo를 추가 및 삭제하도록 변경

* refactor(travelPlan): TravelPlanPlace 내 description 필드 제거

* refactor: 여행 계획 mock 데이터 변경된 명세에 맞게 수정

* refactor(Checkbox): checked가 아닌 defaultChecked로 변경

브라우저 warning으로 인한 defaultChecked로 변경

* refactor(endpoint): todo patch 요청 관련 endpoint 추가

* test: 공유 링크로 접속한 여행 계획 msw handler 추가

* test: 여행 계획 상세 msw 핸들러 변경

uuid 확인하는 로직 제거

* test: 여행 계획 todo patch 요청 msw 핸들러 추가

* feat(usePatchTravelPlanTodo): 여행 계획 todo patch 요청 관련 query 구현

* feat: TravelPlanTodoItem 컴포넌트 구현

* refactor(TravelPlansTabContent): description text가 아닌 todo list들이 보여지도록 변경

* refactor(useTravelPlanDays): onAddPlaceTodo 내 논리 or 연산자가 아닌 널 병합 연산자로 변경

* test(travelPlanRegisterPage): 여행 등록 페이지 테스트 내 장소 설명 변경 test 제거

* fix(TravelPlanTodoItem): 현재 사용자가 action을 일으킨 상태로 request 날리도록 변경

* fix: ci 문제 해결

checkbox index.ts 내 default export 추가

* refactor(TravelPlanTodoItem): gap에 spacing 적용

* refactor(PlaceTodoItem): Wrapper가 아닌 Container로 변경

여러 요소를 감싸고 있기 때문에 컨벤션에 따라 변경

* refactor: 불필요한 console.log 제거

* refactor(Checkbox): checked, defaultChecked를 외부에서 주입 받도록 변경

제어 컴포넌트, 비제어 컴포넌트 모두 사용 가능하다고 판단되어 다음과 같이 변경

* [Feature] - tag 기능 구현 (#335)

* refactor(TravelogueCard): layout css 수정

* refactor(Text): bodyBold, detailBold 추가

* feat(Chip): 컴포넌트 구현

* test(Chip): 스토리북 구현

* refactor(Chip): isSelected 초기값 설정 및 optional로 수정

* feat(travelogue): tag type 추가

* feat(TravelogueDetailPage): 테그 UI 구현

* feat(TravelogueCart): tag UI 추가

* refactor(Chip): button 에서 li로 변경

* refactor(useDragScroll): 재사용성을 높이기위하여 li로 변경 후 적용

* feat(index): Chip 추가

* refactor: chips ul로 변경

* feat(tags): tags endpoint 및 queryKey 추가

* feat(useGetTags): tags type 추가 및 getTags 구현

* feat(TravelogueRegisterPage): 태그 UI 및 기능 구현

* feat(TravelogueRegisterPage): 태그 UI 넘어가는 화면 끝까지 닿도록 수정 및 태그 선택 3개까지만 하도록 수정

* refactor(Tab): no-wrap은 없는 속성이라 nowrap으로 수정

* feat(useInfiniteTravelogues): 필터링 기능 추가

* feat(travelogue): 태그 추가에 따른 mock data 및 handler 수정

* feat(MainPage): 태그 필터링 기능 구현

* refactor(createInfiniteTravelogueHook): 파라미터 수정

* refactor(chip): 스토리북 options 추가

* refactor(Chip): line-height 추가

* refactor(MultiImageUpload): div로 수정

* refactor: chips를 chipsContainer로 수정

* feat(queryKey): travelogue.tag 추가

* refactor(useDragScroll): 타입 유연성을 위해 제네릭으로 수정

* feat(condition): condition 상수화

* refactor(useInfiniteTravelogues): 상수 외부로 이동 및 queryKey 상수화 활용

* refactor: useDragScroll 제네릭 수정에 따른 변경

* refactor(TravelPlanRegisterPage): 상수화에 따른 수정

* refactor(MainPage): 상수화 활용, useDragScroll 제네릭 적용 및 chipsContainer로 변경

* feat(useTagSelection): 훅 구현 및 적용

* refactor(formValidation): condition 네이밍 수정

* [Feature] - 여행기 장소 이미지 업로드 중일 경우, spinner를 보여주도록 리팩터링 (#332)

* refactor(Spinner): Spinner 컴포넌트 내 variants 및 size option 추가

circle spinner 및 확장성을 위해 해당 option들 추가

* test: Spinner 컴포넌트 스토리북 추가

* refactor(MultiImageUpload): 해당 컴포넌트 내 image upload 중일 시 loading ui를 보여줄 수 있도록 컴포넌트 리팩터링

* test(MultiImageUpload): 컴포넌트 변경점에 따른 스토리북 변경

* refactor: 불필요한 console.log 제거

* fix(MultiImageUpload): x 버튼이 짤려서 보이는 문제 수정

* fix(TravelogueMultiImageUpload): 같은 image를 여러 번 업로드 시 업로드가 되지 않는 문제 해결

fileInputRef를 초기화 하도록 변경

* refactor(TravelogueMultiImageUpload): 최대 이미지 업로드 갯수 상수화 및 핸들러 함수 네이밍 수정

* refactor(TravelogueMultiImageUpload): newImgUrls를 newImageUrls로 변경

다른 변수들에서 image로 사용하고 있는 만큼 img가 아닌 image로 일관성을 보장하기 위해 다음과 같이 변경

* refactor(TravelogueMultiImageUpload): props interface 분리

* refactor(TravelogueMultiImageUpload): 내부 로직 hook으로 분리

* refactor: imageStates에 lazy 초기화 적용

* [Feature] - 사용자 닉네임 수정 (#317)

* feat: 닉네임 수정 msw 추가

* feat: 닉네임수정 hook 구현

* fix : 닉네임 수정 api 명세에 맞춰서 msw,query,endpoint 수정

* fix: 닉네임 수정 hook에서 refetchType 수정

* feat : 마이 페이지에 프로필 수정 기능 추가

* style: 글씨 색상 theme color로 수정

* fix: 함수명을 파일명과 동일하게 수정

* fix: refetchType 삭제

- 없애도 잘되기에 삭제함

* fix: console.log를 alert로 수정

* fix : ref 사용, 닉네임을 다 지우고 수정 시도할 경우 원래 닉네임으로 되도록가도록 수정

Co-authored-by: jinyoung <[email protected]>

* chore: 사용되지 않는 styled 삭제

* fix : 빈 칸으로 수정 시도할 경우 원래 닉네임으로 되돌아가도록 수정

* fix: 닉네임 수정시 깜빡이며 렌더링 되는것 수정, spellcheck false로 설정

---------

Co-authored-by: jinyoung <[email protected]>

* [Feature] - 검색 구현 (#328)

* feat: 여행기 검색 무한스크롤 query 구현

* chore: 검색 아이콘 추가

* feat: 헤더에 검색 추가

* feat: SearchFallback 컴포넌트 추가

* feat: 검색 결과 페이지 구현

* feat: 검색 페이지 라우트 추가

* feat: home icon 추가

* refactor: Header 컴포넌트를 기본 Header의 basic으로 사용할 수 있도록 리팩토링

* feat: HomeHeader 구현

* feat: LogoHeader 구현

* feat: NavigationHeader 구현

* feat: SearchHeader 구현

* fix: storybook preview rootStyle이 common/Header에는 다르게 적용되도록 수정

- rootStyle에 들어가있는 padding 때문에 Header storybook에서 컴포넌트가 padding만큼 밀리는 이슈가있어서 common/Header일때는 padding이 0이 되도록 수정함

* test: Header storybook 추가

* feat: AppLayout에서 Header를 동적으로 추가

* refactor: HomeHeader -> HomePageHeader로 이름 수정

* refactor: 스타일드 컴포넌트 이름 수정 (wrapper -> container)

* refactor: Header Props명 수정

* refactor: 검색어 최소 글자수 상수화

* refactor: AppLayout에서 pathname 확인 부분 상수 사용

* refactor: h1 태그 대신 Text 컴포넌트를 사용해서 리팩토링

* refactor: gap 값에 theme spacing을 사용

* refactor: gap 값에 theme spacing 사용

* chore: 코드 사이에 개행 추가

* chore: 개행추가

* refactor: Icon 대신 IconButton을 사용

* refactor: #fff 대신 primitive white 사용

* chore: 빈 파일 삭제

* refactor: dom으로 직접 접근하는 부분 ref를 사용하도록 수정

* fix: 검색어에 trim 추가 및  useInfiniteSearchTravelogues 가 keyword가 빈값이 아닐때만 요청되도록 수정

* refactor: NavigationHeader -> SearchResultPageHeader로 이름 수정

* fix: Header 이름 수정 꼬인것 수정

* refactor: Header 관련 컴포넌트 인덱싱

* fix: 검색 페이지에서 뒤로가기 누를 때, query는 그전 검색어지만 Input value는 그전 검색어가 아니던 이슈 수정

* storybook: styled의 Input이 아닌 진짜 Input.tsx 사용하도록 수정

- 로컬 환경에서는 문제없이 잘 렌더링되나, storybook에서는 값을 넣지 않은 label,maxcount,count div까지 만드는 이슈가있습니다.
- 일단 style로 marginbottom에 음수를 줘서 가운데정렬된거처럼 보이게 수정은해놨습니다

* fix: build 에러 잡음

* [Feature] - 여행기 상세보기 페이지에서 지도 상세보기 구현 (#334)

* feat: 지도 아이콘 추가

* style: Box 높이 수정

* feat: 지도 아이콘 버튼을 누르면 구글맵 사이트로 이동하도록 구현

- place 데이터 안에 구글맵 placeId가 없어 일단 lat,lng,placeName으로 구현(정확한 결과 나오지 않는것도 있음)

* fix: Box 컴포넌트에서 tag 삭제

- Box에서 tag 안쓰기로해서 삭제함

* chore: 필요없는 태그 삭제

* fix: build 에러 잡기

* [Feature] - 여행기 좋아요 기능 구현 (#342)

* feat: asset(heart) 추가

* refactor(TravelogueDetailPage): 좋아요 디자인 수정

1. flex-end가 아닌 space-between으로 변경

2. gap 8px로 변경

* feat: 좋아요 관련 msw 핸들러 추가

* feat: 여행기 상세 조회 msw 핸들러 추가

* refactor: 여행기 mock 데이터 변경

isLiked 및 likeCount 추가

* refactor: 메인 페이지 여행기 핸들러 변경

request 객체 없을 경우 예외 처리 추가

* refactor(travelogue): TraveloguePayload 및 TravelogueResponse 타입 변경

1. TraveloguePayload을 Omit이 아닌 Pick으로 변경

2. TravelogueResponse 타입 내 likeCount 및 isLiked 추가

* feat(endpoint): 여행기 좋아요 endpoint 추가

* feat: 여행기 active 및 inactive 관련 query 추가

* feat(TravelogueDetailPage): 여행기 좋아요 기능 구현

* refactor(TravelogueDetailPage): 여행기를 등록한 사람만 좋아요를 토글할 수 있도록 수정

* refactor(svg-icons): heart, empty-heart에 대한 path 변경

* refactor(asset): 좋아요 svg 변경

* refactor(Icon): icon viewBox를 size로 받도록 변경

* refactor: 좋아요 icon button 사이즈 16으로 변경

* refactor: 좋아요 쿼리 관련 refetch type all로 변경

* refactor(useGetTravelogue): access token이 스토리지에 있을 경우 예외적으로 인증 헤더 추가 하도록 변경

백엔드 측에서 인증 헤더 없이는 유저 좋아요 여부를 확인하기 어렵다고 하셔서 다음과 같이 변경

* refactor(TravelogueDetailPage): 로그인 한 경우 무조건 좋아요를 할 수 있도록 변경

* refactor(Icon): viewbox를 다시 svg-icons의 width, height로 설정하도록 변경

* refactor: query 내 refetchType 없애는 걸로 변경

상세 페이지만 refetch 하도록 변경

* [Feature] - 썸네일 에러 발생 시 예외 처리 추가 (#356)

* refactor(TravelogueRegisterPage): 썸네일 에러 발생 시 예외 처리 추가

* refactor: api endpoint 원래대로 변경

* [�Feature] - 여행기 및 여행 계획 수정 페이지 구현 (#348)

* refactor(ModalBottomSheet): 수정페이지에서도 사용하도록 props 유연하게 수정

* feat(route): 수정 페이지 route 추가

* refactor(RegisterPage): modalBottomSheet props 수정에 따른 리팩토링

* feat(DetailPage): 수정 버튼 활성화

* feat(TravelogueEditPage): UI 구현

* feat(TravelPlanEditPage): UI 구현

* refactor(errorMessage): only writer 속성명을 구체적으로 수정

* refactor: state를 set 시키는 change 함수 구현 및 반환히도록 수정

* feat(TravelogueEditPage): 초기값 설정, 태그 ui 추가 및 타 사용자가 수정하지 못하도록 막는 기능 구현

* refactor(router): 오타 수정

* refactor(BackDrop): position fixed로 수정

* refactor(useTravelogueDays):  change 함수명 수정

* refactor(TravelPlanRegisterPage): mutate 네이밍 수정

* feat(errorMessage): errorMessage 추가

* refactor(PlaceTodoListItem): value 값 및 isChecked 값 받도록 수정

* feat(usePutTravelogue): 기능 구현

* feat(usePutTravelPlan): 기능 구현

* feat(useTravelPlanDays): onChange 함수 추가

* feat(TravelPlanEditPage): 값 초기화, put 요청 및 에러 처리 기능 구현

* refactor: useEffect 의존성 배열로 사용하여 useCallback으로 수정

* feat(debouncedTime): 상수화

* refactor(extractId): 재사용성을 위한 수정

* feat(extractUTCDate):UTC Date 추출 함수 유틸화

* refactor(travelPlan): days 타입 수정

* refactor: 불 필요한 css 제거 및 일관성을 위한 수정

* refactor: 명세 isChecked와 checked 불일치로 인한 수정

* refactor(TravelogueDetailPage): extractId 적용

* refactor: mutate 네이밍, 상수화, 유틸함수, Text 컴포넌트 적용

* refactor(SearchFallback): 가운데로 오도록 정렬

* refactor(SearchFallback): common으로 분리

* feat(MainPage): 태그 필터링 결과 없을 시 SearchFallback 보여주도록 구현

* refactor(MainPage): 태그 갯수 설정에 관한 설명 추가

* refactor(extractId): 네이밍 수정

* refactor: extractID 네이밍 수정

* refactor(extractId): extractLastPath 유틸화에 따른 분리

* fix(ModalBottomSheet): 에니메이션 되지 않는 문제 해결

* refactor(SearchFallback): ui 위치 수정

* refactor(TravelogueTabContent): negative margin-top 추가

* refactor(TravelPlanRegisterPage): 여행 계획 등록 subText 추가

* refactor(TravelogueDetailPage): 개행 추가

* refactor(TravelogueRegisterPage): mutate 네이밍 수정

* [Feature] - 플로팅 버튼에 여행 계획 작성 추가 (#368)

* refactor(FloatingButton): 여행 계획 작성 추가 및 UI 수정

* refactor(FloatingButton): 작성 페이지 반대로 가게끔 되어있는 것 수정

* refactor(zIndex): 수정

* refactor(FloatingButton): subButtonContainer gap 및 padding 수정

* [Feature] - required 구현 (#361)

* feat(Input) : label 속성 삭제

* feat(TextField) : TextField 컴포넌트 구현

* test(TextField): TextField 컴포넌트 storybook 추가

* feat(TravelogueRegisterPage): TextField 컴포넌트 적용

* feat(TravelPlanRegisterPage): TextField 컴포넌트 적용

* style(TextField): style 수정

* refactor(TextField): cloneElement 대신 renderProps를 쓰도록 수정

- cloneElement는 legacy라고 함

* style: isRequired 심볼 색상을 디자인 토큰에 추가 및 적용

* refactor(TextField): props 수정

* refactor(ThumbnailUpload): id 받도록 수정

- hiddenInput과 label을 정확하게 연결시켜주기 위함

* test(ThumbnailUpload): storybook에 변경된 props 적용

* test(TextField): storybook에 id 추가

* refactor(TravelogueResisterPage,TravelPlanRegisterPage): TextFiled props에 renderProp 형식으로 넘겨주도록 수정

* test(Header): Header 컴포넌트에서 IconButton을 사용하도록 리팩토링

* [Fix] - 4차 스프린트 QA 반영 1차 (시모)  (#374)

* fix(MainPage): 여행기 1개일 때 메인 페이지 스타일 깨지는 문제 수정

* fix(TransformBottomSheet): 화살표 이외에 클릭시도 닫치게 수정

* fix(TravelogueDetailPage): 내가 작성한 여행기의 경우 바텀시트 안보이도록 수정

* fix(MyTravelPlans): 여행 계획 20자 넘어가면 ... 보이도록 수정

* fix: 빈 값의 경우 []나 '' 값으로 보내도록 수정

* fix(travelPlanRegisterPage): 테스트 오류 해결

* fix(useInfiniteTravelogues): 네트워크 오류 처리하도록 isPaused 반환

* fix(MainPage): 네트워크 오류 및 서버 오류 시 alert 던지도록 수정

* [Fix] - 4차 스프린트 QA 반영 1차 (지니) (#375)

* fix(useMultiImageUpload): 이미지가 있는 상태에서 다중 업로드 시 모두 업로드 되는 이슈 수정

* fix(AccordionTrigger): IconButton으로 교체

svg를 사용하고 있던 것을 IconButton으로 교체

* fix: 좋아요 크기 변경

* refactor(PlaceTodoListItem): input을 autofocus로 지정

* fix(MyPage): 닉네임 글자수 제한 추가 및 닉네임 등록 시 이전 닉네임이 보여지다 현재 닉네임으로 보여지는  문제 수정

* fix(ShareModal): 공유 버튼 간격 조정

* fix: 좋아요를 누르면 로그인 alert가 2번 뜨는 문제 해결

좋아요를 눌렀을 때 interceptor의 alert와 onError 콜백의 alert가 겹쳐 2번 alert 뜨는 문제 해결

* fix(MyPage): input이 20자 넘어가는 문제 해결

* refactor(MyPage): 닉네임 request query 함수 네이밍 개선

* refactor(ShareModal): spacing 적용

* fix: ci 문제 해결

* fix: ci 문제 해결

* fix: ci 문제 해결

* [Feature] - 프론트엔드 dev, prod 분리 작업 (#378)

* chore(package.json): babel 설정을 위한 의존성 설치

* chore: babel 관련 config 설정 추가

* chore: webpack dev, prod 분리

* chore(.gitignore): .env.local 파일 추가

* chore(.storybook/main): importSource 내 @emotion/react 추가

* chore: ci script dev, prod 분리

* chore(webpack.production): 불필요한 변수 제거

* chore: ci 스크립트 수정

* chore: yarn.lock 수정

* fix: ci 문제 해결

* [Fix] - 4차 스프린트 QA 반영 1차 (리버) (#376)

* feat(Input) : label 속성 삭제

* feat(TextField) : TextField 컴포넌트 구현

* test(TextField): TextField 컴포넌트 storybook 추가

* feat(TravelogueRegisterPage): TextField 컴포넌트 적용

* feat(TravelPlanRegisterPage): TextField 컴포넌트 적용

* style(TextField): style 수정

* fix(Header): $isRightContentFull 속성이름 isRightContentFull로 수정

* feat(SearchHeader): SearchHeader에 Home 아이콘 버튼 추가

* test(Header): Header 스토리북에 SearchHeader 수정사항 반영

* fix(PlaceDetailCard): 여행지 이미지가 없는 경우 FallbackImage를 보여주도록 수정

* test(PlaceDetailCard): PlaceDetailCard 스토리북에 등록한 여행지 사진이 없는 경우 추가

* fix(useInfiniteSearchTravelogues): 로그인 안해도 검색할 수 있도록 수정

* feat(TravelogueCard): TravelogueCard에서 제목이 20자보다 길어질 경우 (...)로 줄임 추가

* test(TravelogueCard): TravelogueCard 스토리북에 제목이 20자보다 길어지는 경우 추가

* fix(TravelogueResisterPage): 여행기 등록시 여행기 장소 사진 추가하지 않는 경우 payload에 빈 배열 보내기 추가

* chore(TravelogueResisterPage): 필요없는 주석 삭제

* feat: TextField 컴포넌트 적용

* [Feature] - 404 NotFound 페이지 구현 (#380)

* feat:404 NotFound 페이지 구현

* chore(TravelPlanRegisterPage): 사용되지않는 import 구문 삭제

* fix(TravelogueEditPage,TravelPlanEditPage): label 삭제

* refactor(ThumbnailUpload): id props를 옵셔널로 수정

* fix(TravelPlanRegisterPage): import되어있지 않은 컴포넌트 import

* refactor: 불필요한 것 제거

---------

Co-authored-by: 손진영 <[email protected]>

* [Fix] - 로딩, 에러 처리 및 메인페이지, 로그인 콜백 페이지 오류 수정 (#391)

* fix(useMultiImageUpload): 이미지가 있는 상태에서 다중 업로드 시 모두 업로드 되는 이슈 수정

* fix(AccordionTrigger): IconButton으로 교체

svg를 사용하고 있던 것을 IconButton으로 교체

* fix: 좋아요 크기 변경

* refactor(PlaceTodoListItem): input을 autofocus로 지정

* fix(MyPage): 닉네임 글자수 제한 추가 및 닉네임 등록 시 이전 닉네임이 보여지다 현재 닉네임으로 보여지는  문제 수정

* fix(ShareModal): 공유 버튼 간격 조정

* fix: 좋아요를 누르면 로그인 alert가 2번 뜨는 문제 해결

좋아요를 눌렀을 때 interceptor의 alert와 onError 콜백의 alert가 겹쳐 2번 alert 뜨는 문제 해결

* fix(MainPage): 여행기 1개일 때 메인 페이지 스타일 깨지는 문제 수정

* fix(TransformBottomSheet): 화살표 이외에 클릭시도 닫치게 수정

* fix(TravelogueDetailPage): 내가 작성한 여행기의 경우 바텀시트 안보이도록 수정

* fix(MyTravelPlans): 여행 계획 20자 넘어가면 ... 보이도록 수정

* fix: 빈 값의 경우 []나 '' 값으로 보내도록 수정

* fix(MyPage): input이 20자 넘어가는 문제 해결

* fix(travelPlanRegisterPage): 테스트 오류 해결

* refactor(MyPage): 닉네임 request query 함수 네이밍 개선

* refactor(ShareModal): spacing 적용

* fix(useInfiniteTravelogues): 네트워크 오류 처리하도록 isPaused 반환

* fix(MainPage): 네트워크 오류 및 서버 오류 시 alert 던지도록 수정

* chore(gitignore): .ene.local 추가

* fix(LoginFallback): 줄바뀌는 문제 해결

* fix(MainPage): 휑 멘트 및 subTitle 메시지 너비에 따라 변하도록 수정

* refactor(LoginPage): text 컴포넌트 적용 및 스타일링 수정

* refactor(KakaoCallbackPage): usePostKakaoLogin 훅 분리 및 네트워크 에러 처리

* fix(useTravelogueDays): 전환시 PhotoUrls 빈값으로 인한 오류 해결

* refactor(TravelogueDeleteModal): isPending 시 spinner 보여주도록 수정

* refactor(TravelogueDetailPage): error 및 로딩 처리

* fix: 여행기 상세 페이지 에러 시에도 스켈레톤이 보여지도록 변경

---------

Co-authored-by: 손진영 <[email protected]>

* [Fix] - 여행 계획 수정, 마이페이지, 검색 페이지 에러 핸들링 (#393)

* feat(useInfiniteMyTravelogues,MyTravelogues): 내 여행기 불러오기 네트워크 오류 처리 추가

* feat(useInfiniteMyTravelogues,MyTravelogues) : 프로필 정보를 잘 가져와야 내 여행기를 fetch하도록 구현, error 핸들링 추가

* feat(MyPage): 내 프로필 정보 가져오기 error 처리 추가

* feat(MyTravelPlans,useInfiniteMyTravelPlans): 내 프로필 정보를 잘 가져와야 여행계획 fetch하도록 수정

* feat(MyTravelPlan): 커밋 누락 추가

* feat(TravelPlanEditPage): 확인 버튼 클릭시 네트워크 오류면 alert창 뜨도록 수정

* feat: 검색 에러처리 (네트워크,서버오류)

* feat: Query client retry 횟수 0으로 수정

* fix: 오타 수정

* [Fix] - 여행기 등록 & 수정, 여행 계획 등록, 여행 계획 상세 페이지 예외 및 로딩 처리 (#394)

* fix: 여행기 등록 & 수정 페이지 로딩 및 예외 처리

* fix: 여행 계호기 상세 페이지 예외 처리

* fix: 여행 계획 등록 페이지 예외 처리

* [Fix] - 4차 스프린트 QA 반영 2차 (시모) (#400)

* fix(FloatingButton): 여행 계획 작성 글자 잘리는 문제 해결

* fix(useTravelPlanDays): todos 빈 배열로 보내도록 수정

* refactor(Button): children 위치 유연하게 받도록 수정

* fix(modalBottomSheet): isPending 시 spinner 보여주도록 수정

* fix(debouncedTime): 디바운스 시간 10초로 수정

* fix(Button): justify-content 안 먹는 문제 해결

* [Fix] - 4차 스프린트 QA 반영 2차 (리버) (#401)

* refactor(Box): Box 컴포넌트 props 수정

* feat(TravelPlansTabContent): 상세지도 보기 추가

* refactor(TravelogueCard): title을 Text 컴포넌트 사용으로 수정하여 텍스트 위 짤림 현상 수정

* fix(useInfiniteSearchTravelogues): api 올바르게 수정

* refactor(ThumbnailUpload): 이미지가 등록 중일 때 스피너가 나오도록 구현

* feat(TravelogueRegisterPage): 썸네일 업로드 후 보이는 삭제버튼 구현

* test(ThumbnailUpload): 로딩 중인 ThumbnailUpload storybook 추가

* feat(TravelogueRegisterPage): 썸네일 필수값으로 수정

* refactor(ThumbnailUpload): ThumbnailUpload에서 이미지가 change될때 isLoading 변하게 수정, border보이는 조건 수정

* fix: 썸네일 TextField 컴포넌트로 변경

* fix(ThumbnailUpload): 중복된 z-index 제거

* fix: 검색 결과 text가 이상하게 보이는 오류 해결

* fix: 썸네일 require 아닌 걸로 수정

---------

Co-authored-by: 손진영 <[email protected]>

* [Fix] - 4차 스프린트 QA 반영 2차 (지니) (#402)

* fix: 구글맵 마커 클릭 하지 못하도록 변경

* fix: 마이페이지 alert 2번 뜨는 현상 개선

* fix: 여행 계획 변환 시 todos가 없을 경우 빈배열로 생성

* fix: 로그아웃 상태에서  좋아요 누를 때 alert 2번 뜨는 문제 해결

* fix: 여행 계획 date가 제대로 보이지 않는 문제 해결

* fix: 달 마지막 일을 시작일로 할 때 여행 계획 Day 아코디언 추가 시 다음 달로 넘어가지 않는 문제 해결

* fix(TravelPlanRegisterPage): subText 추가

* fix(MyPage): 닉네임 한글로 입력 시 21자로 입력되는 문제 해결

* fix: to do 입력 시 20자로 제한 하도록 변경

* fix: 존재하지 않는 여행 계획 시 메인 페이지로 이동하도록 변경

* fix: 여행기 수정 페이지 내 썸네일이 없을 경우 디폴트 이미지를 업로드 하도록 변경

* fix: ci 문제 해결

* fix: 여행 계획 상세 페이지 내 작성자 아닌 게시물 접근 시 alert가 2번 뜨는 현상 개선 (#404)

---------

Co-authored-by: simorimi <[email protected]>
Co-authored-by: choi river <[email protected]>
Co-authored-by: choi river <[email protected]>
Co-authored-by: simorimi <[email protected]>
Co-authored-by: simhorim <[email protected]>
Co-authored-by: eunjungL <[email protected]>

.github/CODEOWNERS

@@ -0,0 +1 @@
+frontend/ @0jenn0 @simorimi @jinyoung234

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,9 @@
+# ✅ 작업 내용
+
+- 작업 내용 1
+- 작업 내용 2
+- 작업 내용 3
+
+# 📸 스크린샷
+
+# 🙈 참고 사항

.github/workflows/chromatic.yml

@@ -0,0 +1,49 @@
+name: 'Chromatic'
+
+on:
+  pull_request:
+    branches: [develop/fe]
+    paths:
+      - '**/*.stories.tsx'
+      - '**/*.stories.ts'
+defaults:
+  run:
+    working-directory: frontend
+jobs:
+  chromatic:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: '20.15.1'
+
+      - name: Cache dependencies
+        id: cache
+        uses: actions/cache@v4
+        with:
+          path: '**/node_modules'
+          key: ${{ runner.os }}-node-${{ hashFiles('**/yarn.lock') }}-storybook
+
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn install --frozen-lockfile
+
+      - name: Publish to Chromatic
+        id: chromatic
+        uses: chromaui/action@latest
+        with:
+          workingDir: frontend
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+
+      - name: Comment PR
+        uses: thollander/actions-comment-pull-request@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          message: '🚀 Storybook: ${{ steps.chromatic.outputs.storybookUrl }}'

.github/workflows/frontend-ci-development.yml

@@ -0,0 +1,60 @@
+name: 'frontend-ci'
+
+on:
+  pull_request:
+    branches:
+      - develop/fe
+    paths:
+      - frontend/**
+defaults:
+  run:
+    working-directory: frontend
+jobs:
+  frontend-ci:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: 노드 버전 설정
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20.15.1'
+
+      - name: 의존성 캐싱
+        id: cache
+        uses: actions/cache@v4
+        with:
+          path: frontend/node_modules
+          key: ${{ runner.os }}-node-${{ hashFiles('**/yarn.lock') }}
+
+      - name: 의존성 설치
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn
+
+      - name: eslint 실행
+        run: yarn lint
+
+      - name: 빌드 실행
+        run: yarn build:development
+
+      - name: stylelint 실행
+        run: yarn lint:styled
+
+      - name: 테스트 실행
+        run: yarn test
+
+      - name: 테스트 결과 PR에 코멘트 등록
+        uses: EnricoMi/publish-unit-test-result-action@v2
+        if: always()
+        with:
+          files: frontend/test-results/results.xml
+
+      - name: 테스트 실패 시, 실패한 코드 라인에 Check 코멘트 등록
+        uses: mikepenz/action-junit-report@v3
+        if: always()
+        with:
+          report_paths: frontend/test-results/results.xml
+          token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/frontend-ci.production.yml

@@ -0,0 +1,60 @@
+name: 'frontend-ci'
+
+on:
+  pull_request:
+    branches:
+      - production/fe
+    paths:
+      - frontend/**
+defaults:
+  run:
+    working-directory: frontend
+jobs:
+  frontend-ci:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: 노드 버전 설정
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20.15.1'
+
+      - name: 의존성 캐싱
+        id: cache
+        uses: actions/cache@v4
+        with:
+          path: frontend/node_modules
+          key: ${{ runner.os }}-node-${{ hashFiles('**/yarn.lock') }}
+
+      - name: 의존성 설치
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn
+
+      - name: eslint 실행
+        run: yarn lint
+
+      - name: 빌드 실행
+        run: yarn build:production
+
+      - name: stylelint 실행
+        run: yarn lint:styled
+
+      - name: 테스트 실행
+        run: yarn test
+
+      - name: 테스트 결과 PR에 코멘트 등록
+        uses: EnricoMi/publish-unit-test-result-action@v2
+        if: always()
+        with:
+          files: frontend/test-results/results.xml
+
+      - name: 테스트 실패 시, 실패한 코드 라인에 Check 코멘트 등록
+        uses: mikepenz/action-junit-report@v3
+        if: always()
+        with:
+          report_paths: frontend/test-results/results.xml
+          token: ${{ secrets.GITHUB_TOKEN }}

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["stylelint.vscode-stylelint"]
+}

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+  "editor.codeActionsOnSave": {
+    "source.fixAll.stylelint": "explicit"
+  },
+  "stylelint.validate": ["typescriptreact", "typescript"],
+  "stylelint.configFile": "./frontend/.stylelintrc.json",
+  "stylelint.packageManager": "yarn"
+}

frontend/.eslintrc.cjs

@@ -0,0 +1,21 @@
+module.exports = {
+  env: { browser: true, es2020: true, jest: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:compat/recommended",
+    "plugin:storybook/recommended",
+    "plugin:jest/recommended",
+  ],
+  plugins: ["react-refresh", "prettier", "@typescript-eslint"],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  rules: {
+    "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+    "import/no-unresolved": "off",
+    "@typescript-eslint/no-var-requires": "off",
+    "no-undef": "off",
+    "compat/compat": "warn",
+  },
+};

frontend/.gitignore

@@ -0,0 +1,30 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.development
+.env.production
+.env.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# storybook
+build-storybook.log
+
+node_modules
+*storybook.log
+
+.env.local

frontend/.prettierrc.json

@@ -0,0 +1,33 @@
+{
+  "endOfLine": "auto",
+  "singleQuote": false,
+  "semi": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "trailingComma": "all",
+  "printWidth": 100,
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "prefer-const": true,
+  "plugins": ["@trivago/prettier-plugin-sort-imports"],
+  "importOrder": [
+    "^react",
+    "^@emotion/(.*)$",
+    "<THIRD_PARTY_MODULES>",
+    "^@tanstack/(.*)$",
+    "^@type/(.*)$",
+    "^@apis/(.*)$",
+    "^@contexts/(.*)$",
+    "^@mocks/(.*)$",
+    "^@queries/(.*)$",
+    "^@components/(.*)$",
+    "^@hooks/(.*)$",
+    "^@constants/(.*)$",
+    "^@utils/(.*)$",
+    "^@styles/(.*)$",
+    "^@assets/(.*)$",
+    "^[./]"
+  ],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true
+}

frontend/.storybook/main.ts

@@ -0,0 +1,66 @@
+import type { StorybookConfig } from "@storybook/react-webpack5";
+import path from "path";
+import webpack from "webpack";
+
+const config: StorybookConfig = {
+  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+  addons: [
+    "@storybook/addon-webpack5-compiler-swc",
+    "@storybook/addon-onboarding",
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@chromatic-com/storybook",
+    "@storybook/addon-interactions",
+    "storybook-addon-remix-react-router",
+  ],
+  framework: "@storybook/react-webpack5",
+  webpackFinal: async (config) => {
+    if (config.resolve) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        "@": path.resolve(__dirname, "../src"),
+        "@components": path.resolve(__dirname, "../src/components"),
+        "@assets": path.resolve(__dirname, "../src/assets"),
+        "@styles": path.resolve(__dirname, "../src/styles"),
+        "@apis": path.resolve(__dirname, "../src/apis"),
+        "@mocks": path.resolve(__dirname, "../src/mocks"),
+        "@constants": path.resolve(__dirname, "../src/constants"),
+        "@type": path.resolve(__dirname, "../src/types"),
+        "@queries": path.resolve(__dirname, "../src/queries"),
+        "@hooks": path.resolve(__dirname, "../src/hooks"),
+        "@contexts": path.resolve(__dirname, "../src/contexts"),
+        "@utils": path.resolve(__dirname, "../src/utils"),
+      };
+    }
+    config.module = config.module || {};
+    config.module.rules = config.module.rules || [];
+    const imageRule = config.module.rules.find((rule) => rule?.["test"]?.test(".svg"));
+    if (imageRule) {
+      imageRule["exclude"] = /\.svg$/;
+    }
+    config.module.rules.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    });
+    config.plugins = config.plugins || [];
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        "process.env": JSON.stringify(process.env),
+      }),
+    );
+
+    return config;
+  },
+  swc: () => ({
+    jsc: {
+      transform: {
+        react: {
+          runtime: "automatic",
+          importSource: "@emotion/react",
+        },
+      },
+    },
+  }),
+  staticDirs: ["../public"],
+};
+export default config;