From a78ee5a9d98780af303ee5ee4c52400cf9c1503f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=9D=B4=EB=8F=84=ED=98=84?= <64634992+ksmfou98@users.noreply.github.com> Date: Wed, 18 Oct 2023 15:03:31 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20prettier=20=EC=88=98=EC=A0=95=20(#196)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/jurumarble/.eslintrc.js | 2 +- apps/jurumarble/next.config.js | 36 +-- apps/jurumarble/package.json | 4 +- apps/jurumarble/public/images/index.ts | 22 +- .../[id]/components/DrinkCommentContainer.tsx | 44 ++- .../[id]/components/DrinkInfoContainer.tsx | 36 ++- .../src/app/drink-info/[id]/page.tsx | 12 +- .../[id]/services/useDrinkLoadService.ts | 6 +- apps/jurumarble/src/app/layout.tsx | 44 +-- .../app/login/components/LoginPageHeader.tsx | 10 +- .../src/app/login/components/LoginSection.tsx | 16 +- .../login/components/TermsOfUseSection.tsx | 7 +- .../app/login/components/WelcomeSection.tsx | 10 +- .../app/login/kakao-login-process/page.tsx | 20 +- .../app/login/naver-login-process/page.tsx | 21 +- apps/jurumarble/src/app/login/page.tsx | 10 +- .../src/app/main/components/Banner.tsx | 15 +- .../src/app/main/components/Carousel.tsx | 35 ++- .../app/main/components/HotDrinkContainer.tsx | 8 +- .../main/components/HotDrinkVoteContainer.tsx | 37 ++- .../main/components/SearchInputWrapper.tsx | 14 +- .../components/TodayDrinkRecommendation.tsx | 17 +- .../containers/HydratedDrinkVoteContainer.tsx | 12 +- .../containers/HydratedHotDrinkContainer.tsx | 12 +- .../src/app/main/services/queryKey.ts | 4 +- .../useGetDrinkRecommendationListService.ts | 13 +- .../services/useGetHotDrinkListService.ts | 6 +- .../services/useGetHotDrinkVoteService.ts | 6 +- .../src/app/map/components/MapContainer.tsx | 85 ++--- .../app/map/components/RegionBottomsheet.tsx | 22 +- .../app/map/components/RegionSmallSelect.tsx | 16 +- .../src/app/map/hooks/useGeoLocation.ts | 14 +- apps/jurumarble/src/app/map/page.tsx | 14 +- .../app/map/services/useDrinksMapService.ts | 12 +- .../src/app/my/components/ChipContainer.tsx | 18 +- .../app/my/components/UseInfoContainer.tsx | 22 +- .../app/my/components/VoteCountContainer.tsx | 25 +- .../src/app/my/components/VoteDescription.tsx | 14 +- .../src/app/my/components/VoteItem.tsx | 19 +- .../app/my/components/VoteListContainer.tsx | 36 ++- .../app/my/edit/components/ImageUpload.tsx | 15 +- .../edit/components/SelectDrinkCapacity.tsx | 19 +- .../src/app/my/edit/components/SelectMBTI.tsx | 15 +- .../edit/components/UserInfoEditContainer.tsx | 35 ++- .../my/edit/components/WithdrawalModal.tsx | 32 +- apps/jurumarble/src/app/my/edit/page.tsx | 14 +- .../my/edit/services/useEditProfileService.ts | 49 ++- apps/jurumarble/src/app/my/page.tsx | 14 +- .../my/services/useGetCountedVoteService.ts | 6 +- .../useGetMyBookmarkedVoteListService.ts | 22 +- .../useGetMyCreatedVoteListService.ts | 26 +- .../useGetMyParticipatedVoteListService.ts | 22 +- apps/jurumarble/src/app/notification/page.tsx | 40 ++- .../services/useNotificationService.ts | 50 +-- apps/jurumarble/src/app/page.tsx | 28 +- .../src/app/register/components/Button.tsx | 21 +- .../app/register/components/ContentHeader.tsx | 10 +- .../app/register/components/GlobalHeader.tsx | 6 +- .../app/register/components/ProgressBar.tsx | 12 +- .../src/app/register/components/Tooltip.tsx | 4 +- .../app/register/components/WarningModal.tsx | 36 ++- .../src/app/register/components/index.ts | 10 +- .../jurumarble/src/app/register/constants.tsx | 22 +- .../register/contexts/RegisterProvider.tsx | 85 ++--- .../src/app/register/contexts/index.ts | 4 +- .../register/contexts/useRegisterContext.ts | 8 +- apps/jurumarble/src/app/register/layout.tsx | 12 +- apps/jurumarble/src/app/register/page.tsx | 4 +- .../sections/RegisterBirthSection.tsx | 24 +- .../sections/RegisterDrinkCapacitySection.tsx | 43 +-- .../sections/RegisterFooterSection.tsx | 8 +- .../sections/RegisterGenderSection.tsx | 10 +- .../register/sections/RegisterMBTISection.tsx | 28 +- .../sections/RegisterProgressSection.tsx | 8 +- .../register/sections/RegisterStepSection.tsx | 12 +- .../src/app/register/sections/index.ts | 14 +- .../app/search/components/ChipContainer.tsx | 31 +- .../src/app/search/components/DrinkItem.tsx | 33 +- .../src/app/search/components/DrinkList.tsx | 20 +- .../app/search/components/DrinkVoteItem.tsx | 17 +- .../app/search/components/DrinkVoteList.tsx | 12 +- .../search/components/RegionSmallSelect.tsx | 17 +- .../app/search/components/SearchContainer.tsx | 94 +++--- .../src/app/search/components/SortSelect.tsx | 10 +- .../app/search/components/VoteDescription.tsx | 4 +- apps/jurumarble/src/app/search/page.tsx | 4 +- .../app/search/services/useGetDrinkList.ts | 17 +- .../search/services/useVoteDrinkService.ts | 21 +- .../src/app/stamp/components/DrinkItem.tsx | 29 +- .../stamp/components/DrinkStampContainer.tsx | 14 +- .../components/MyEnjoiedDrinkInfoSection.tsx | 8 +- .../src/app/stamp/components/RegionSelect.tsx | 19 +- .../app/stamp/components/StampedDrinkList.tsx | 27 +- apps/jurumarble/src/app/stamp/page.tsx | 8 +- .../stamp/service/useDrinkStampListService.ts | 17 +- apps/jurumarble/src/app/test/page.tsx | 16 +- .../vote/[id]/components/AlcholLevelTag.tsx | 10 +- .../vote/[id]/components/ChipContainer.tsx | 51 +-- .../src/app/vote/[id]/components/Comment.tsx | 83 +++-- .../vote/[id]/components/CommentContainer.tsx | 34 +- .../[id]/components/CommentDeleteModal.tsx | 18 +- .../app/vote/[id]/components/CommentForm.tsx | 16 +- .../vote/[id]/components/CommentPutForm.tsx | 16 +- .../vote/[id]/components/CommentToolbar.tsx | 16 +- .../vote/[id]/components/RestaurantItem.tsx | 6 +- .../app/vote/[id]/components/SearchInput.tsx | 19 +- .../[id]/components/SearchRestaurantModal.tsx | 94 +++--- .../vote/[id]/components/VoteAnalyzeBar.tsx | 9 +- .../vote/[id]/components/VoteDescription.tsx | 77 +++-- .../[id]/components/VoteSmallSelectFilter.tsx | 16 +- .../vote/[id]/components/VoteWriterBox.tsx | 12 +- apps/jurumarble/src/app/vote/[id]/page.tsx | 95 +++--- .../[id]/services/useCommentDeleteService.ts | 23 +- .../[id]/services/useCommentReportService.ts | 8 +- .../vote/[id]/services/useCommentServices.ts | 24 +- .../[id]/services/useExecuteVoteService.ts | 65 ++-- .../services/useFilterStatisticsService.ts | 14 +- .../services/useRestaurantImageService.ts | 19 +- .../[id]/services/useRestaurantService.ts | 17 +- .../[id]/services/useVoteDeleteService.ts | 10 +- .../vote/[id]/services/useVoteLoadService.ts | 6 +- .../[id]/services/useVoteReportService.ts | 4 +- .../update/components/UpdateVoteContainer.tsx | 53 ++-- .../[id]/update/hook/useUpdataVoteForm.ts | 154 ++++----- .../src/app/vote/[id]/update/page.tsx | 2 +- .../src/app/vote/components/MenuBox.tsx | 9 +- .../src/app/vote/components/NonWriterBox.tsx | 4 +- .../src/app/vote/hooks/useFlipAnimation.ts | 12 +- apps/jurumarble/src/app/vote/layout.tsx | 20 +- apps/jurumarble/src/app/vote/page.tsx | 86 ++--- .../app/vote/post/components/DrinkItem.tsx | 24 +- .../vote/post/components/DrinkSearchModal.tsx | 62 ++-- .../vote/post/components/PostBottomSheet.tsx | 9 +- .../post/components/PostVoteContainer.tsx | 66 ++-- .../app/vote/post/components/RegionSelect.tsx | 19 +- .../post/components/SelectedDrinkChip.tsx | 4 +- .../components/TitleAndDescriptionSection.tsx | 6 +- .../post/hooks/useUpdateSelectedDrinkList.ts | 25 +- apps/jurumarble/src/app/vote/post/page.tsx | 2 +- .../app/vote/post/services/useGetDrinkList.ts | 15 +- .../vote/post/services/usePostVoteService.ts | 59 ++-- .../vote/services/useGetVoteListService.tsx | 46 ++- .../assets/icons/components/IcArrowDown.tsx | 11 +- .../assets/icons/components/IcBookmark.tsx | 2 +- .../icons/components/IcBookmarkActive.tsx | 11 +- .../src/assets/icons/components/IcCamera.tsx | 11 +- .../src/assets/icons/components/IcChat.tsx | 2 +- .../src/assets/icons/components/IcCheck.tsx | 2 +- .../src/assets/icons/components/IcDetail.tsx | 2 +- .../assets/icons/components/IcExpandMore.tsx | 11 +- .../icons/components/IcHeaderSearch.tsx | 4 +- .../src/assets/icons/components/IcHome.tsx | 4 +- .../src/assets/icons/components/IcInfo.tsx | 4 +- .../assets/icons/components/IcKakaoIcon.tsx | 2 +- .../src/assets/icons/components/IcLike.tsx | 2 +- .../src/assets/icons/components/IcLogo.tsx | 2 +- .../src/assets/icons/components/IcMapPin.tsx | 2 +- .../src/assets/icons/components/IcMark.tsx | 2 +- .../src/assets/icons/components/IcMenu.tsx | 2 +- .../assets/icons/components/IcMyLocation.tsx | 16 +- .../icons/components/IcMyLocationFloating.tsx | 20 +- .../assets/icons/components/IcNaverIcon.tsx | 9 +- .../src/assets/icons/components/IcNext.tsx | 4 +- .../icons/components/IcNotification.tsx | 4 +- .../icons/components/IcNotificationCheck.tsx | 4 +- .../src/assets/icons/components/IcPin.tsx | 2 +- .../src/assets/icons/components/IcPlus.tsx | 2 +- .../src/assets/icons/components/IcPrev.tsx | 2 +- .../assets/icons/components/IcPrevious.tsx | 4 +- .../src/assets/icons/components/IcSearch.tsx | 2 +- .../src/assets/icons/components/IcStamp.tsx | 2 +- .../src/assets/icons/components/IcThunder.tsx | 2 +- .../src/assets/icons/components/IcUser.tsx | 4 +- .../assets/icons/components/IcWarningIcon.tsx | 2 +- .../src/assets/icons/components/IcX.tsx | 2 +- .../src/assets/icons/components/ManAvatar.tsx | 297 +++++++++++++++--- .../assets/icons/components/WomenAvatar.tsx | 2 +- .../src/assets/icons/components/index.ts | 58 ++-- apps/jurumarble/src/components/AorBMark.tsx | 6 +- .../jurumarble/src/components/AuthProcess.tsx | 14 +- apps/jurumarble/src/components/BottomBar.tsx | 37 ++- apps/jurumarble/src/components/Chip.tsx | 6 +- apps/jurumarble/src/components/DivideLine.tsx | 2 +- apps/jurumarble/src/components/Header.tsx | 14 +- .../src/components/ImageUploadButton.tsx | 8 +- apps/jurumarble/src/components/LevelChip.tsx | 2 +- apps/jurumarble/src/components/Loading.tsx | 8 +- .../jurumarble/src/components/SearchInput.tsx | 16 +- apps/jurumarble/src/components/VoteHeader.tsx | 4 +- .../src/components/button/Button.tsx | 19 +- .../jurumarble/src/components/button/index.ts | 2 +- apps/jurumarble/src/components/index.ts | 20 +- .../jurumarble/src/components/input/Input.tsx | 10 +- apps/jurumarble/src/components/input/index.ts | 2 +- .../src/components/layouts/index.ts | 2 +- .../modal/FloatComponentTemplate.tsx | 6 +- .../src/components/modal/ModalTemplate.tsx | 22 +- .../src/components/modal/Portal.tsx | 4 +- .../src/components/selectBox/Option.tsx | 2 +- .../src/components/selectBox/OptionList.tsx | 4 +- .../src/components/selectBox/Select.tsx | 8 +- .../src/components/selectBox/SelectButton.tsx | 2 +- .../src/components/selectBox/index.ts | 8 +- .../src/components/textarea/Textarea.tsx | 10 +- .../src/hooks/useCreateQueryString.ts | 4 +- apps/jurumarble/src/hooks/useInput.ts | 10 +- apps/jurumarble/src/lib/Path.ts | 32 +- .../jurumarble/src/lib/ReactQueryProvider.tsx | 8 +- apps/jurumarble/src/lib/apis/auth.ts | 14 +- apps/jurumarble/src/lib/apis/bookmark.ts | 6 +- apps/jurumarble/src/lib/apis/comment.ts | 61 ++-- apps/jurumarble/src/lib/apis/common.ts | 4 +- apps/jurumarble/src/lib/apis/drink.ts | 49 +-- apps/jurumarble/src/lib/apis/http/base.ts | 4 +- apps/jurumarble/src/lib/apis/http/http.ts | 26 +- apps/jurumarble/src/lib/apis/my.ts | 48 ++- apps/jurumarble/src/lib/apis/notification.ts | 8 +- apps/jurumarble/src/lib/apis/report.ts | 6 +- apps/jurumarble/src/lib/apis/restaurant.ts | 17 +- apps/jurumarble/src/lib/apis/statistics.ts | 2 +- apps/jurumarble/src/lib/apis/user.ts | 15 +- apps/jurumarble/src/lib/apis/vote.ts | 60 ++-- .../src/lib/apis/vote/getHotDrinkList.ts | 2 +- .../src/lib/apis/vote/getHotDrinkVote.ts | 2 +- apps/jurumarble/src/lib/constants.tsx | 231 ++++++++------ apps/jurumarble/src/lib/env.ts | 19 +- apps/jurumarble/src/lib/localFont.ts | 58 +++- apps/jurumarble/src/lib/queryKeys.ts | 74 +++-- apps/jurumarble/src/lib/registory.tsx | 20 +- .../src/lib/styles/StyledComponents.tsx | 15 +- .../src/lib/styles/getClassNames.ts | 12 +- .../jurumarble/src/lib/styles/globalStyles.ts | 4 +- apps/jurumarble/src/lib/styles/index.ts | 12 +- apps/jurumarble/src/lib/styles/media.ts | 3 +- apps/jurumarble/src/lib/styles/styled.d.ts | 6 +- apps/jurumarble/src/lib/styles/theme.ts | 50 +-- apps/jurumarble/src/lib/styles/transitions.ts | 2 +- apps/jurumarble/src/lib/utils/auth.ts | 12 +- apps/jurumarble/src/lib/utils/formatDate.ts | 4 +- .../src/lib/utils/formatUserInfo.ts | 34 +- apps/jurumarble/src/lib/utils/userStorage.ts | 12 +- .../jurumarble/src/modules/getQueryClient.tsx | 4 +- apps/jurumarble/src/modules/httpFetch.ts | 14 +- .../src/modules/hydrateOnClient.tsx | 4 +- .../src/services/useBookmarkService.ts | 86 +++-- .../src/services/useDrinkStampService.ts | 39 ++- .../jurumarble/src/services/useGetUserInfo.ts | 34 +- apps/jurumarble/src/types/common.ts | 12 +- apps/jurumarble/src/types/drink.ts | 2 +- apps/jurumarble/src/types/my.ts | 8 +- apps/jurumarble/src/types/register.ts | 10 +- apps/jurumarble/src/types/vote.ts | 12 +- package.json | 6 +- 253 files changed, 3241 insertions(+), 2089 deletions(-) diff --git a/apps/jurumarble/.eslintrc.js b/apps/jurumarble/.eslintrc.js index e38f2b55..aace1350 100644 --- a/apps/jurumarble/.eslintrc.js +++ b/apps/jurumarble/.eslintrc.js @@ -1,4 +1,4 @@ module.exports = { - extends: ["mogakko/next"], + extends: ['mogakko/next'], root: true, }; diff --git a/apps/jurumarble/next.config.js b/apps/jurumarble/next.config.js index 61b8537f..3240b503 100644 --- a/apps/jurumarble/next.config.js +++ b/apps/jurumarble/next.config.js @@ -1,6 +1,6 @@ -console.log("START"); -const withBundleAnalyzer = require("@next/bundle-analyzer")({ - enabled: process.env.ANALYZE === "true", +console.log('START'); +const withBundleAnalyzer = require('@next/bundle-analyzer')({ + enabled: process.env.ANALYZE === 'true', }); /** @type {import('next').NextConfig} */ @@ -9,24 +9,24 @@ const nextConfig = { compiler: { styledComponents: true, }, - transpilePackages: ["@monorepo/ui, @monorepo/hooks"], + transpilePackages: ['@monorepo/ui, @monorepo/hooks'], images: { unoptimized: true, domains: [ - "shopping-phinf.pstatic.net", - "elasticbeanstalk-ap-northeast-2-319210348301.s3.ap-northeast-2.amazonaws.com", - "tong.visitkorea.or.kr", - "img.danawa.com", - "sulsulsul.com", - "shop-phinf.pstatic.net", - "modo-phinf.pstatic.net", - "cdn-pro-web-251-115.cdn-nhncommerce.com", - "lh3.googleusercontent.com", - "cdn-std-web-220-13.cdn-nhncommerce.com", - "cdn.imweb.me", - "www.xn--2q1bq25atga3iu9cz95a.com", - "www.seenews365.com", - "www.seongpo.co.kr", + 'shopping-phinf.pstatic.net', + 'elasticbeanstalk-ap-northeast-2-319210348301.s3.ap-northeast-2.amazonaws.com', + 'tong.visitkorea.or.kr', + 'img.danawa.com', + 'sulsulsul.com', + 'shop-phinf.pstatic.net', + 'modo-phinf.pstatic.net', + 'cdn-pro-web-251-115.cdn-nhncommerce.com', + 'lh3.googleusercontent.com', + 'cdn-std-web-220-13.cdn-nhncommerce.com', + 'cdn.imweb.me', + 'www.xn--2q1bq25atga3iu9cz95a.com', + 'www.seenews365.com', + 'www.seongpo.co.kr', ], }, }; diff --git a/apps/jurumarble/package.json b/apps/jurumarble/package.json index e3728ad3..04c64e9f 100644 --- a/apps/jurumarble/package.json +++ b/apps/jurumarble/package.json @@ -12,7 +12,9 @@ "gen:icon": "yarn gen --out-dir ./src/assets/icons/components ./src/assets/icons", "icon:build": "yarn gen:icon", "eslint": "eslint -c .eslintrc.js .", - "eslint:fix": "yarn eslint --fix" + "eslint:fix": "yarn eslint --fix", + "prettier": "prettier --config ../../packages/prettier-config/index.json --ignore-path ../../.prettierignore --check './**/*.{js,ts,tsx,md}'", + "prettier:fix": "yarn prettier --write" }, "dependencies": { "@emotion/is-prop-valid": "^1.2.1", diff --git a/apps/jurumarble/public/images/index.ts b/apps/jurumarble/public/images/index.ts index 60942dcd..54780de5 100644 --- a/apps/jurumarble/public/images/index.ts +++ b/apps/jurumarble/public/images/index.ts @@ -1,11 +1,11 @@ -export { default as EmptyAImg } from "./AImg.png"; -export { default as ExImg1 } from "./exe1.png"; -export { default as ExImg2 } from "./exe2.png"; -export { default as DrinkImage } from "./DrinkImage.png"; -export { default as MainBannerImage } from "./MainBannerImage.png"; -export { default as Male } from "./male.png"; -export { default as Female } from "./female.png"; -export { default as DrinkCapacityLow } from "./DrinkCapacityLow.png"; -export { default as DrinkCapacityMedium } from "./DrinkCapacityMedium.png"; -export { default as DrinkCapacityHigh } from "./DrinkCapacityHigh.png"; -export { default as ImgScroll } from "./ImgScroll.png"; +export { default as EmptyAImg } from './AImg.png'; +export { default as ExImg1 } from './exe1.png'; +export { default as ExImg2 } from './exe2.png'; +export { default as DrinkImage } from './DrinkImage.png'; +export { default as MainBannerImage } from './MainBannerImage.png'; +export { default as Male } from './male.png'; +export { default as Female } from './female.png'; +export { default as DrinkCapacityLow } from './DrinkCapacityLow.png'; +export { default as DrinkCapacityMedium } from './DrinkCapacityMedium.png'; +export { default as DrinkCapacityHigh } from './DrinkCapacityHigh.png'; +export { default as ImgScroll } from './ImgScroll.png'; diff --git a/apps/jurumarble/src/app/drink-info/[id]/components/DrinkCommentContainer.tsx b/apps/jurumarble/src/app/drink-info/[id]/components/DrinkCommentContainer.tsx index 45f50ed3..8d735df4 100644 --- a/apps/jurumarble/src/app/drink-info/[id]/components/DrinkCommentContainer.tsx +++ b/apps/jurumarble/src/app/drink-info/[id]/components/DrinkCommentContainer.tsx @@ -1,28 +1,34 @@ -import { useState } from "react"; +import { useState } from 'react'; -import { useQueryClient } from "@tanstack/react-query"; -import Comment from "app/vote/[id]/components/Comment"; -import CommentForm from "app/vote/[id]/components/CommentForm"; -import CommentToolBar from "app/vote/[id]/components/CommentToolbar"; -import useCommentServices from "app/vote/[id]/services/useCommentServices"; -import { queryKeys } from "lib/queryKeys"; -import { useParams } from "next/navigation"; -import styled from "styled-components"; +import { useQueryClient } from '@tanstack/react-query'; +import Comment from 'app/vote/[id]/components/Comment'; +import CommentForm from 'app/vote/[id]/components/CommentForm'; +import CommentToolBar from 'app/vote/[id]/components/CommentToolbar'; +import useCommentServices from 'app/vote/[id]/services/useCommentServices'; +import { queryKeys } from 'lib/queryKeys'; +import { useParams } from 'next/navigation'; +import styled from 'styled-components'; function DrinkCommentContainer() { const params = useParams(); const postId = params.id; const queryClient = useQueryClient(); - const [sortBy, setSortBy] = useState<"ByTime" | "ByPopularity">("ByTime"); - const onChangeFilter = (sort: "ByTime" | "ByPopularity") => { + const [sortBy, setSortBy] = useState<'ByTime' | 'ByPopularity'>('ByTime'); + const onChangeFilter = (sort: 'ByTime' | 'ByPopularity') => { setSortBy(sort); }; // const { commentFilter, onChangeCommentFilter } = useCommentFilter(); - const { comments, isError, isLoading, mutateHate, mutateLike, mutateComment } = - useCommentServices(Number(postId), sortBy, "drinks"); + const { + comments, + isError, + isLoading, + mutateHate, + mutateLike, + mutateComment, + } = useCommentServices(Number(postId), sortBy, 'drinks'); - const [commentForm, setCommentForm] = useState(""); + const [commentForm, setCommentForm] = useState(''); const onChangeCommentForm = (e: React.ChangeEvent) => { setCommentForm(e.target.value); }; @@ -35,14 +41,18 @@ function DrinkCommentContainer() { { onSuccess: () => { queryClient.invalidateQueries([queryKeys.DETAIL_COMMENT_LIST]); - setCommentForm(""); + setCommentForm(''); }, }, ); }; - if (isError) {return
에러
;} - if (!comments) {return
데이터 없음
;} + if (isError) { + return
에러
; + } + if (!comments) { + return
데이터 없음
; + } const commentList = comments.pages.flatMap((page) => page.content); diff --git a/apps/jurumarble/src/app/drink-info/[id]/components/DrinkInfoContainer.tsx b/apps/jurumarble/src/app/drink-info/[id]/components/DrinkInfoContainer.tsx index f93b26c4..86d0eeb3 100644 --- a/apps/jurumarble/src/app/drink-info/[id]/components/DrinkInfoContainer.tsx +++ b/apps/jurumarble/src/app/drink-info/[id]/components/DrinkInfoContainer.tsx @@ -1,14 +1,18 @@ -import Chip from "components/Chip"; -import Loading from "components/Loading"; -import VoteHeader from "components/VoteHeader"; -import { Button } from "components/button"; -import Image from "next/image"; -import { useParams, useRouter } from "next/navigation"; -import useDrinkStampService from "services/useDrinkStampService"; -import { SvgHeaderSearch, SvgIcPrevious, SvgStamp } from "src/assets/icons/components"; -import styled, { css, useTheme } from "styled-components"; - -import useDrinkLoadService from "../services/useDrinkLoadService"; +import Chip from 'components/Chip'; +import Loading from 'components/Loading'; +import VoteHeader from 'components/VoteHeader'; +import { Button } from 'components/button'; +import Image from 'next/image'; +import { useParams, useRouter } from 'next/navigation'; +import useDrinkStampService from 'services/useDrinkStampService'; +import { + SvgHeaderSearch, + SvgIcPrevious, + SvgStamp, +} from 'src/assets/icons/components'; +import styled, { css, useTheme } from 'styled-components'; + +import useDrinkLoadService from '../services/useDrinkLoadService'; const DrinkInfoContainer = () => { const router = useRouter(); @@ -71,9 +75,9 @@ const DrinkInfoContainer = () => { width={370} height={320} style={{ - width: "100%", - height: "100%", - objectFit: "cover", + width: '100%', + height: '100%', + objectFit: 'cover', }} /> @@ -81,7 +85,9 @@ const DrinkInfoContainer = () => { {manufactureAddress.slice(0, 2)} - {enjoyCount}명이 즐겼어요 + + {enjoyCount}명이 즐겼어요 + postDrinkEnjoy(Number(id))} diff --git a/apps/jurumarble/src/app/drink-info/[id]/page.tsx b/apps/jurumarble/src/app/drink-info/[id]/page.tsx index 20ba3a3a..622cac59 100644 --- a/apps/jurumarble/src/app/drink-info/[id]/page.tsx +++ b/apps/jurumarble/src/app/drink-info/[id]/page.tsx @@ -1,9 +1,13 @@ -"use client"; +'use client'; -import dynamic from "next/dynamic"; +import dynamic from 'next/dynamic'; -const DynamicDrinkInfoContainer = dynamic(() => import("./components/DrinkInfoContainer")); -const DynamicDrinkCommentContainer = dynamic(() => import("./components/DrinkCommentContainer")); +const DynamicDrinkInfoContainer = dynamic( + () => import('./components/DrinkInfoContainer'), +); +const DynamicDrinkCommentContainer = dynamic( + () => import('./components/DrinkCommentContainer'), +); function DrinkInfoPage() { return ( diff --git a/apps/jurumarble/src/app/drink-info/[id]/services/useDrinkLoadService.ts b/apps/jurumarble/src/app/drink-info/[id]/services/useDrinkLoadService.ts index 3e9dc69b..225df315 100644 --- a/apps/jurumarble/src/app/drink-info/[id]/services/useDrinkLoadService.ts +++ b/apps/jurumarble/src/app/drink-info/[id]/services/useDrinkLoadService.ts @@ -1,6 +1,6 @@ -import { useQuery } from "@tanstack/react-query"; -import { getDrinkInfo } from "lib/apis/drink"; -import { reactQueryKeys } from "lib/queryKeys"; +import { useQuery } from '@tanstack/react-query'; +import { getDrinkInfo } from 'lib/apis/drink'; +import { reactQueryKeys } from 'lib/queryKeys'; export default function useDrinkLoadService(id: number) { const { data, isLoading, isError } = useQuery( diff --git a/apps/jurumarble/src/app/layout.tsx b/apps/jurumarble/src/app/layout.tsx index 9a899d7e..6efc5d88 100644 --- a/apps/jurumarble/src/app/layout.tsx +++ b/apps/jurumarble/src/app/layout.tsx @@ -1,28 +1,32 @@ -import type { Metadata } from "next"; +import type { Metadata } from 'next'; -import AuthProcess from "components/AuthProcess"; -import { PageLayout } from "components/layouts"; -import ReactQueryProvider from "lib/ReactQueryProvider"; -import { pretandard } from "lib/localFont"; -import StyledComponents from "lib/styles/StyledComponents"; -import { ToastContainer } from "react-toastify"; -import "react-toastify/dist/ReactToastify.css"; -import { injectStyle } from "react-toastify/dist/inject-style"; -import "swiper/css"; -import "swiper/css/navigation"; -import "swiper/css/pagination"; -import "lib/styles/global.css"; +import AuthProcess from 'components/AuthProcess'; +import { PageLayout } from 'components/layouts'; +import ReactQueryProvider from 'lib/ReactQueryProvider'; +import { pretandard } from 'lib/localFont'; +import StyledComponents from 'lib/styles/StyledComponents'; +import { ToastContainer } from 'react-toastify'; +import 'react-toastify/dist/ReactToastify.css'; +import { injectStyle } from 'react-toastify/dist/inject-style'; +import 'swiper/css'; +import 'swiper/css/navigation'; +import 'swiper/css/pagination'; +import 'lib/styles/global.css'; export const metadata: Metadata = { - title: "주루마블", - description: "주루마블", + title: '주루마블', + description: '주루마블', }; -if (typeof window !== "undefined") { +if (typeof window !== 'undefined') { injectStyle(); } -export default function RootLayout({ children }: { children: React.ReactNode }) { +export default function RootLayout({ + children, +}: { + children: React.ReactNode; +}) { return ( @@ -33,7 +37,11 @@ export default function RootLayout({ children }: { children: React.ReactNode })
{children} - + diff --git a/apps/jurumarble/src/app/login/components/LoginPageHeader.tsx b/apps/jurumarble/src/app/login/components/LoginPageHeader.tsx index 998fe4ac..14568364 100644 --- a/apps/jurumarble/src/app/login/components/LoginPageHeader.tsx +++ b/apps/jurumarble/src/app/login/components/LoginPageHeader.tsx @@ -1,8 +1,8 @@ -import VoteHeader from "components/VoteHeader"; -import { Button } from "components/button"; -import { useRouter } from "next/navigation"; -import { SvgIcPrevious } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import VoteHeader from 'components/VoteHeader'; +import { Button } from 'components/button'; +import { useRouter } from 'next/navigation'; +import { SvgIcPrevious } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; function LoginPageHeader() { const router = useRouter(); diff --git a/apps/jurumarble/src/app/login/components/LoginSection.tsx b/apps/jurumarble/src/app/login/components/LoginSection.tsx index f78bf7fd..a948a013 100644 --- a/apps/jurumarble/src/app/login/components/LoginSection.tsx +++ b/apps/jurumarble/src/app/login/components/LoginSection.tsx @@ -3,11 +3,15 @@ import { KAKAO_LOGIN_REDIRECT_URL, NAVER_CLIENT_ID, NAVER_LOGIN_REDIRECT_URL, -} from "lib/constants"; -import { transitions } from "lib/styles"; -import Link from "next/link"; -import { SvgIcThunder, SvgKakaoIcon, SvgNaverIcon } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +} from 'lib/constants'; +import { transitions } from 'lib/styles'; +import Link from 'next/link'; +import { + SvgIcThunder, + SvgKakaoIcon, + SvgNaverIcon, +} from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; const socialLoginLink = { KAKAO: `https://kauth.kakao.com/oauth/authorize?client_id=${KAKAO_CLIENT_ID}&redirect_uri=${KAKAO_LOGIN_REDIRECT_URL}&response_type=code`, @@ -58,7 +62,7 @@ const BalloonText = styled.div` animation: ${transitions.delaypopInFromBottom} 1.2s ease-in-out; ::after { - content: ""; + content: ''; position: absolute; top: 100%; left: 47%; diff --git a/apps/jurumarble/src/app/login/components/TermsOfUseSection.tsx b/apps/jurumarble/src/app/login/components/TermsOfUseSection.tsx index 866205ad..9fe17427 100644 --- a/apps/jurumarble/src/app/login/components/TermsOfUseSection.tsx +++ b/apps/jurumarble/src/app/login/components/TermsOfUseSection.tsx @@ -1,5 +1,5 @@ -import { transitions } from "lib/styles"; -import styled, { css } from "styled-components"; +import { transitions } from 'lib/styles'; +import styled, { css } from 'styled-components'; function TermsOfUseSection() { return ( @@ -9,7 +9,8 @@ function TermsOfUseSection() {
계속하면 당사의 서비스 약관에 동의하고,
- 개인정보 보호정책을(를) 읽어 당사의 데이터 수집, 사용, + 개인정보 보호정책을(를) 읽어 당사의 데이터 수집, + 사용,
공유 방법을 확인했음을 인정하는 것입니다. diff --git a/apps/jurumarble/src/app/login/components/WelcomeSection.tsx b/apps/jurumarble/src/app/login/components/WelcomeSection.tsx index 14221f62..a67fff11 100644 --- a/apps/jurumarble/src/app/login/components/WelcomeSection.tsx +++ b/apps/jurumarble/src/app/login/components/WelcomeSection.tsx @@ -1,8 +1,8 @@ -import { transitions } from "lib/styles"; -import Image from "next/image"; -import { DrinkImage } from "public/images"; -import { SvgLogo } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import { transitions } from 'lib/styles'; +import Image from 'next/image'; +import { DrinkImage } from 'public/images'; +import { SvgLogo } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; function WelcomeSection() { return ( diff --git a/apps/jurumarble/src/app/login/kakao-login-process/page.tsx b/apps/jurumarble/src/app/login/kakao-login-process/page.tsx index 60d66d98..458a637e 100644 --- a/apps/jurumarble/src/app/login/kakao-login-process/page.tsx +++ b/apps/jurumarble/src/app/login/kakao-login-process/page.tsx @@ -1,18 +1,18 @@ -"use client"; +'use client'; -import { useEffect } from "react"; +import { useEffect } from 'react'; -import Path from "lib/Path"; -import { kakaoLoginAPI } from "lib/apis/auth"; -import { KAKAO_LOGIN_REDIRECT_URL } from "lib/constants"; -import userStorage from "lib/utils/userStorage"; -import { useRouter, useSearchParams } from "next/navigation"; +import Path from 'lib/Path'; +import { kakaoLoginAPI } from 'lib/apis/auth'; +import { KAKAO_LOGIN_REDIRECT_URL } from 'lib/constants'; +import userStorage from 'lib/utils/userStorage'; +import { useRouter, useSearchParams } from 'next/navigation'; function KakaoLoginProcess() { const router = useRouter(); const searchParams = useSearchParams(); - const code = searchParams.get("code") ?? ""; + const code = searchParams.get('code') ?? ''; useEffect(() => { if (code) { @@ -26,12 +26,12 @@ function KakaoLoginProcess() { const { accessToken, newUser } = await kakaoLoginAPI({ code, redirectUrl: KAKAO_LOGIN_REDIRECT_URL, - providerType: "KAKAO", + providerType: 'KAKAO', }); userStorage.set({ accessToken }); newUser ? router.push(Path.REGISTER_PAGE) : router.push(Path.MAIN_PAGE); } catch (error) { - alert("에러가 발생하였습니다."); + alert('에러가 발생하였습니다.'); } }; diff --git a/apps/jurumarble/src/app/login/naver-login-process/page.tsx b/apps/jurumarble/src/app/login/naver-login-process/page.tsx index b5b72c0e..d9252477 100644 --- a/apps/jurumarble/src/app/login/naver-login-process/page.tsx +++ b/apps/jurumarble/src/app/login/naver-login-process/page.tsx @@ -1,17 +1,17 @@ -"use client"; +'use client'; -import { useEffect } from "react"; +import { useEffect } from 'react'; -import Path from "lib/Path"; -import { naverLoginAPI } from "lib/apis/auth"; -import userStorage from "lib/utils/userStorage"; -import { useRouter, useSearchParams } from "next/navigation"; +import Path from 'lib/Path'; +import { naverLoginAPI } from 'lib/apis/auth'; +import userStorage from 'lib/utils/userStorage'; +import { useRouter, useSearchParams } from 'next/navigation'; function NaverLoginProcess() { const router = useRouter(); const searchParams = useSearchParams(); - const code = searchParams.get("code") ?? ""; + const code = searchParams.get('code') ?? ''; /** * @TODO 더 좋은 방법 없을까 @@ -26,11 +26,14 @@ function NaverLoginProcess() { const naverLogin = async () => { try { - const { accessToken, newUser } = await naverLoginAPI({ code, state: "test" }); + const { accessToken, newUser } = await naverLoginAPI({ + code, + state: 'test', + }); userStorage.set({ accessToken }); newUser ? router.push(Path.REGISTER_PAGE) : router.push(Path.MAIN_PAGE); } catch (error) { - alert("에러가 발생하였습니다."); + alert('에러가 발생하였습니다.'); } }; return <>; diff --git a/apps/jurumarble/src/app/login/page.tsx b/apps/jurumarble/src/app/login/page.tsx index 29487e01..70f1a39c 100644 --- a/apps/jurumarble/src/app/login/page.tsx +++ b/apps/jurumarble/src/app/login/page.tsx @@ -1,10 +1,10 @@ -"use client"; +'use client'; -import styled from "styled-components"; +import styled from 'styled-components'; -import LoginPageHeader from "./components/LoginPageHeader"; -import LoginSection from "./components/LoginSection"; -import WelcomeSection from "./components/WelcomeSection"; +import LoginPageHeader from './components/LoginPageHeader'; +import LoginSection from './components/LoginSection'; +import WelcomeSection from './components/WelcomeSection'; function LoginPage() { return ( diff --git a/apps/jurumarble/src/app/main/components/Banner.tsx b/apps/jurumarble/src/app/main/components/Banner.tsx index 8be5f573..291d92de 100644 --- a/apps/jurumarble/src/app/main/components/Banner.tsx +++ b/apps/jurumarble/src/app/main/components/Banner.tsx @@ -1,13 +1,18 @@ -"use client"; +'use client'; -import Image from "next/image"; -import { MainBannerImage } from "public/images"; -import styled, { css } from "styled-components"; +import Image from 'next/image'; +import { MainBannerImage } from 'public/images'; +import styled, { css } from 'styled-components'; function Banner() { return ( - 배너 + 배너 여행의 즐거움을 우리술과 함께 레벨업! diff --git a/apps/jurumarble/src/app/main/components/Carousel.tsx b/apps/jurumarble/src/app/main/components/Carousel.tsx index f5db792b..411a8af1 100644 --- a/apps/jurumarble/src/app/main/components/Carousel.tsx +++ b/apps/jurumarble/src/app/main/components/Carousel.tsx @@ -1,14 +1,13 @@ -import { useRef } from "react"; - -import { ContentSwiper } from "@monorepo/ui"; -import Path from "lib/Path"; -import { GetHotDrinkResponse } from "lib/apis/drink"; -import Image from "next/image"; -import { useRouter } from "next/navigation"; -import { SvgIcPrevious, SvgNext } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; -import SwiperCore, { Autoplay } from "swiper"; +import { useRef } from 'react'; +import { ContentSwiper } from '@monorepo/ui'; +import Path from 'lib/Path'; +import { GetHotDrinkResponse } from 'lib/apis/drink'; +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +import { SvgIcPrevious, SvgNext } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; +import SwiperCore, { Autoplay } from 'swiper'; interface Props { hotDrinkList: GetHotDrinkResponse[]; @@ -33,11 +32,11 @@ function Carousel({ hotDrinkList }: Props) { data={hotDrinkList} handler={ref} slideProps={{ - width: "292px", + width: '292px', lazy: true, }} swiperProps={{ - slidesPerView: "auto", + slidesPerView: 'auto', spaceBetween: 5, loop: true, autoplay: { @@ -46,11 +45,19 @@ function Carousel({ hotDrinkList }: Props) { modules: [Autoplay], }} renderItem={({ drinkId, image, name, manufactureAddress }, index) => ( - router.push(`${Path.DRINK_INFO_PAGE}/${drinkId}`)}> + router.push(`${Path.DRINK_INFO_PAGE}/${drinkId}`)} + > {index + 1} - 전통주 + 전통주 {name} diff --git a/apps/jurumarble/src/app/main/components/HotDrinkContainer.tsx b/apps/jurumarble/src/app/main/components/HotDrinkContainer.tsx index dca232d4..3acf4eeb 100644 --- a/apps/jurumarble/src/app/main/components/HotDrinkContainer.tsx +++ b/apps/jurumarble/src/app/main/components/HotDrinkContainer.tsx @@ -1,9 +1,9 @@ -"use client"; +'use client'; -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; -import Carousel from "./Carousel"; -import useGetHotDrinkListService from "../services/useGetHotDrinkListService"; +import Carousel from './Carousel'; +import useGetHotDrinkListService from '../services/useGetHotDrinkListService'; function HotDrinkContainer() { const { data: hotDrinkList } = useGetHotDrinkListService(); diff --git a/apps/jurumarble/src/app/main/components/HotDrinkVoteContainer.tsx b/apps/jurumarble/src/app/main/components/HotDrinkVoteContainer.tsx index 52120dc1..3e401673 100644 --- a/apps/jurumarble/src/app/main/components/HotDrinkVoteContainer.tsx +++ b/apps/jurumarble/src/app/main/components/HotDrinkVoteContainer.tsx @@ -1,11 +1,11 @@ -"use client"; +'use client'; -import Path from "lib/Path"; -import Image from "next/image"; -import { useRouter } from "next/navigation"; -import styled, { css } from "styled-components"; +import Path from 'lib/Path'; +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +import styled, { css } from 'styled-components'; -import { useGetHotDrinkVoteService } from "../services/useGetHotDrinkVoteService"; +import { useGetHotDrinkVoteService } from '../services/useGetHotDrinkVoteService'; function HotDrinkVoteContainer() { const router = useRouter(); @@ -25,16 +25,28 @@ function HotDrinkVoteContainer() { 투표

{nowTime}시, 지금 가장 인기있는 우리술 투표에요.

- router.push(`${Path.VOTE_DETAIL_PAGE}/${voteId}`)}> + router.push(`${Path.VOTE_DETAIL_PAGE}/${voteId}`)} + > - A 이미지 + A 이미지 - B 이미지 + B 이미지 @@ -76,7 +88,8 @@ const PopularVoteCard = styled.div` overflow: auto; border: 1px solid ${theme.colors.bg_02}; border-radius: 16px; - box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08), 0px 10px 25px 0px rgba(0, 0, 0, 0.06); + box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08), + 0px 10px 25px 0px rgba(0, 0, 0, 0.06); cursor: pointer; `} `; @@ -92,7 +105,9 @@ const VoteImages = styled.div` const DrinkImageBox = styled.div<{ color: string }>` ${({ theme, color }) => css` - background-color: ${color === "orange" ? theme.colors.sub_01 : theme.colors.sub_02}; + background-color: ${color === 'orange' + ? theme.colors.sub_01 + : theme.colors.sub_02}; display: flex; justify-content: center; align-items: center; diff --git a/apps/jurumarble/src/app/main/components/SearchInputWrapper.tsx b/apps/jurumarble/src/app/main/components/SearchInputWrapper.tsx index 398ee2e0..6e9d84b1 100644 --- a/apps/jurumarble/src/app/main/components/SearchInputWrapper.tsx +++ b/apps/jurumarble/src/app/main/components/SearchInputWrapper.tsx @@ -1,12 +1,12 @@ -"use client"; +'use client'; -import { useRef } from "react"; +import { useRef } from 'react'; -import SearchInput from "components/SearchInput"; -import useInput from "hooks/useInput"; -import Path from "lib/Path"; -import { useRouter } from "next/navigation"; -import styled from "styled-components"; +import SearchInput from 'components/SearchInput'; +import useInput from 'hooks/useInput'; +import Path from 'lib/Path'; +import { useRouter } from 'next/navigation'; +import styled from 'styled-components'; const SearchInputWrapper = () => { const ref = useRef(null); diff --git a/apps/jurumarble/src/app/main/components/TodayDrinkRecommendation.tsx b/apps/jurumarble/src/app/main/components/TodayDrinkRecommendation.tsx index 6264d9b1..7eed61e1 100644 --- a/apps/jurumarble/src/app/main/components/TodayDrinkRecommendation.tsx +++ b/apps/jurumarble/src/app/main/components/TodayDrinkRecommendation.tsx @@ -1,11 +1,11 @@ -"use client"; +'use client'; -import { useEffect, useRef, useState } from "react"; +import { useEffect, useRef, useState } from 'react'; -import { SvgStamp } from "src/assets/icons/components"; -import styled, { css, useTheme } from "styled-components"; +import { SvgStamp } from 'src/assets/icons/components'; +import styled, { css, useTheme } from 'styled-components'; -import useGetDrinkRecommendationListService from "../services/useGetDrinkRecommendationListService"; +import useGetDrinkRecommendationListService from '../services/useGetDrinkRecommendationListService'; const SLIDE_MOVE_COUNT = 1; const ORIGINAL_IMAGE_LENGTH = 10; @@ -42,7 +42,9 @@ function TodayDrinkRecommendation() { setIsAnimation(true); }, 600); } - slideRef.current.style.transform = `translateY(-${MOVE_DISTANCE * (currentSlide - 1)}px)`; + slideRef.current.style.transform = `translateY(-${ + MOVE_DISTANCE * (currentSlide - 1) + }px)`; }, [currentSlide]); useEffect(() => { @@ -85,7 +87,8 @@ const Slider = styled.div<{ isAnimation: boolean }>` height: 18px; transition: transform 0.5s ease-in-out; gap: 2px; - ${({ isAnimation }) => isAnimation && `transform: translateY(-${MOVE_DISTANCE}px);`} + ${({ isAnimation }) => + isAnimation && `transform: translateY(-${MOVE_DISTANCE}px);`} `; const H3 = styled.h3` diff --git a/apps/jurumarble/src/app/main/containers/HydratedDrinkVoteContainer.tsx b/apps/jurumarble/src/app/main/containers/HydratedDrinkVoteContainer.tsx index 15eefbc7..fdb5456d 100644 --- a/apps/jurumarble/src/app/main/containers/HydratedDrinkVoteContainer.tsx +++ b/apps/jurumarble/src/app/main/containers/HydratedDrinkVoteContainer.tsx @@ -1,10 +1,10 @@ -import { dehydrate } from "@tanstack/query-core"; -import { getHotDrinkVote } from "lib/apis/vote/getHotDrinkVote"; -import getQueryClient from "src/modules/getQueryClient"; -import HydrateOnClient from "src/modules/hydrateOnClient"; +import { dehydrate } from '@tanstack/query-core'; +import { getHotDrinkVote } from 'lib/apis/vote/getHotDrinkVote'; +import getQueryClient from 'src/modules/getQueryClient'; +import HydrateOnClient from 'src/modules/hydrateOnClient'; -import HotDrinkVoteContainer from "../components/HotDrinkVoteContainer"; -import { hotDrinkVoteQueryKey } from "../services/queryKey"; +import HotDrinkVoteContainer from '../components/HotDrinkVoteContainer'; +import { hotDrinkVoteQueryKey } from '../services/queryKey'; export const HydratedDrinkVoteContainer = async () => { const qc = getQueryClient(); diff --git a/apps/jurumarble/src/app/main/containers/HydratedHotDrinkContainer.tsx b/apps/jurumarble/src/app/main/containers/HydratedHotDrinkContainer.tsx index ef7360ae..7f094c4d 100644 --- a/apps/jurumarble/src/app/main/containers/HydratedHotDrinkContainer.tsx +++ b/apps/jurumarble/src/app/main/containers/HydratedHotDrinkContainer.tsx @@ -1,10 +1,10 @@ -import { dehydrate } from "@tanstack/query-core"; -import { getHotDrinkList } from "lib/apis/vote/getHotDrinkList"; -import getQueryClient from "src/modules/getQueryClient"; -import HydrateOnClient from "src/modules/hydrateOnClient"; +import { dehydrate } from '@tanstack/query-core'; +import { getHotDrinkList } from 'lib/apis/vote/getHotDrinkList'; +import getQueryClient from 'src/modules/getQueryClient'; +import HydrateOnClient from 'src/modules/hydrateOnClient'; -import HotDrinkContainer from "../components/HotDrinkContainer"; -import { hotDrinkListQueryKey } from "../services/queryKey"; +import HotDrinkContainer from '../components/HotDrinkContainer'; +import { hotDrinkListQueryKey } from '../services/queryKey'; export const HydratedHotDrinkContainer = async () => { const qc = getQueryClient(); diff --git a/apps/jurumarble/src/app/main/services/queryKey.ts b/apps/jurumarble/src/app/main/services/queryKey.ts index 24c5e757..ef8f4f6e 100644 --- a/apps/jurumarble/src/app/main/services/queryKey.ts +++ b/apps/jurumarble/src/app/main/services/queryKey.ts @@ -1,2 +1,2 @@ -export const hotDrinkVoteQueryKey = "hotDrinkVote"; -export const hotDrinkListQueryKey = "searchDrinkList"; +export const hotDrinkVoteQueryKey = 'hotDrinkVote'; +export const hotDrinkListQueryKey = 'searchDrinkList'; diff --git a/apps/jurumarble/src/app/main/services/useGetDrinkRecommendationListService.ts b/apps/jurumarble/src/app/main/services/useGetDrinkRecommendationListService.ts index 3c962bf1..d65069c3 100644 --- a/apps/jurumarble/src/app/main/services/useGetDrinkRecommendationListService.ts +++ b/apps/jurumarble/src/app/main/services/useGetDrinkRecommendationListService.ts @@ -1,16 +1,15 @@ -import { useQuery } from "@tanstack/react-query"; -import { getDrinkRecommendationListAPI } from "lib/apis/drink"; -import { queryKeys } from "lib/queryKeys"; +import { useQuery } from '@tanstack/react-query'; +import { getDrinkRecommendationListAPI } from 'lib/apis/drink'; +import { queryKeys } from 'lib/queryKeys'; type GetDrinkRecommendationListProps = Exclude< Parameters[0], undefined >; -const getDrinkRecommendationListQueryKey = (params: GetDrinkRecommendationListProps) => [ - queryKeys.TODAY_DRINK_RECOMMENDATION, - { ...params }, -]; +const getDrinkRecommendationListQueryKey = ( + params: GetDrinkRecommendationListProps, +) => [queryKeys.TODAY_DRINK_RECOMMENDATION, { ...params }]; export default function useGetDrinkRecommendationListService( params: GetDrinkRecommendationListProps, diff --git a/apps/jurumarble/src/app/main/services/useGetHotDrinkListService.ts b/apps/jurumarble/src/app/main/services/useGetHotDrinkListService.ts index 9a550444..b8fb9c62 100644 --- a/apps/jurumarble/src/app/main/services/useGetHotDrinkListService.ts +++ b/apps/jurumarble/src/app/main/services/useGetHotDrinkListService.ts @@ -1,7 +1,7 @@ -import { useQuery } from "@tanstack/react-query"; -import { getHotDrinkList } from "lib/apis/drink"; +import { useQuery } from '@tanstack/react-query'; +import { getHotDrinkList } from 'lib/apis/drink'; -import { hotDrinkListQueryKey } from "./queryKey"; +import { hotDrinkListQueryKey } from './queryKey'; export default function useGetHotDrinkListService() { const { data } = useQuery([hotDrinkListQueryKey], getHotDrinkList); diff --git a/apps/jurumarble/src/app/main/services/useGetHotDrinkVoteService.ts b/apps/jurumarble/src/app/main/services/useGetHotDrinkVoteService.ts index 67ce934a..314f28a5 100644 --- a/apps/jurumarble/src/app/main/services/useGetHotDrinkVoteService.ts +++ b/apps/jurumarble/src/app/main/services/useGetHotDrinkVoteService.ts @@ -1,7 +1,7 @@ -import { useQuery } from "@tanstack/react-query"; -import { getHotDrinkVote } from "lib/apis/vote/getHotDrinkVote"; +import { useQuery } from '@tanstack/react-query'; +import { getHotDrinkVote } from 'lib/apis/vote/getHotDrinkVote'; -import { hotDrinkVoteQueryKey } from "./queryKey"; +import { hotDrinkVoteQueryKey } from './queryKey'; export const useGetHotDrinkVoteService = () => { const { data: hotDrinkVote } = useQuery({ diff --git a/apps/jurumarble/src/app/map/components/MapContainer.tsx b/apps/jurumarble/src/app/map/components/MapContainer.tsx index 3c22b95b..ebf9a67c 100644 --- a/apps/jurumarble/src/app/map/components/MapContainer.tsx +++ b/apps/jurumarble/src/app/map/components/MapContainer.tsx @@ -1,20 +1,20 @@ -"use client"; +'use client'; -import { useEffect, useRef, useState } from "react"; +import { useEffect, useRef, useState } from 'react'; -import { useToggle } from "@react-hookz/web"; -import DrinkItem from "app/stamp/components/DrinkItem"; -import Loading from "components/Loading"; -import { Button } from "components/button"; -import Image from "next/image"; -import { ExImg1 } from "public/images"; -import { Map, MapMarker } from "react-kakao-maps-sdk"; -import SvgIcMyLocationFloating from "src/assets/icons/ic_my_location_floating.svg"; -import styled from "styled-components"; +import { useToggle } from '@react-hookz/web'; +import DrinkItem from 'app/stamp/components/DrinkItem'; +import Loading from 'components/Loading'; +import { Button } from 'components/button'; +import Image from 'next/image'; +import { ExImg1 } from 'public/images'; +import { Map, MapMarker } from 'react-kakao-maps-sdk'; +import SvgIcMyLocationFloating from 'src/assets/icons/ic_my_location_floating.svg'; +import styled from 'styled-components'; -import RegionBottomSheet from "./RegionBottomsheet"; -import { useGeoLocation } from "../hooks/useGeoLocation"; -import useDrinksMapService from "../services/useDrinksMapService"; +import RegionBottomSheet from './RegionBottomsheet'; +import { useGeoLocation } from '../hooks/useGeoLocation'; +import useDrinksMapService from '../services/useDrinksMapService'; const MapContainer = () => { const [delayRender, setDelayRender] = useState(true); @@ -40,7 +40,7 @@ const MapContainer = () => { setTimeout(() => { toggleMap(); }, 600); - // eslint-disable-next-line react-hooks/exhaustive-deps + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const { drinksList } = useDrinksMapService({ @@ -126,11 +126,11 @@ const MapContainer = () => {
-
+
{ - window.dispatchEvent(new Event("resize")); + window.dispatchEvent(new Event('resize')); }} onLoad={() => { mapRef.current?.getNode(); @@ -139,8 +139,8 @@ const MapContainer = () => { isPanto={state.isPanto} style={{ // 지도의 크기 - width: "100%", - height: "375px", + width: '100%', + height: '375px', }} ref={mapRef} level={state.level} // 지도의 확대 레벨 @@ -154,7 +154,7 @@ const MapContainer = () => { lng: location.longitude, }} image={{ - src: "https://elasticbeanstalk-ap-northeast-2-319210348301.s3.ap-northeast-2.amazonaws.com/static/f0bc29bd-c5a8-46ad-9012-e5401f0a1636pin.svg", + src: 'https://elasticbeanstalk-ap-northeast-2-319210348301.s3.ap-northeast-2.amazonaws.com/static/f0bc29bd-c5a8-46ad-9012-e5401f0a1636pin.svg', size: { width: 29, height: 42, @@ -173,7 +173,12 @@ const MapContainer = () => { /> ))} - 내위치 켜기 + 내위치 켜기
@@ -185,21 +190,26 @@ const MapContainer = () => { /> */} - {drinksList.map(({ drinkId, name, latitude, longitude, image, manufacturer }, index) => ( - { - setChangeMapCenter(latitude, longitude); - }} - selectedDrinkList={[]} - /> - ))} + {drinksList.map( + ( + { drinkId, name, latitude, longitude, image, manufacturer }, + index, + ) => ( + { + setChangeMapCenter(latitude, longitude); + }} + selectedDrinkList={[]} + /> + ), + )} void; } -const RegionBottomSheet = ({ on, onToggleDrinkSearchModal, setChangeMapCenter }: Props) => { +const RegionBottomSheet = ({ + on, + onToggleDrinkSearchModal, + setChangeMapCenter, +}: Props) => { if (!on) { return null; } @@ -25,12 +29,12 @@ const RegionBottomSheet = ({ on, onToggleDrinkSearchModal, setChangeMapCenter }: - 지역을 선택해주세요{" "} + 지역을 선택해주세요{' '} {" "} + />{' '} {REGION_LIST.map(({ label, lat, long }) => ( diff --git a/apps/jurumarble/src/app/map/components/RegionSmallSelect.tsx b/apps/jurumarble/src/app/map/components/RegionSmallSelect.tsx index b4495107..7c123b75 100644 --- a/apps/jurumarble/src/app/map/components/RegionSmallSelect.tsx +++ b/apps/jurumarble/src/app/map/components/RegionSmallSelect.tsx @@ -1,7 +1,7 @@ -import { useToggle } from "@monorepo/hooks"; -import { Select } from "components/selectBox"; -import SvgIcExpandMore from "src/assets/icons/components/IcExpandMore"; -import styled, { css } from "styled-components"; +import { useToggle } from '@monorepo/hooks'; +import { Select } from 'components/selectBox'; +import SvgIcExpandMore from 'src/assets/icons/components/IcExpandMore'; +import styled, { css } from 'styled-components'; interface Props { defaultOption: string; @@ -9,7 +9,11 @@ interface Props { options: { value: string; label: string }[]; } -function RegionSmallSelect({ defaultOption, onChangeSortOption, options }: Props) { +function RegionSmallSelect({ + defaultOption, + onChangeSortOption, + options, +}: Props) { const [isOpen, onToggleOpen] = useToggle(); return ( @@ -39,7 +43,7 @@ const SelectStyled = styled.span<{ isOpen: boolean }>` padding: 10px 12px; } svg { - ${isOpen && "transform: rotateX( 180deg )"} + ${isOpen && 'transform: rotateX( 180deg )'} } #select-list { width: 100px; diff --git a/apps/jurumarble/src/app/map/hooks/useGeoLocation.ts b/apps/jurumarble/src/app/map/hooks/useGeoLocation.ts index 47047477..a04ad1e7 100644 --- a/apps/jurumarble/src/app/map/hooks/useGeoLocation.ts +++ b/apps/jurumarble/src/app/map/hooks/useGeoLocation.ts @@ -1,6 +1,6 @@ -import { useEffect, useState } from "react"; +import { useEffect, useState } from 'react'; -import { useToggle } from "@react-hookz/web"; +import { useToggle } from '@react-hookz/web'; interface Location { latitude: number; @@ -16,7 +16,7 @@ export const useGeoLocation = (options = {}) => { longitude: 0, }); // 에러 메세지 저장 - const [error, setError] = useState(""); + const [error, setError] = useState(''); // Geolocation의 `getCurrentPosition` 메소드에 대한 성공 callback 핸들러 const handleSuccess = (pos: GeolocationPosition) => { @@ -34,18 +34,20 @@ export const useGeoLocation = (options = {}) => { }; useEffect(() => { - if (!onLocation) {return;} + if (!onLocation) { + return; + } const { geolocation } = navigator; // 사용된 브라우저에서 지리적 위치(Geolocation)가 정의되지 않은 경우 오류로 처리합니다. if (!geolocation) { - setError("Geolocation is not supported."); + setError('Geolocation is not supported.'); return; } // Geolocation API 호출 geolocation.getCurrentPosition(handleSuccess, handleError, options); - // eslint-disable-next-line react-hooks/exhaustive-deps + // eslint-disable-next-line react-hooks/exhaustive-deps }, [options]); return { location, error, toggleOnLocation, onLocation }; diff --git a/apps/jurumarble/src/app/map/page.tsx b/apps/jurumarble/src/app/map/page.tsx index 5738c275..c8bdbc62 100644 --- a/apps/jurumarble/src/app/map/page.tsx +++ b/apps/jurumarble/src/app/map/page.tsx @@ -1,10 +1,10 @@ -"use client"; +'use client'; -import BottomBar from "components/BottomBar"; -import Header from "components/Header"; -import { KAKAO_MAP_API_KEY } from "lib/constants"; -import dynamic from "next/dynamic"; -import Script from "next/script"; +import BottomBar from 'components/BottomBar'; +import Header from 'components/Header'; +import { KAKAO_MAP_API_KEY } from 'lib/constants'; +import dynamic from 'next/dynamic'; +import Script from 'next/script'; declare global { interface Window { @@ -13,7 +13,7 @@ declare global { } } -const DynamicMapContainer = dynamic(() => import("./components/MapContainer")); +const DynamicMapContainer = dynamic(() => import('./components/MapContainer')); const MapPage = () => { return ( diff --git a/apps/jurumarble/src/app/map/services/useDrinksMapService.ts b/apps/jurumarble/src/app/map/services/useDrinksMapService.ts index 5b69ba14..d7ec2a83 100644 --- a/apps/jurumarble/src/app/map/services/useDrinksMapService.ts +++ b/apps/jurumarble/src/app/map/services/useDrinksMapService.ts @@ -1,7 +1,7 @@ -import { useInfiniteScroll } from "@monorepo/hooks"; -import { useInfiniteQuery } from "@tanstack/react-query"; -import { getDrinksMap } from "lib/apis/drink"; -import { reactQueryKeys } from "lib/queryKeys"; +import { useInfiniteScroll } from '@monorepo/hooks'; +import { useInfiniteQuery } from '@tanstack/react-query'; +import { getDrinksMap } from 'lib/apis/drink'; +import { reactQueryKeys } from 'lib/queryKeys'; export default function useDrinksMapService(params: { startX: number; @@ -17,7 +17,9 @@ export default function useDrinksMapService(params: { ({ pageParam }) => getDrinksMap({ ...params, page: pageParam?.page || 0 }), { getNextPageParam: ({ last, number }) => { - if (last) {return undefined;} + if (last) { + return undefined; + } return { page: number + 1, }; diff --git a/apps/jurumarble/src/app/my/components/ChipContainer.tsx b/apps/jurumarble/src/app/my/components/ChipContainer.tsx index ac244b90..c542281d 100644 --- a/apps/jurumarble/src/app/my/components/ChipContainer.tsx +++ b/apps/jurumarble/src/app/my/components/ChipContainer.tsx @@ -1,8 +1,8 @@ -import { UseMutateFunction } from "@tanstack/react-query"; -import Chip from "components/Chip"; -import SvgIcBookmark from "src/assets/icons/components/IcBookmark"; -import SvgIcBookmarkActive from "src/assets/icons/components/IcBookmarkActive"; -import styled from "styled-components"; +import { UseMutateFunction } from '@tanstack/react-query'; +import Chip from 'components/Chip'; +import SvgIcBookmark from 'src/assets/icons/components/IcBookmark'; +import SvgIcBookmarkActive from 'src/assets/icons/components/IcBookmarkActive'; +import styled from 'styled-components'; interface Props { title: string; @@ -12,7 +12,13 @@ interface Props { isBookmark: boolean; } -const ChipContainer = ({ date, title, region, mutateBookMark, isBookmark }: Props) => { +const ChipContainer = ({ + date, + title, + region, + mutateBookMark, + isBookmark, +}: Props) => { return ( <> diff --git a/apps/jurumarble/src/app/my/components/UseInfoContainer.tsx b/apps/jurumarble/src/app/my/components/UseInfoContainer.tsx index 777ab9d1..e3ebb9d6 100644 --- a/apps/jurumarble/src/app/my/components/UseInfoContainer.tsx +++ b/apps/jurumarble/src/app/my/components/UseInfoContainer.tsx @@ -1,16 +1,18 @@ -"use client"; +'use client'; -import Path from "lib/Path"; -import Image from "next/image"; -import Link from "next/link"; -import { DrinkImage } from "public/images"; -import useGetUserInfo from "services/useGetUserInfo"; -import styled, { css } from "styled-components"; +import Path from 'lib/Path'; +import Image from 'next/image'; +import Link from 'next/link'; +import { DrinkImage } from 'public/images'; +import useGetUserInfo from 'services/useGetUserInfo'; +import styled, { css } from 'styled-components'; function UserInfoContainer() { const { userInfo } = useGetUserInfo(); - if (!userInfo) {return <>;} + if (!userInfo) { + return <>; + } const { gender, nickname, yearOfBirth, mbti, imageUrl } = userInfo; @@ -26,12 +28,12 @@ function UserInfoContainer() { src={imageUrl || DrinkImage} width={88} height={88} - style={{ borderRadius: "8px" }} + style={{ borderRadius: '8px' }} /> - {gender === "MALE" ? "남" : "여"} + {gender === 'MALE' ? '남' : '여'} {ageRange}대 diff --git a/apps/jurumarble/src/app/my/components/VoteCountContainer.tsx b/apps/jurumarble/src/app/my/components/VoteCountContainer.tsx index 6fe6b968..46baebde 100644 --- a/apps/jurumarble/src/app/my/components/VoteCountContainer.tsx +++ b/apps/jurumarble/src/app/my/components/VoteCountContainer.tsx @@ -1,9 +1,9 @@ -"use client"; +'use client'; -import { TAB_LIST, TabList } from "src/types/my"; -import styled, { css } from "styled-components"; +import { TAB_LIST, TabList } from 'src/types/my'; +import styled, { css } from 'styled-components'; -import useGetTheNumberOfMyVoteService from "../services/useGetCountedVoteService"; +import useGetTheNumberOfMyVoteService from '../services/useGetCountedVoteService'; interface Props { selectedTab: string; @@ -12,11 +12,12 @@ interface Props { function VoteCountContainer({ selectedTab, onClickSelectedTab }: Props) { const theNumberOfMyVote = useGetTheNumberOfMyVoteService(); - const { writtenVoteCnt, joinedVoteCnt, bookmarkedVoteCnt } = theNumberOfMyVote ?? { - writtenVoteCnt: 0, - joinedVoteCnt: 0, - bookmarkedVoteCnt: 0, - }; + const { writtenVoteCnt, joinedVoteCnt, bookmarkedVoteCnt } = + theNumberOfMyVote ?? { + writtenVoteCnt: 0, + joinedVoteCnt: 0, + bookmarkedVoteCnt: 0, + }; return ( @@ -28,11 +29,11 @@ function VoteCountContainer({ selectedTab, onClickSelectedTab }: Props) { isSelected={id === selectedTab} > - {id === "created-vote" + {id === 'created-vote' ? writtenVoteCnt - : id === "paticipated-vote" + : id === 'paticipated-vote' ? joinedVoteCnt - : id === "bookmarked-vote" + : id === 'bookmarked-vote' ? bookmarkedVoteCnt : 0} diff --git a/apps/jurumarble/src/app/my/components/VoteDescription.tsx b/apps/jurumarble/src/app/my/components/VoteDescription.tsx index 8c000f9e..181d183b 100644 --- a/apps/jurumarble/src/app/my/components/VoteDescription.tsx +++ b/apps/jurumarble/src/app/my/components/VoteDescription.tsx @@ -1,6 +1,6 @@ -import AorBMark from "components/AorBMark"; -import Image, { StaticImageData } from "next/image"; -import styled, { css } from "styled-components"; +import AorBMark from 'components/AorBMark'; +import Image, { StaticImageData } from 'next/image'; +import styled, { css } from 'styled-components'; interface Props { imageA: string | StaticImageData; @@ -18,8 +18,8 @@ function VoteDescription({ imageA, imageB }: Props) { alt="A이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> ) : ( @@ -34,8 +34,8 @@ function VoteDescription({ imageA, imageB }: Props) { alt="B이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> ) : ( diff --git a/apps/jurumarble/src/app/my/components/VoteItem.tsx b/apps/jurumarble/src/app/my/components/VoteItem.tsx index 7360178b..d33c0074 100644 --- a/apps/jurumarble/src/app/my/components/VoteItem.tsx +++ b/apps/jurumarble/src/app/my/components/VoteItem.tsx @@ -1,13 +1,13 @@ -import Path from "lib/Path"; -import { useRouter } from "next/navigation"; -import useBookmarkService from "services/useBookmarkService"; -import { Content } from "src/types/vote"; -import styled, { css } from "styled-components"; +import Path from 'lib/Path'; +import { useRouter } from 'next/navigation'; +import useBookmarkService from 'services/useBookmarkService'; +import { Content } from 'src/types/vote'; +import styled, { css } from 'styled-components'; -import ChipContainer from "./ChipContainer"; -import VoteDescription from "./VoteDescription"; +import ChipContainer from './ChipContainer'; +import VoteDescription from './VoteDescription'; -type Props = Pick; +type Props = Pick; function VoteItem({ voteId, region, title, imageA, imageB }: Props) { const { isBookmark, mutateBookMark } = useBookmarkService(voteId); @@ -36,7 +36,8 @@ const Container = styled.button` background-color: ${theme.colors.white}; border-radius: 16px; border: 1px solid ${({ theme }) => theme.colors.line_02}; - box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08), 0px 10px 25px 0px rgba(0, 0, 0, 0.06); + box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.08), + 0px 10px 25px 0px rgba(0, 0, 0, 0.06); padding: 20px; `}; `; diff --git a/apps/jurumarble/src/app/my/components/VoteListContainer.tsx b/apps/jurumarble/src/app/my/components/VoteListContainer.tsx index 32a89811..8c4ab593 100644 --- a/apps/jurumarble/src/app/my/components/VoteListContainer.tsx +++ b/apps/jurumarble/src/app/my/components/VoteListContainer.tsx @@ -1,24 +1,24 @@ -"use client"; +'use client'; -import { useCreateQueryString } from "hooks/useCreateQueryString"; -import { usePathname, useRouter, useSearchParams } from "next/navigation"; -import { TabList } from "src/types/my"; -import styled, { css } from "styled-components"; +import { useCreateQueryString } from 'hooks/useCreateQueryString'; +import { usePathname, useRouter, useSearchParams } from 'next/navigation'; +import { TabList } from 'src/types/my'; +import styled, { css } from 'styled-components'; -import VoteCountContainer from "./VoteCountContainer"; -import VoteItem from "./VoteItem"; -import useGetMyBookmarkedVoteListService from "../services/useGetMyBookmarkedVoteListService"; -import useGetMyCreatedVoteListService from "../services/useGetMyCreatedVoteListService"; -import useGetMyParticipatedVoteListService from "../services/useGetMyParticipatedVoteListService"; +import VoteCountContainer from './VoteCountContainer'; +import VoteItem from './VoteItem'; +import useGetMyBookmarkedVoteListService from '../services/useGetMyBookmarkedVoteListService'; +import useGetMyCreatedVoteListService from '../services/useGetMyCreatedVoteListService'; +import useGetMyParticipatedVoteListService from '../services/useGetMyParticipatedVoteListService'; /** * @TODO 타입 수정 필요 */ const MY_VOTE_LIST_SERVICE = { - "created-vote": useGetMyCreatedVoteListService, - "bookmarked-vote": useGetMyBookmarkedVoteListService, - "paticipated-vote": useGetMyParticipatedVoteListService, + 'created-vote': useGetMyCreatedVoteListService, + 'bookmarked-vote': useGetMyBookmarkedVoteListService, + 'paticipated-vote': useGetMyParticipatedVoteListService, }; function VoteListContainer() { @@ -28,9 +28,10 @@ function VoteListContainer() { const createQueryString = useCreateQueryString(searchParams); - const selectedTab = (searchParams.get("selectedTab") as TabList) ?? "created-vote"; + const selectedTab = + (searchParams.get('selectedTab') as TabList) ?? 'created-vote'; const onClickSelectedTab = (tab: TabList) => { - router.replace(`${pathname }?${ createQueryString("selectedTab", tab)}`); + router.replace(`${pathname}?${createQueryString('selectedTab', tab)}`); }; const { myVoteList, subscribe } = MY_VOTE_LIST_SERVICE[selectedTab]({ @@ -40,7 +41,10 @@ function VoteListContainer() { return ( <> - + {myVoteList.map(({ voteId, region, title, imageA, imageB }) => ( diff --git a/apps/jurumarble/src/app/my/edit/components/ImageUpload.tsx b/apps/jurumarble/src/app/my/edit/components/ImageUpload.tsx index 4f2b1312..9cdde90b 100644 --- a/apps/jurumarble/src/app/my/edit/components/ImageUpload.tsx +++ b/apps/jurumarble/src/app/my/edit/components/ImageUpload.tsx @@ -1,6 +1,6 @@ -import Image from "next/image"; -import { SvgIcCamera } from "src/assets/icons/components"; -import styled, { css, useTheme } from "styled-components"; +import Image from 'next/image'; +import { SvgIcCamera } from 'src/assets/icons/components'; +import styled, { css, useTheme } from 'styled-components'; interface Props { imageUrl: string; @@ -18,7 +18,7 @@ function ImageUpload({ imageUrl, onUploadImage }: Props) { src={imageUrl} width={88} height={88} - style={{ borderRadius: "8px" }} + style={{ borderRadius: '8px' }} /> ) : ( @@ -27,7 +27,12 @@ function ImageUpload({ imageUrl, onUploadImage }: Props) { )} - + ); } diff --git a/apps/jurumarble/src/app/my/edit/components/SelectDrinkCapacity.tsx b/apps/jurumarble/src/app/my/edit/components/SelectDrinkCapacity.tsx index f47e7fd2..d5d7645f 100644 --- a/apps/jurumarble/src/app/my/edit/components/SelectDrinkCapacity.tsx +++ b/apps/jurumarble/src/app/my/edit/components/SelectDrinkCapacity.tsx @@ -1,12 +1,10 @@ -import { useId } from "react"; - -import { useOutsideClick, useToggle } from "@monorepo/hooks"; -import { ALCOHOL_LEVEL_LIST } from "lib/constants"; -import depths from "lib/styles/depths"; -import { SvgArrowDown } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; - +import { useId } from 'react'; +import { useOutsideClick, useToggle } from '@monorepo/hooks'; +import { ALCOHOL_LEVEL_LIST } from 'lib/constants'; +import depths from 'lib/styles/depths'; +import { SvgArrowDown } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; interface Props { alcoholLimit: string; @@ -77,7 +75,7 @@ const SelectStyled = styled.div<{ isOpen: boolean }>` color: ${theme.colors.black_01}; } svg { - ${isOpen && "transform: rotateX( 180deg )"} + ${isOpen && 'transform: rotateX( 180deg )'} } `} `; @@ -99,7 +97,8 @@ const Ul = styled.ul` margin: 32px 0; background: ${({ theme }) => theme.colors.white}; border: 1px solid ${({ theme }) => theme.colors.line_01}; - box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.04), 2px 2px 20px 0px rgba(0, 0, 0, 0.06); + box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.04), + 2px 2px 20px 0px rgba(0, 0, 0, 0.06); position: absolute; top: 22px; width: 100%; diff --git a/apps/jurumarble/src/app/my/edit/components/SelectMBTI.tsx b/apps/jurumarble/src/app/my/edit/components/SelectMBTI.tsx index 939d854e..13b9c973 100644 --- a/apps/jurumarble/src/app/my/edit/components/SelectMBTI.tsx +++ b/apps/jurumarble/src/app/my/edit/components/SelectMBTI.tsx @@ -1,9 +1,9 @@ -import { useId } from "react"; +import { useId } from 'react'; -import { useOutsideClick, useToggle } from "@monorepo/hooks"; -import { MBTI_LIST } from "lib/constants"; -import { SvgArrowDown } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import { useOutsideClick, useToggle } from '@monorepo/hooks'; +import { MBTI_LIST } from 'lib/constants'; +import { SvgArrowDown } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; interface Props { MBTI: string; @@ -73,7 +73,7 @@ const SelectStyled = styled.div<{ isOpen: boolean }>` color: ${theme.colors.black_01}; } svg { - ${isOpen && "transform: rotateX( 180deg )"} + ${isOpen && 'transform: rotateX( 180deg )'} } `} `; @@ -95,7 +95,8 @@ const Ul = styled.ul` margin: 32px 0; background: ${({ theme }) => theme.colors.white}; border: 1px solid ${({ theme }) => theme.colors.line_01}; - box-shadow: 4px 8px 28px 0px rgba(0, 0, 0, 0.08), 0px 4px 12px 0px rgba(0, 0, 0, 0.16); + box-shadow: 4px 8px 28px 0px rgba(0, 0, 0, 0.08), + 0px 4px 12px 0px rgba(0, 0, 0, 0.16); position: absolute; bottom: 24px; width: 100%; diff --git a/apps/jurumarble/src/app/my/edit/components/UserInfoEditContainer.tsx b/apps/jurumarble/src/app/my/edit/components/UserInfoEditContainer.tsx index 13796152..e39c4fa2 100644 --- a/apps/jurumarble/src/app/my/edit/components/UserInfoEditContainer.tsx +++ b/apps/jurumarble/src/app/my/edit/components/UserInfoEditContainer.tsx @@ -1,18 +1,19 @@ -import { useToggle } from "@monorepo/hooks"; -import { Button } from "components/button"; -import { GENDER } from "lib/constants"; -import useGetUserInfo from "services/useGetUserInfo"; -import styled, { css } from "styled-components"; +import { useToggle } from '@monorepo/hooks'; +import { Button } from 'components/button'; +import { GENDER } from 'lib/constants'; +import useGetUserInfo from 'services/useGetUserInfo'; +import styled, { css } from 'styled-components'; -import ImageUpload from "./ImageUpload"; -import SelectDrinkCapacity from "./SelectDrinkCapacity"; -import SelectMBTI from "./SelectMBTI"; -import WithdrawalModal from "./WithdrawalModal"; -import useEditProfileService from "../services/useEditProfileService"; +import ImageUpload from './ImageUpload'; +import SelectDrinkCapacity from './SelectDrinkCapacity'; +import SelectMBTI from './SelectMBTI'; +import WithdrawalModal from './WithdrawalModal'; +import useEditProfileService from '../services/useEditProfileService'; function UserInfoEditContainer() { const { userInfo } = useGetUserInfo(); - const { gender, yearOfBirth, alcoholLimit, imageUrl, mbti, nickname } = userInfo!; + const { gender, yearOfBirth, alcoholLimit, imageUrl, mbti, nickname } = + userInfo!; const { onUploadImage, @@ -38,7 +39,11 @@ function UserInfoEditContainer() {

성별

- +

출생년도

@@ -49,7 +54,11 @@ function UserInfoEditContainer() { MBTI 수정시 2개월간 바꿀 수 없습니다. - + 회원탈퇴 diff --git a/apps/jurumarble/src/app/my/edit/components/WithdrawalModal.tsx b/apps/jurumarble/src/app/my/edit/components/WithdrawalModal.tsx index 8960c516..be863ce7 100644 --- a/apps/jurumarble/src/app/my/edit/components/WithdrawalModal.tsx +++ b/apps/jurumarble/src/app/my/edit/components/WithdrawalModal.tsx @@ -1,8 +1,8 @@ -import { useToggle } from "@monorepo/hooks"; -import VoteHeader from "components/VoteHeader"; -import { Button, ModalTemplate } from "components/index"; -import { SvgIcX } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import { useToggle } from '@monorepo/hooks'; +import VoteHeader from 'components/VoteHeader'; +import { Button, ModalTemplate } from 'components/index'; +import { SvgIcX } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; interface Props { onToggleWithdrawalModal: () => void; @@ -12,7 +12,11 @@ interface Props { function WithdrawalModal({ onToggleWithdrawalModal, deleteUser }: Props) { const [isChecked, onToggleIsChecked] = useToggle(true); return ( - + @@ -27,23 +31,25 @@ function WithdrawalModal({ onToggleWithdrawalModal, deleteUser }: Props) {
- 1. 회원 정보 및 서비스 이용기록은 즉시 삭제되며, 삭제된 데이터는 복구되지 않습니다. + 1. 회원 정보 및 서비스 이용기록은 즉시 삭제되며, 삭제된 데이터는 + 복구되지 않습니다. • 필요한 데이터는 미리 백업을 해주세요.
- 2. 주루마블에 올린 게시글, 댓글, 북마크 등의 콘텐츠는 탈퇴 시 자동으로 삭제되지 않고 - 그대로 남아있습니다. + 2. 주루마블에 올린 게시글, 댓글, 북마크 등의 콘텐츠는 탈퇴 시 자동으로 + 삭제되지 않고 그대로 남아있습니다. • 삭제를 원하는 콘텐츠가 있다면 반드시 탈퇴 전 삭제하시기 바랍니다. - • 탈퇴 후에는 본인 여부를 확인하기 어려워 콘텐츠를 임의로 삭제해드릴 수 없습니다.{" "} + • 탈퇴 후에는 본인 여부를 확인하기 어려워 콘텐츠를 임의로 삭제해드릴 + 수 없습니다.{' '}
- 위 내용을 모두 확인하였으며, 이에 - 동의합니다.* + 위 내용을 모두 + 확인하였으며, 이에 동의합니다.* - diff --git a/apps/jurumarble/src/app/vote/[id]/components/RestaurantItem.tsx b/apps/jurumarble/src/app/vote/[id]/components/RestaurantItem.tsx index 16205afb..72b925cc 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/RestaurantItem.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/RestaurantItem.tsx @@ -1,6 +1,6 @@ -import { RestaurantInfo } from "lib/apis/restaurant"; -import Image from "next/image"; -import styled, { css } from "styled-components"; +import { RestaurantInfo } from 'lib/apis/restaurant'; +import Image from 'next/image'; +import styled, { css } from 'styled-components'; interface Props { onClickSelectedRestaurant: (restaurantId: RestaurantInfo) => void; diff --git a/apps/jurumarble/src/app/vote/[id]/components/SearchInput.tsx b/apps/jurumarble/src/app/vote/[id]/components/SearchInput.tsx index 4bf0d01a..a6cb6e36 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/SearchInput.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/SearchInput.tsx @@ -1,15 +1,18 @@ -"use client"; +'use client'; -import { FormEvent, forwardRef, MouseEvent } from "react"; +import { FormEvent, forwardRef, MouseEvent } from 'react'; -import { Button } from "components/button"; -import { Input } from "components/input"; -import SvgIcSearch from "src/assets/icons/components/IcSearch"; -import styled, { css, useTheme } from "styled-components"; +import { Button } from 'components/button'; +import { Input } from 'components/input'; +import SvgIcSearch from 'src/assets/icons/components/IcSearch'; +import styled, { css, useTheme } from 'styled-components'; -interface Props extends Omit, "width"> { +interface Props + extends Omit, 'width'> { placeholder?: string; - eventHandler?: (e: FormEvent | MouseEvent) => void; + eventHandler?: ( + e: FormEvent | MouseEvent, + ) => void; onChangeSearchText: (keyword: string) => void; } diff --git a/apps/jurumarble/src/app/vote/[id]/components/SearchRestaurantModal.tsx b/apps/jurumarble/src/app/vote/[id]/components/SearchRestaurantModal.tsx index 37d656fd..571683cb 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/SearchRestaurantModal.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/SearchRestaurantModal.tsx @@ -1,20 +1,20 @@ -"use client"; +'use client'; -import { useState } from "react"; +import { useState } from 'react'; -import VoteHeader from "components/VoteHeader"; -import { Button, ModalTemplate } from "components/index"; -import useInput from "hooks/useInput"; -import { RestaurantInfo } from "lib/apis/restaurant"; -import { transitions } from "lib/styles"; -import Image from "next/image"; -import SvgIcX from "src/assets/icons/components/IcX"; -import styled, { css, DefaultTheme } from "styled-components"; +import VoteHeader from 'components/VoteHeader'; +import { Button, ModalTemplate } from 'components/index'; +import useInput from 'hooks/useInput'; +import { RestaurantInfo } from 'lib/apis/restaurant'; +import { transitions } from 'lib/styles'; +import Image from 'next/image'; +import SvgIcX from 'src/assets/icons/components/IcX'; +import styled, { css, DefaultTheme } from 'styled-components'; -import RestaurantItem from "./RestaurantItem"; -import SearchInput from "./SearchInput"; -import useRestaurantImageService from "../services/useRestaurantImageService"; -import useRestaurantService from "../services/useRestaurantService"; +import RestaurantItem from './RestaurantItem'; +import SearchInput from './SearchInput'; +import useRestaurantImageService from '../services/useRestaurantImageService'; +import useRestaurantService from '../services/useRestaurantService'; interface Props { commentId: number; @@ -22,47 +22,61 @@ interface Props { onToggleSearchRestaurantModal: () => void; } -function SearchRestaurantModal({ commentId, postId, onToggleSearchRestaurantModal }: Props) { - const [selectedRestaurant, setSelectedRestaurant] = useState(null); +function SearchRestaurantModal({ + commentId, + postId, + onToggleSearchRestaurantModal, +}: Props) { + const [selectedRestaurant, setSelectedRestaurant] = + useState(null); const onClickSelectedRestaurant = (restaurantInfo: RestaurantInfo) => { setSelectedRestaurant((prev) => restaurantInfo.contentId === prev?.contentId ? null : restaurantInfo, ); }; - const { debouncedValue: searchText, onChange: onChangeSearchText } = useInput({ - initialValue: "", - useDebounce: true, - debounceTimeout: 500, - }); + const { debouncedValue: searchText, onChange: onChangeSearchText } = useInput( + { + initialValue: '', + useDebounce: true, + debounceTimeout: 500, + }, + ); const { restaurantList, subscribe } = useRestaurantService({ commentId, - commentType: "votes", + commentType: 'votes', keyword: searchText, page: 1, - region: "ALL", + region: 'ALL', typeId: postId, }); - const [selectedImage, setSelectedImage] = useState(""); + const [selectedImage, setSelectedImage] = useState(''); const onClickSelectedImage = (imageUrl: string) => { - selectedImage === imageUrl ? setSelectedImage("") : setSelectedImage(imageUrl); + selectedImage === imageUrl + ? setSelectedImage('') + : setSelectedImage(imageUrl); }; - const { restaurantImageList, postRestaurantImage } = useRestaurantImageService({ - commentType: "votes", - typeId: postId, - commentId, - contentId: selectedRestaurant?.contentId ?? "", - }); + const { restaurantImageList, postRestaurantImage } = + useRestaurantImageService({ + commentType: 'votes', + typeId: postId, + commentId, + contentId: selectedRestaurant?.contentId ?? '', + }); if (!restaurantList) { return null; } return ( - + @@ -70,7 +84,9 @@ function SearchRestaurantModal({ commentId, postId, onToggleSearchRestaurantModa } > - {selectedRestaurant ? "음식점 검색" : "이미지 선택"} + + {selectedRestaurant ? '음식점 검색' : '이미지 선택'} + {selectedRestaurant ? ( @@ -85,9 +101,9 @@ function SearchRestaurantModal({ commentId, postId, onToggleSearchRestaurantModa width="107px" height="60px" borderRadius="4px" - onClick={() => onClickSelectedImage("nonSelect")} + onClick={() => onClickSelectedImage('nonSelect')} > - + 선택 안함 {restaurantImageList && @@ -97,7 +113,9 @@ function SearchRestaurantModal({ commentId, postId, onToggleSearchRestaurantModa name={restaurantImage} onClick={() => onClickSelectedImage(restaurantImage)} > - + 음식 이미지 @@ -117,7 +135,7 @@ function SearchRestaurantModal({ commentId, postId, onToggleSearchRestaurantModa variant="primary" onClick={() => { postRestaurantImage({ - commentType: "votes", + commentType: 'votes', typeId: postId, commentId, restaurantName: selectedRestaurant.restaurantName, diff --git a/apps/jurumarble/src/app/vote/[id]/components/VoteAnalyzeBar.tsx b/apps/jurumarble/src/app/vote/[id]/components/VoteAnalyzeBar.tsx index f838c3fa..467f8aab 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/VoteAnalyzeBar.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/VoteAnalyzeBar.tsx @@ -1,4 +1,4 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { percentageA: number; @@ -7,7 +7,12 @@ interface Props { totalCountB: number; } -function VoteAnalyzeBar({ percentageA, percentageB, totalCountA, totalCountB }: Props) { +function VoteAnalyzeBar({ + percentageA, + percentageB, + totalCountA, + totalCountB, +}: Props) { const isSelectedA = percentageA > percentageB ? true : false; return ( <> diff --git a/apps/jurumarble/src/app/vote/[id]/components/VoteDescription.tsx b/apps/jurumarble/src/app/vote/[id]/components/VoteDescription.tsx index 6c509044..0b547b79 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/VoteDescription.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/VoteDescription.tsx @@ -1,16 +1,16 @@ -import AorBMark from "components/AorBMark"; -import Path from "lib/Path"; -import { media } from "lib/styles"; -import depths from "lib/styles/depths"; -import Image from "next/image"; -import { useRouter } from "next/navigation"; -import { ExImg1 } from "public/images"; -import { SvgIcCheck } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import AorBMark from 'components/AorBMark'; +import Path from 'lib/Path'; +import { media } from 'lib/styles'; +import depths from 'lib/styles/depths'; +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +import { ExImg1 } from 'public/images'; +import { SvgIcCheck } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; -type AorB = "A" | "B"; -type ActiveType = "active" | "inactive" | null; -type Direction = "left" | "right"; +type AorB = 'A' | 'B'; +type ActiveType = 'active' | 'inactive' | null; +type Direction = 'left' | 'right'; // const safeImageA = useMemo(() => { // if (!imageA || imageA === "string") return EmptyAImg; @@ -21,7 +21,8 @@ type Direction = "left" | "right"; // return imageB; // }, [imageB]); -const getSafeImage = (image: string) => (image.includes("http") ? image : ExImg1); +const getSafeImage = (image: string) => + image.includes('http') ? image : ExImg1; interface Props { titleA: string; @@ -57,14 +58,14 @@ function VoteDescription({ const router = useRouter(); const getAB = (direction: Direction) => { - return direction === "left" ? "A" : "B"; + return direction === 'left' ? 'A' : 'B'; }; const activeValue = (direction: Direction): ActiveType => { if (!select) { return null; } - return `${select === getAB(direction) ? "" : "in"}active`; + return `${select === getAB(direction) ? '' : 'in'}active`; }; const onClickVote = (chooz: AorB) => { @@ -75,13 +76,13 @@ function VoteDescription({ }; const onRouteDrinkInfo = () => { - if (voteType !== "DRINK") { + if (voteType !== 'DRINK') { return; } - if (select === "A") { + if (select === 'A') { router.push(`${Path.DRINK_INFO_PAGE}/${drinkAId}`); } - if (select === "B") { + if (select === 'B') { router.push(`${Path.DRINK_INFO_PAGE}/${drinkBId}`); } }; @@ -89,7 +90,10 @@ function VoteDescription({ return ( - onClickVote("A")}> + onClickVote('A')} + >
{titleA} {percentageA}% {totalCountA}명 - {voteType === "DRINK" && 술정보 보기   {">"}} + {voteType === 'DRINK' && ( + 술정보 보기   {'>'} + )}
A
- onClickVote("B")}> + onClickVote('B')} + >
{titleB} {percentageB}% {totalCountB}명 - {voteType === "DRINK" && 술정보 보기  {">"}} + {voteType === 'DRINK' && ( + 술정보 보기  {'>'} + )}
B
- - {select === "A" && } + + {select === 'A' && } {titleA} - - {select === "B" && } + + {select === 'B' && } {titleB} @@ -231,7 +242,7 @@ const LeftVote = styled.div<{ selected: ActiveType }>` border: 2px solid #ff4a16; ${({ selected }) => - selected === "active" && + selected === 'active' && css` width: 100%; display: flex; diff --git a/apps/jurumarble/src/app/vote/[id]/components/VoteSmallSelectFilter.tsx b/apps/jurumarble/src/app/vote/[id]/components/VoteSmallSelectFilter.tsx index ce167219..d5537984 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/VoteSmallSelectFilter.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/VoteSmallSelectFilter.tsx @@ -1,7 +1,7 @@ -import { useToggle } from "@monorepo/hooks"; -import { Select } from "components/selectBox"; -import SvgIcExpandMore from "src/assets/icons/components/IcExpandMore"; -import styled, { css } from "styled-components"; +import { useToggle } from '@monorepo/hooks'; +import { Select } from 'components/selectBox'; +import SvgIcExpandMore from 'src/assets/icons/components/IcExpandMore'; +import styled, { css } from 'styled-components'; interface Props { defaultOption: string; @@ -9,7 +9,11 @@ interface Props { options: { value: string; label: string }[]; } -function VoteSmallSelectFilter({ defaultOption, onChangeSortOption, options }: Props) { +function VoteSmallSelectFilter({ + defaultOption, + onChangeSortOption, + options, +}: Props) { const [isOpen, onToggleOpen] = useToggle(); return ( @@ -39,7 +43,7 @@ const SelectStyled = styled.span<{ isOpen: boolean }>` padding: 10px 12px; } svg { - ${isOpen && "transform: rotateX( 180deg )"} + ${isOpen && 'transform: rotateX( 180deg )'} } `} #select-list { diff --git a/apps/jurumarble/src/app/vote/[id]/components/VoteWriterBox.tsx b/apps/jurumarble/src/app/vote/[id]/components/VoteWriterBox.tsx index 21af3e1a..cf8aef4f 100644 --- a/apps/jurumarble/src/app/vote/[id]/components/VoteWriterBox.tsx +++ b/apps/jurumarble/src/app/vote/[id]/components/VoteWriterBox.tsx @@ -1,8 +1,8 @@ -import { convertAge } from "lib/utils/formatUserInfo"; -import Image, { StaticImageData } from "next/image"; -import styled, { css } from "styled-components"; +import { convertAge } from 'lib/utils/formatUserInfo'; +import Image, { StaticImageData } from 'next/image'; +import styled, { css } from 'styled-components'; -import AlcholLevelTag from "./AlcholLevelTag"; +import AlcholLevelTag from './AlcholLevelTag'; interface Props { writer: { @@ -25,14 +25,14 @@ function VoteWriterBox({ writer }: Props) { width={48} height={48} style={{ - borderRadius: "8px", + borderRadius: '8px', }} /> {(userAge || userGender || userAge || alchol || userMbti) && ( - {userGender === "MALE" ? "남" : "여"} + {userGender === 'MALE' ? '남' : '여'} {userAge && ( <> {convertAge(userAge)} diff --git a/apps/jurumarble/src/app/vote/[id]/page.tsx b/apps/jurumarble/src/app/vote/[id]/page.tsx index 793e34fb..1601fe90 100644 --- a/apps/jurumarble/src/app/vote/[id]/page.tsx +++ b/apps/jurumarble/src/app/vote/[id]/page.tsx @@ -1,39 +1,51 @@ -"use client"; +'use client'; -import { useMemo, useState } from "react"; +import { useMemo, useState } from 'react'; -import Loading from "components/Loading"; +import Loading from 'components/Loading'; import { VOTE_AGE_FILTER_LIST, VOTE_ALCOHOL_FILTER_LIST, VOTE_GENDER_FILTER_LIST, VOTE_MBTI_LIST, -} from "lib/constants"; -import dynamic from "next/dynamic"; -import { useParams } from "next/navigation"; -import { DrinkCapacityHigh, DrinkCapacityLow, DrinkCapacityMedium } from "public/images"; -import useBookmarkService from "services/useBookmarkService"; -import styled, { css } from "styled-components"; - -import VoteSmallSelectFilter from "./components/VoteSmallSelectFilter"; -import VoteWriterBox from "./components/VoteWriterBox"; -import useExecuteVoteService from "./services/useExecuteVoteService"; -import useFilteredStatisticsService from "./services/useFilterStatisticsService"; -import useVoteLoadService from "./services/useVoteLoadService"; - -const DynamicChipContainer = dynamic(() => import("./components/ChipContainer")); -const DynamicVoteDescription = dynamic(() => import("./components/VoteDescription")); -const DynamicCommentContainer = dynamic(() => import("./components/CommentContainer")); -const DynamicVoteAnalyzeBar = dynamic(() => import("./components/VoteAnalyzeBar")); +} from 'lib/constants'; +import dynamic from 'next/dynamic'; +import { useParams } from 'next/navigation'; +import { + DrinkCapacityHigh, + DrinkCapacityLow, + DrinkCapacityMedium, +} from 'public/images'; +import useBookmarkService from 'services/useBookmarkService'; +import styled, { css } from 'styled-components'; + +import VoteSmallSelectFilter from './components/VoteSmallSelectFilter'; +import VoteWriterBox from './components/VoteWriterBox'; +import useExecuteVoteService from './services/useExecuteVoteService'; +import useFilteredStatisticsService from './services/useFilterStatisticsService'; +import useVoteLoadService from './services/useVoteLoadService'; + +const DynamicChipContainer = dynamic( + () => import('./components/ChipContainer'), +); +const DynamicVoteDescription = dynamic( + () => import('./components/VoteDescription'), +); +const DynamicCommentContainer = dynamic( + () => import('./components/CommentContainer'), +); +const DynamicVoteAnalyzeBar = dynamic( + () => import('./components/VoteAnalyzeBar'), +); function Detail() { const params = useParams(); const [filter, setFilter] = useState({ - age: "", - mbti: "", - gender: "", - alcohol: "", + age: '', + mbti: '', + gender: '', + alcohol: '', }); const onChangeFilter = (filterKey: string, value: string) => { @@ -50,7 +62,7 @@ function Detail() { const { mutateBookMark, isBookmark } = useBookmarkService(Number(postId)); const { mutate, select } = useExecuteVoteService(Number(data?.voteId)); - const onMutateVoting = (select: "A" | "B") => { + const onMutateVoting = (select: 'A' | 'B') => { mutate(select); }; const { voteStatisticsQuery } = useFilteredStatisticsService( @@ -66,9 +78,8 @@ function Detail() { isError: isStatisticsError, } = voteStatisticsQuery; - const { voteStatisticsQuery: originalStaticsQuery } = useFilteredStatisticsService( - Number(postId), - ); + const { voteStatisticsQuery: originalStaticsQuery } = + useFilteredStatisticsService(Number(postId)); const { data: originalStatistics, isLoading: isOriginalStatisticsLoading, @@ -76,14 +87,24 @@ function Detail() { } = originalStaticsQuery; const EmptyImage = useMemo(() => { - if (data?.postedUserAlcoholLimit === "LOW") {return DrinkCapacityLow;} - if (data?.postedUserAlcoholLimit === "MEDIUM") {return DrinkCapacityMedium;} + if (data?.postedUserAlcoholLimit === 'LOW') { + return DrinkCapacityLow; + } + if (data?.postedUserAlcoholLimit === 'MEDIUM') { + return DrinkCapacityMedium; + } return DrinkCapacityHigh; }, [data?.postedUserAlcoholLimit]); - if (isLoading || isStatisticsLoading || isOriginalStatisticsLoading) {return ;} - if (isError || isStatisticsError || isOriginalStatisticsError) {return
에러
;} - if (!data || !statistics || !originalStatistics) {return
;} + if (isLoading || isStatisticsLoading || isOriginalStatisticsLoading) { + return ; + } + if (isError || isStatisticsError || isOriginalStatisticsError) { + return
에러
; + } + if (!data || !statistics || !originalStatistics) { + return
; + } const { detail, title, @@ -159,22 +180,22 @@ function Detail() { onChangeFilter("gender", id)} + onChangeSortOption={(id) => onChangeFilter('gender', id)} options={VOTE_GENDER_FILTER_LIST} /> onChangeFilter("age", id)} + onChangeSortOption={(id) => onChangeFilter('age', id)} options={VOTE_AGE_FILTER_LIST} /> onChangeFilter("mbti", id)} + onChangeSortOption={(id) => onChangeFilter('mbti', id)} options={VOTE_MBTI_LIST} /> onChangeFilter("alcohol", id)} + onChangeSortOption={(id) => onChangeFilter('alcohol', id)} options={VOTE_ALCOHOL_FILTER_LIST} /> diff --git a/apps/jurumarble/src/app/vote/[id]/services/useCommentDeleteService.ts b/apps/jurumarble/src/app/vote/[id]/services/useCommentDeleteService.ts index 6fec2a47..de05e019 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useCommentDeleteService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useCommentDeleteService.ts @@ -1,25 +1,28 @@ -import { useMutation, useQueryClient } from "@tanstack/react-query"; -import { deleteComment, putComment } from "lib/apis/comment"; -import { queryKeys } from "lib/queryKeys"; +import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { deleteComment, putComment } from 'lib/apis/comment'; +import { queryKeys } from 'lib/queryKeys'; export default function useCommentDeleteService( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', typeId: number, commentId: number, ) { const queryClient = useQueryClient(); - const { mutate } = useMutation(() => deleteComment(commentType, typeId, commentId), { - onSuccess: () => { - alert("댓글이 삭제되었습니다."); - queryClient.invalidateQueries([queryKeys.DETAIL_COMMENT_LIST]); + const { mutate } = useMutation( + () => deleteComment(commentType, typeId, commentId), + { + onSuccess: () => { + alert('댓글이 삭제되었습니다.'); + queryClient.invalidateQueries([queryKeys.DETAIL_COMMENT_LIST]); + }, }, - }); + ); const { mutate: onPutComment } = useMutation( (comment: string) => putComment(commentType, typeId, commentId, comment), { onSuccess: () => { - alert("댓글이 수정되었습니다."); + alert('댓글이 수정되었습니다.'); queryClient.invalidateQueries([queryKeys.DETAIL_COMMENT_LIST]); }, }, diff --git a/apps/jurumarble/src/app/vote/[id]/services/useCommentReportService.ts b/apps/jurumarble/src/app/vote/[id]/services/useCommentReportService.ts index a7432e1c..2817f074 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useCommentReportService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useCommentReportService.ts @@ -1,8 +1,10 @@ -import { useMutation } from "@tanstack/react-query"; -import { postReportCommentAPI } from "lib/apis/report"; +import { useMutation } from '@tanstack/react-query'; +import { postReportCommentAPI } from 'lib/apis/report'; export default function useCommentReportService() { - const { mutate } = useMutation((voteId: number) => postReportCommentAPI(voteId)); + const { mutate } = useMutation((voteId: number) => + postReportCommentAPI(voteId), + ); return { mutate }; } diff --git a/apps/jurumarble/src/app/vote/[id]/services/useCommentServices.ts b/apps/jurumarble/src/app/vote/[id]/services/useCommentServices.ts index aa8c8293..16277d15 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useCommentServices.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useCommentServices.ts @@ -1,17 +1,21 @@ -import { useInfiniteQuery, useMutation, useQueryClient } from "@tanstack/react-query"; +import { + useInfiniteQuery, + useMutation, + useQueryClient, +} from '@tanstack/react-query'; import { getCommentById, postComment, PostCommentRequest, postHateComment, postLikeComment, -} from "lib/apis/comment"; -import { queryKeys, reactQueryKeys } from "lib/queryKeys"; +} from 'lib/apis/comment'; +import { queryKeys, reactQueryKeys } from 'lib/queryKeys'; export default function useCommentServices( voteId: number, - sortBy: "ByTime" | "ByPopularity", - commentType: "votes" | "drinks", + sortBy: 'ByTime' | 'ByPopularity', + commentType: 'votes' | 'drinks', paging?: { page: number; size: number; @@ -74,5 +78,13 @@ export default function useCommentServices( postComment(commentType, voteId, body), ); - return { comments, fetchNextPage, isError, isLoading, mutateComment, mutateHate, mutateLike }; + return { + comments, + fetchNextPage, + isError, + isLoading, + mutateComment, + mutateHate, + mutateLike, + }; } diff --git a/apps/jurumarble/src/app/vote/[id]/services/useExecuteVoteService.ts b/apps/jurumarble/src/app/vote/[id]/services/useExecuteVoteService.ts index cbaa3907..1bcdea24 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useExecuteVoteService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useExecuteVoteService.ts @@ -1,37 +1,48 @@ -import { useState } from "react"; +import { useState } from 'react'; -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; -import { AorB, getVotingCheck, postExecuteVote } from "lib/apis/vote"; -import { queryKeys, reactQueryKeys } from "lib/queryKeys"; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import { AorB, getVotingCheck, postExecuteVote } from 'lib/apis/vote'; +import { queryKeys, reactQueryKeys } from 'lib/queryKeys'; export default function useExecuteVoteService(voteId: number) { - const [select, setSelect] = useState<{ choice: AorB | null }>({ choice: null }); + const [select, setSelect] = useState<{ choice: AorB | null }>({ + choice: null, + }); const queryClient = useQueryClient(); - const { mutate } = useMutation((choice: "A" | "B") => postExecuteVote(voteId, { choice }), { - onSuccess: () => { - queryClient.invalidateQueries([queryKeys.VOTE_DETAIL]); - queryClient.invalidateQueries([queryKeys.VOTING_CHECK]); - queryClient.invalidateQueries([queryKeys.DETAIL_FILTERED_ANALYSIS]); - }, - onError: () => { - alert("로그인 후 진행해주세요."); + const { mutate } = useMutation( + (choice: 'A' | 'B') => postExecuteVote(voteId, { choice }), + { + onSuccess: () => { + queryClient.invalidateQueries([queryKeys.VOTE_DETAIL]); + queryClient.invalidateQueries([queryKeys.VOTING_CHECK]); + queryClient.invalidateQueries([queryKeys.DETAIL_FILTERED_ANALYSIS]); + }, + onError: () => { + alert('로그인 후 진행해주세요.'); + }, }, - }); + ); - const { data } = useQuery(reactQueryKeys.votingCheck(voteId), () => getVotingCheck(voteId), { - onSuccess: (data) => { - if (data.voted) { - setSelect({ choice: data.userChoice }); - } else {setSelect({ choice: null });} + const { data } = useQuery( + reactQueryKeys.votingCheck(voteId), + () => getVotingCheck(voteId), + { + onSuccess: (data) => { + if (data.voted) { + setSelect({ choice: data.userChoice }); + } else { + setSelect({ choice: null }); + } + }, + onError: () => { + setSelect({ choice: null }); + }, + enabled: !!voteId, + // @note 캐시를 사용하지 않는다. + cacheTime: 0, + staleTime: 0, }, - onError: () => { - setSelect({ choice: null }); - }, - enabled: !!voteId, - // @note 캐시를 사용하지 않는다. - cacheTime: 0, - staleTime: 0, - }); + ); return { mutate, select, data }; } diff --git a/apps/jurumarble/src/app/vote/[id]/services/useFilterStatisticsService.ts b/apps/jurumarble/src/app/vote/[id]/services/useFilterStatisticsService.ts index a4d97e1b..f072afd4 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useFilterStatisticsService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useFilterStatisticsService.ts @@ -1,6 +1,6 @@ -import { useQuery } from "@tanstack/react-query"; -import { getFilterStatisticsById } from "lib/apis/statistics"; -import { reactQueryKeys } from "lib/queryKeys"; +import { useQuery } from '@tanstack/react-query'; +import { getFilterStatisticsById } from 'lib/apis/statistics'; +import { reactQueryKeys } from 'lib/queryKeys'; export default function useFilteredStatisticsService( voteId: number, @@ -10,7 +10,13 @@ export default function useFilteredStatisticsService( alcoholLimit?: string, ) { const voteStatisticsQuery = useQuery( - reactQueryKeys.detailFilterdAnalysis(voteId, gender, mbti, age, alcoholLimit), + reactQueryKeys.detailFilterdAnalysis( + voteId, + gender, + mbti, + age, + alcoholLimit, + ), () => getFilterStatisticsById(voteId, gender, mbti, age, alcoholLimit), { enabled: !!voteId, diff --git a/apps/jurumarble/src/app/vote/[id]/services/useRestaurantImageService.ts b/apps/jurumarble/src/app/vote/[id]/services/useRestaurantImageService.ts index c5219089..f0c41389 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useRestaurantImageService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useRestaurantImageService.ts @@ -1,9 +1,18 @@ -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; -import { getRestaurantImageAPI, postRestaurantImageAPI } from "lib/apis/restaurant"; -import { queryKeys } from "lib/queryKeys"; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import { + getRestaurantImageAPI, + postRestaurantImageAPI, +} from 'lib/apis/restaurant'; +import { queryKeys } from 'lib/queryKeys'; -type GetRestaurantImageListParams = Exclude[0], undefined>; -type PostRestaurantImageParams = Exclude[0], undefined>; +type GetRestaurantImageListParams = Exclude< + Parameters[0], + undefined +>; +type PostRestaurantImageParams = Exclude< + Parameters[0], + undefined +>; const getRestaurantImageListQueryKey = ( getRestaurantImageListParams: GetRestaurantImageListParams, diff --git a/apps/jurumarble/src/app/vote/[id]/services/useRestaurantService.ts b/apps/jurumarble/src/app/vote/[id]/services/useRestaurantService.ts index 7bec86d2..fb83f865 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useRestaurantService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useRestaurantService.ts @@ -1,9 +1,12 @@ -import { useInfiniteScroll } from "@monorepo/hooks"; -import { useInfiniteQuery } from "@tanstack/react-query"; -import { getRestaurantAPI } from "lib/apis/restaurant"; -import { queryKeys } from "lib/queryKeys"; +import { useInfiniteScroll } from '@monorepo/hooks'; +import { useInfiniteQuery } from '@tanstack/react-query'; +import { getRestaurantAPI } from 'lib/apis/restaurant'; +import { queryKeys } from 'lib/queryKeys'; -type GetRestaurantListParams = Exclude[0], undefined>; +type GetRestaurantListParams = Exclude< + Parameters[0], + undefined +>; const getRestaurantListQueryKey = (params: GetRestaurantListParams) => [ queryKeys.RESTAURANT_LIST, @@ -18,7 +21,9 @@ export default function useRestaurantService(params: GetRestaurantListParams) { }, { getNextPageParam: ({ last, number }) => { - if (last) {return undefined;} + if (last) { + return undefined; + } return { page: number + 2, }; diff --git a/apps/jurumarble/src/app/vote/[id]/services/useVoteDeleteService.ts b/apps/jurumarble/src/app/vote/[id]/services/useVoteDeleteService.ts index fa1d4acb..85aacfd6 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useVoteDeleteService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useVoteDeleteService.ts @@ -1,14 +1,14 @@ -import { useMutation, useQueryClient } from "@tanstack/react-query"; -import { deleteVote } from "lib/apis/vote"; -import { reactQueryKeys } from "lib/queryKeys"; +import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { deleteVote } from 'lib/apis/vote'; +import { reactQueryKeys } from 'lib/queryKeys'; export default function useVoteDeleteService(voteId: number) { const queryClient = useQueryClient(); const { mutate } = useMutation(() => deleteVote(voteId), { onSuccess: () => { - alert("투표가 삭제되었습니다."); + alert('투표가 삭제되었습니다.'); queryClient.invalidateQueries([reactQueryKeys.voteList]); - window.location.href = "vote"; + window.location.href = 'vote'; }, }); return { diff --git a/apps/jurumarble/src/app/vote/[id]/services/useVoteLoadService.ts b/apps/jurumarble/src/app/vote/[id]/services/useVoteLoadService.ts index 2367f1ac..9037c4eb 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useVoteLoadService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useVoteLoadService.ts @@ -1,6 +1,6 @@ -import { useQuery } from "@tanstack/react-query"; -import { getVoteByVoteIdAPI } from "lib/apis/vote"; -import { reactQueryKeys } from "lib/queryKeys"; +import { useQuery } from '@tanstack/react-query'; +import { getVoteByVoteIdAPI } from 'lib/apis/vote'; +import { reactQueryKeys } from 'lib/queryKeys'; export default function useVoteLoadService(voteId: number) { const { data, isLoading, isError } = useQuery( diff --git a/apps/jurumarble/src/app/vote/[id]/services/useVoteReportService.ts b/apps/jurumarble/src/app/vote/[id]/services/useVoteReportService.ts index e1dd8920..fb0d12ec 100644 --- a/apps/jurumarble/src/app/vote/[id]/services/useVoteReportService.ts +++ b/apps/jurumarble/src/app/vote/[id]/services/useVoteReportService.ts @@ -1,5 +1,5 @@ -import { useMutation } from "@tanstack/react-query"; -import { postReportVoteAPI } from "lib/apis/report"; +import { useMutation } from '@tanstack/react-query'; +import { postReportVoteAPI } from 'lib/apis/report'; export default function useVoteReportService() { const { mutate } = useMutation((voteId: number) => postReportVoteAPI(voteId)); diff --git a/apps/jurumarble/src/app/vote/[id]/update/components/UpdateVoteContainer.tsx b/apps/jurumarble/src/app/vote/[id]/update/components/UpdateVoteContainer.tsx index 0dedcb60..5937e21f 100644 --- a/apps/jurumarble/src/app/vote/[id]/update/components/UpdateVoteContainer.tsx +++ b/apps/jurumarble/src/app/vote/[id]/update/components/UpdateVoteContainer.tsx @@ -1,22 +1,22 @@ -"use client"; - -import { useMemo, useState } from "react"; - -import { useToggle } from "@monorepo/hooks"; -import DrinkSearchModal from "app/vote/post/components/DrinkSearchModal"; -import PostBottomSheet from "app/vote/post/components/PostBottomSheet"; -import TitleAndDescriptionSection from "app/vote/post/components/TitleAndDescriptionSection"; -import AorBMark from "components/AorBMark"; -import ImageUploadButton from "components/ImageUploadButton"; -import VoteHeader from "components/VoteHeader"; -import { Button, Input } from "components/index"; -import Image from "next/image"; -import { useRouter } from "next/navigation"; -import SvgIcPrevious from "src/assets/icons/components/IcPrevious"; -import { DrinkInfoType } from "src/types/drink"; -import styled, { css } from "styled-components"; - -import useUpdateVoteForm from "../hook/useUpdataVoteForm"; +'use client'; + +import { useMemo, useState } from 'react'; + +import { useToggle } from '@monorepo/hooks'; +import DrinkSearchModal from 'app/vote/post/components/DrinkSearchModal'; +import PostBottomSheet from 'app/vote/post/components/PostBottomSheet'; +import TitleAndDescriptionSection from 'app/vote/post/components/TitleAndDescriptionSection'; +import AorBMark from 'components/AorBMark'; +import ImageUploadButton from 'components/ImageUploadButton'; +import VoteHeader from 'components/VoteHeader'; +import { Button, Input } from 'components/index'; +import Image from 'next/image'; +import { useRouter } from 'next/navigation'; +import SvgIcPrevious from 'src/assets/icons/components/IcPrevious'; +import { DrinkInfoType } from 'src/types/drink'; +import styled, { css } from 'styled-components'; + +import useUpdateVoteForm from '../hook/useUpdataVoteForm'; const STEP_ONE = 1; const STEP_TWO = 2; @@ -76,8 +76,8 @@ function UpdateVoteContainer() { alt="A이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> ) : ( @@ -92,8 +92,8 @@ function UpdateVoteContainer() { alt="B이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> ) : ( @@ -104,7 +104,12 @@ function UpdateVoteContainer() { )} - + diff --git a/apps/jurumarble/src/app/vote/[id]/update/hook/useUpdataVoteForm.ts b/apps/jurumarble/src/app/vote/[id]/update/hook/useUpdataVoteForm.ts index 563e316d..0e6ad01e 100644 --- a/apps/jurumarble/src/app/vote/[id]/update/hook/useUpdataVoteForm.ts +++ b/apps/jurumarble/src/app/vote/[id]/update/hook/useUpdataVoteForm.ts @@ -1,14 +1,14 @@ -import React, { useCallback, useEffect, useState } from "react"; +import React, { useCallback, useEffect, useState } from 'react'; -import { useMutation } from "@tanstack/react-query"; -import Path from "lib/Path"; -import { uploadImageAPI } from "lib/apis/common"; -import { postDrinkVoteAPI, postNormalVoteAPI } from "lib/apis/vote"; -import { useParams, useRouter } from "next/navigation"; -import { DrinkInfoType } from "src/types/drink"; -import { PostVoteType } from "src/types/vote"; +import { useMutation } from '@tanstack/react-query'; +import Path from 'lib/Path'; +import { uploadImageAPI } from 'lib/apis/common'; +import { postDrinkVoteAPI, postNormalVoteAPI } from 'lib/apis/vote'; +import { useParams, useRouter } from 'next/navigation'; +import { DrinkInfoType } from 'src/types/drink'; +import { PostVoteType } from 'src/types/vote'; -import useVoteLoadService from "../../services/useVoteLoadService"; +import useVoteLoadService from '../../services/useVoteLoadService'; export default function useUpdateVoteForm() { const router = useRouter(); @@ -16,14 +16,14 @@ export default function useUpdateVoteForm() { const { data } = useVoteLoadService(Number(params.id)); const [postVoteInfo, setPostVoteInfo] = useState({ - detail: "", + detail: '', drinkAId: 0, drinkBId: 0, - imageA: "", - imageB: "", - title: "", - titleA: "", - titleB: "", + imageA: '', + imageB: '', + title: '', + titleA: '', + titleB: '', }); useEffect(() => { @@ -43,9 +43,12 @@ export default function useUpdateVoteForm() { }); }, [data]); - const { title, detail, titleA, titleB, imageA, imageB, drinkAId, drinkBId } = postVoteInfo; + const { title, detail, titleA, titleB, imageA, imageB, drinkAId, drinkBId } = + postVoteInfo; - const onChangeVoteText = (e: React.ChangeEvent) => { + const onChangeVoteText = ( + e: React.ChangeEvent, + ) => { const { name, value } = e.target; setPostVoteInfo({ ...postVoteInfo, @@ -68,60 +71,67 @@ export default function useUpdateVoteForm() { })); }; - const onUploadImage = useCallback(async (e: React.ChangeEvent) => { - if (e.target.files === null) { - return; - } - - if (e.target.files.length === 2) { - if (e.target.files[0].size > 10485760 || e.target.files[1].size > 10485760) { - alert("파일 용량이 10MB를 초과하였습니다."); + const onUploadImage = useCallback( + async (e: React.ChangeEvent) => { + if (e.target.files === null) { return; } - const formDataA = new FormData(); - const formDataB = new FormData(); - formDataA.append("images", e.target.files[0]); - formDataB.append("images", e.target.files[1]); - try { - const dataA = await uploadImageAPI(formDataA); - const dataB = await uploadImageAPI(formDataB); - - setPostVoteInfo({ - ...postVoteInfo, - imageA: dataA.imageUrl, - imageB: dataB.imageUrl, - }); - } catch (error) { - alert(`이미지 업로드에 실패했습니다.${error}`); - } - return; - } - if (e.target.files.length === 1) { - if (e.target.files[0].size > 10485760) { - alert("파일 용량이 10MB를 초과하였습니다."); + if (e.target.files.length === 2) { + if ( + e.target.files[0].size > 10485760 || + e.target.files[1].size > 10485760 + ) { + alert('파일 용량이 10MB를 초과하였습니다.'); + return; + } + const formDataA = new FormData(); + const formDataB = new FormData(); + formDataA.append('images', e.target.files[0]); + formDataB.append('images', e.target.files[1]); + try { + const dataA = await uploadImageAPI(formDataA); + const dataB = await uploadImageAPI(formDataB); + + setPostVoteInfo({ + ...postVoteInfo, + imageA: dataA.imageUrl, + imageB: dataB.imageUrl, + }); + } catch (error) { + alert(`이미지 업로드에 실패했습니다.${error}`); + } return; } - const formDataA = new FormData(); - formDataA.append("images", e.target.files[0]); - try { - const dataA = await uploadImageAPI(formDataA); - - setPostVoteInfo({ - ...postVoteInfo, - imageA: dataA.imageUrl, - imageB: "", - }); - } catch (error) { - alert(`이미지 업로드에 실패했습니다.${error}`); + + if (e.target.files.length === 1) { + if (e.target.files[0].size > 10485760) { + alert('파일 용량이 10MB를 초과하였습니다.'); + return; + } + const formDataA = new FormData(); + formDataA.append('images', e.target.files[0]); + try { + const dataA = await uploadImageAPI(formDataA); + + setPostVoteInfo({ + ...postVoteInfo, + imageA: dataA.imageUrl, + imageB: '', + }); + } catch (error) { + alert(`이미지 업로드에 실패했습니다.${error}`); + } + return; } - return; - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, + [], + ); const { mutate: mutateNomalVote } = useMutation( - (voteInfo: Omit) => postNormalVoteAPI(voteInfo), + (voteInfo: Omit) => + postNormalVoteAPI(voteInfo), { onSuccess: () => { router.push(`${Path.VOTE_HOME}/?isSuccess=true`); @@ -129,7 +139,7 @@ export default function useUpdateVoteForm() { }, ); const { mutate: mutateDrinkVote } = useMutation( - (voteInfo: Omit) => + (voteInfo: Omit) => postDrinkVoteAPI(voteInfo), { onSuccess: () => { @@ -139,20 +149,20 @@ export default function useUpdateVoteForm() { ); const guidePostVote = () => { - if (title === "") { - alert("제목을 입력해주세요."); + if (title === '') { + alert('제목을 입력해주세요.'); return; } - if (detail === "") { - alert("설명을 입력해주세요."); + if (detail === '') { + alert('설명을 입력해주세요.'); return; } - if (titleA === "") { - alert("선택지 A를 입력해주세요."); + if (titleA === '') { + alert('선택지 A를 입력해주세요.'); return; } - if (titleB === "") { - alert("선택지 B를 입력해주세요."); + if (titleB === '') { + alert('선택지 B를 입력해주세요.'); return; } }; diff --git a/apps/jurumarble/src/app/vote/[id]/update/page.tsx b/apps/jurumarble/src/app/vote/[id]/update/page.tsx index 1eac6223..cddaadb9 100644 --- a/apps/jurumarble/src/app/vote/[id]/update/page.tsx +++ b/apps/jurumarble/src/app/vote/[id]/update/page.tsx @@ -1,4 +1,4 @@ -import UpdateVoteContainer from "./components/UpdateVoteContainer"; +import UpdateVoteContainer from './components/UpdateVoteContainer'; function UpdatePage() { return ; diff --git a/apps/jurumarble/src/app/vote/components/MenuBox.tsx b/apps/jurumarble/src/app/vote/components/MenuBox.tsx index 5bddd79a..352de03a 100644 --- a/apps/jurumarble/src/app/vote/components/MenuBox.tsx +++ b/apps/jurumarble/src/app/vote/components/MenuBox.tsx @@ -1,4 +1,4 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { onModify?: () => void; @@ -7,7 +7,12 @@ interface Props { right?: string; } -function ModifyDeleteButtonBox({ onModify, onDelete, top = "0", right = "0px" }: Props) { +function ModifyDeleteButtonBox({ + onModify, + onDelete, + top = '0', + right = '0px', +}: Props) { return ( diff --git a/apps/jurumarble/src/app/vote/components/NonWriterBox.tsx b/apps/jurumarble/src/app/vote/components/NonWriterBox.tsx index 82ee5b8e..dfc6f866 100644 --- a/apps/jurumarble/src/app/vote/components/NonWriterBox.tsx +++ b/apps/jurumarble/src/app/vote/components/NonWriterBox.tsx @@ -1,4 +1,4 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { onCopy?: () => void; @@ -7,7 +7,7 @@ interface Props { right?: string; } -function NonWriterBox({ onCopy, onReport, top = "0", right = "0px" }: Props) { +function NonWriterBox({ onCopy, onReport, top = '0', right = '0px' }: Props) { return ( {onCopy && ( diff --git a/apps/jurumarble/src/app/vote/hooks/useFlipAnimation.ts b/apps/jurumarble/src/app/vote/hooks/useFlipAnimation.ts index 9d8ad78f..0625b003 100644 --- a/apps/jurumarble/src/app/vote/hooks/useFlipAnimation.ts +++ b/apps/jurumarble/src/app/vote/hooks/useFlipAnimation.ts @@ -1,6 +1,6 @@ -import { useRef, useState } from "react"; +import { useRef, useState } from 'react'; -export type Drag = "up" | "down" | null; +export type Drag = 'up' | 'down' | null; function useFlipAnimation(onChangeNowShowing: (index: number) => void) { const [drag, setDrag] = useState(null); const [startTouchPosition, setStartTouchPosition] = useState({ @@ -18,13 +18,13 @@ function useFlipAnimation(onChangeNowShowing: (index: number) => void) { lastTouchEventTimeRef.current = now; // 휠을 올리면 up, 내리면 down if (e.deltaY < 0) { - setDrag("up"); + setDrag('up'); setTimeout(() => { onChangeNowShowing(-1); }, 750); } if (e.deltaY > 0) { - setDrag("down"); + setDrag('down'); setTimeout(() => { onChangeNowShowing(1); }, 750); @@ -52,13 +52,13 @@ function useFlipAnimation(onChangeNowShowing: (index: number) => void) { //터치의 시작이 끝보다 위면 up, 아래면 down if (e.changedTouches[0].clientY - startTouchPosition.y > 0) { - setDrag("up"); + setDrag('up'); setTimeout(() => { onChangeNowShowing(-1); }, 750); } if (e.changedTouches[0].clientY - startTouchPosition.y < 0) { - setDrag("down"); + setDrag('down'); setTimeout(() => { onChangeNowShowing(1); }, 750); diff --git a/apps/jurumarble/src/app/vote/layout.tsx b/apps/jurumarble/src/app/vote/layout.tsx index 6542447c..94e96495 100644 --- a/apps/jurumarble/src/app/vote/layout.tsx +++ b/apps/jurumarble/src/app/vote/layout.tsx @@ -1,14 +1,14 @@ -"use client"; +'use client'; -import { PropsWithChildren } from "react"; +import { PropsWithChildren } from 'react'; -import Header from "components/Header"; -import VoteHeader from "components/VoteHeader"; -import { Button } from "components/button"; -import Path from "lib/Path"; -import { usePathname, useRouter } from "next/navigation"; -import { SvgIcPrevious } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import Header from 'components/Header'; +import VoteHeader from 'components/VoteHeader'; +import { Button } from 'components/button'; +import Path from 'lib/Path'; +import { usePathname, useRouter } from 'next/navigation'; +import { SvgIcPrevious } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; export default function Layout({ children }: PropsWithChildren) { const pathname = usePathname(); @@ -26,7 +26,7 @@ export default function Layout({ children }: PropsWithChildren) { } > - {pathname === Path.POST_PAGE ? "투표 등록" : "상세페이지"} + {pathname === Path.POST_PAGE ? '투표 등록' : '상세페이지'} )} {children} diff --git a/apps/jurumarble/src/app/vote/page.tsx b/apps/jurumarble/src/app/vote/page.tsx index 81abf81b..c8b5fbf9 100644 --- a/apps/jurumarble/src/app/vote/page.tsx +++ b/apps/jurumarble/src/app/vote/page.tsx @@ -1,28 +1,28 @@ -"use client"; +'use client'; -import { useRef } from "react"; +import { useRef } from 'react'; -import BottomBar from "components/BottomBar"; -import Loading from "components/Loading"; -import { Button } from "components/button"; -import Path from "lib/Path"; -import { media } from "lib/styles"; -import Image from "next/image"; -import { useRouter, useSearchParams } from "next/navigation"; -import { ImgScroll } from "public/images"; -import { toast } from "react-toastify"; -import useBookmarkService from "services/useBookmarkService"; -import SvgIcDetail from "src/assets/icons/components/IcDetail"; -import styled, { css } from "styled-components"; +import BottomBar from 'components/BottomBar'; +import Loading from 'components/Loading'; +import { Button } from 'components/button'; +import Path from 'lib/Path'; +import { media } from 'lib/styles'; +import Image from 'next/image'; +import { useRouter, useSearchParams } from 'next/navigation'; +import { ImgScroll } from 'public/images'; +import { toast } from 'react-toastify'; +import useBookmarkService from 'services/useBookmarkService'; +import SvgIcDetail from 'src/assets/icons/components/IcDetail'; +import styled, { css } from 'styled-components'; -import ChipContainer from "./[id]/components/ChipContainer"; -import VoteDescription from "./[id]/components/VoteDescription"; -import useExecuteVoteService from "./[id]/services/useExecuteVoteService"; -import useFilteredStatisticsService from "./[id]/services/useFilterStatisticsService"; -import useFlipAnimation from "./hooks/useFlipAnimation"; -import useInfiniteMainListService from "./services/useGetVoteListService"; +import ChipContainer from './[id]/components/ChipContainer'; +import VoteDescription from './[id]/components/VoteDescription'; +import useExecuteVoteService from './[id]/services/useExecuteVoteService'; +import useFilteredStatisticsService from './[id]/services/useFilterStatisticsService'; +import useFlipAnimation from './hooks/useFlipAnimation'; +import useInfiniteMainListService from './services/useGetVoteListService'; -export type Drag = "up" | "down" | null; +export type Drag = 'up' | 'down' | null; function VoteHomePage() { const searchParams = useSearchParams(); @@ -30,9 +30,9 @@ function VoteHomePage() { /** * @TODO 여러번 뜨는 현상 지속시 삭제 */ - params.get("isSuccess") && - toast.success("정상적으로 투표가 등록되었습니다!.", { - toastId: "voteSuccess", + params.get('isSuccess') && + toast.success('정상적으로 투표가 등록되었습니다!.', { + toastId: 'voteSuccess', }); const router = useRouter(); @@ -40,7 +40,7 @@ function VoteHomePage() { const { isError, isLoading, mainVoteList, nowShowing, onChangeNowShowing } = useInfiniteMainListService({ size: 10, - sortBy: "ByTime", + sortBy: 'ByTime', }); const { onActFlip, drag, onTouchStartPosition, onTouchMoveActFlip } = @@ -63,7 +63,7 @@ function VoteHomePage() { const { isBookmark, mutateBookMark } = useBookmarkService(voteId); const { mutate, select } = useExecuteVoteService(voteId); - const onMutateVoting = (select: "A" | "B") => { + const onMutateVoting = (select: 'A' | 'B') => { mutate(select); }; @@ -71,10 +71,15 @@ function VoteHomePage() { const onScrollBottom = () => { // 스크롤을 최하단으로 내린다 - moreRef.current?.scrollIntoView({ behavior: "smooth" }); + moreRef.current?.scrollIntoView({ behavior: 'smooth' }); }; - const { voteStatisticsQuery } = useFilteredStatisticsService(Number(voteId), "", "", ""); + const { voteStatisticsQuery } = useFilteredStatisticsService( + Number(voteId), + '', + '', + '', + ); const { data: statistics, @@ -82,8 +87,12 @@ function VoteHomePage() { isError: isStatisticsError, } = voteStatisticsQuery; - if (isLoading || isStatisticsLoading) {return ;} - if (isError || isStatisticsError) {return 에러;} + if (isLoading || isStatisticsLoading) { + return ; + } + if (isError || isStatisticsError) { + return 에러; + } const { percentageA, percentageB, totalCountA, totalCountB } = statistics; @@ -143,7 +152,10 @@ function VoteHomePage() { drinkAId={1} drinkBId={1} /> - router.push(`vote/${voteId}`)} ref={moreRef}> + router.push(`vote/${voteId}`)} + ref={moreRef} + > 더보기 @@ -191,7 +203,7 @@ const PageInner = styled.div<{ drag: Drag }>` } ${({ drag }) => - drag === "up" && + drag === 'up' && css` transition: all 0.5s ease-in-out; transform-origin: 50% 0; @@ -200,7 +212,7 @@ const PageInner = styled.div<{ drag: Drag }>` opacity: 0; `} ${({ drag }) => - drag === "down" && + drag === 'down' && css` transition: all 0.5s ease-in-out; transform: rotateX(90deg) scale(0.9, 1.032); @@ -234,7 +246,7 @@ const FirstPageBase = styled.div<{ drag: Drag }>` height: 620px; } ${({ drag }) => - drag === "up" && + drag === 'up' && css` perspective: 600px; transform-origin: 50% 0; @@ -242,7 +254,7 @@ const FirstPageBase = styled.div<{ drag: Drag }>` opacity: 1; `} ${({ drag }) => - drag === "down" && + drag === 'down' && css` opacity: 1; transform: scale(1.11, 0.97); @@ -260,12 +272,12 @@ const SecondPageBase = styled(FirstPageBase)` height: 640px; } ${({ drag }) => - drag === "up" && + drag === 'up' && css` opacity: 0.6; `} ${({ drag }) => - drag === "down" && + drag === 'down' && css` opacity: 0.6; `} diff --git a/apps/jurumarble/src/app/vote/post/components/DrinkItem.tsx b/apps/jurumarble/src/app/vote/post/components/DrinkItem.tsx index b5a8aad0..ca327b5d 100644 --- a/apps/jurumarble/src/app/vote/post/components/DrinkItem.tsx +++ b/apps/jurumarble/src/app/vote/post/components/DrinkItem.tsx @@ -1,8 +1,8 @@ -import Chip from "components/Chip"; -import { transitions } from "lib/styles"; -import Image from "next/image"; -import { DrinkInfo , DrinkInfoType } from "src/types/drink"; -import styled, { css } from "styled-components"; +import Chip from 'components/Chip'; +import { transitions } from 'lib/styles'; +import Image from 'next/image'; +import { DrinkInfo, DrinkInfoType } from 'src/types/drink'; +import styled, { css } from 'styled-components'; interface Props { drinkInfo: DrinkInfo; @@ -13,12 +13,17 @@ interface Props { function DrinkItem({ drinkInfo, onClickAddDrink, selectedDrinkList }: Props) { const { name, manufacturer, image } = drinkInfo; - const isInclude = (selectedDrink: DrinkInfoType) => selectedDrink.id === drinkInfo.id; + const isInclude = (selectedDrink: DrinkInfoType) => + selectedDrink.id === drinkInfo.id; return ( - + - {name} + {name} @@ -36,7 +41,8 @@ function DrinkItem({ drinkInfo, onClickAddDrink, selectedDrinkList }: Props) { const Container = styled.button<{ selected: boolean }>` display: flex; - box-shadow: 0px 2px 8px 0px rgba(235, 235, 235, 0.4), 0px 8px 20px 0px rgba(235, 235, 235, 0.4); + box-shadow: 0px 2px 8px 0px rgba(235, 235, 235, 0.4), + 0px 8px 20px 0px rgba(235, 235, 235, 0.4); height: 120px; padding: 16px; border-radius: 16px; diff --git a/apps/jurumarble/src/app/vote/post/components/DrinkSearchModal.tsx b/apps/jurumarble/src/app/vote/post/components/DrinkSearchModal.tsx index 206e1300..5c074472 100644 --- a/apps/jurumarble/src/app/vote/post/components/DrinkSearchModal.tsx +++ b/apps/jurumarble/src/app/vote/post/components/DrinkSearchModal.tsx @@ -1,48 +1,61 @@ -"use client"; +'use client'; -import { useState } from "react"; +import { useState } from 'react'; -import DrinkItem from "app/vote/post/components/DrinkItem"; -import SearchInput from "components/SearchInput"; -import VoteHeader from "components/VoteHeader"; -import { Button, ModalTemplate } from "components/index"; -import useInput from "hooks/useInput"; -import SvgIcX from "src/assets/icons/components/IcX"; -import { DrinkInfoType } from "src/types/drink"; -import styled, { css } from "styled-components"; +import DrinkItem from 'app/vote/post/components/DrinkItem'; +import SearchInput from 'components/SearchInput'; +import VoteHeader from 'components/VoteHeader'; +import { Button, ModalTemplate } from 'components/index'; +import useInput from 'hooks/useInput'; +import SvgIcX from 'src/assets/icons/components/IcX'; +import { DrinkInfoType } from 'src/types/drink'; +import styled, { css } from 'styled-components'; -import RegionSelect from "./RegionSelect"; -import SelectedDrinkChip from "./SelectedDrinkChip"; -import useUpdateSelectedDrinkList from "../hooks/useUpdateSelectedDrinkList"; -import useGetDrinkList from "../services/useGetDrinkList"; +import RegionSelect from './RegionSelect'; +import SelectedDrinkChip from './SelectedDrinkChip'; +import useUpdateSelectedDrinkList from '../hooks/useUpdateSelectedDrinkList'; +import useGetDrinkList from '../services/useGetDrinkList'; interface Props { onToggleDrinkSearchModal: () => void; onClickSearchDrinkComplete: (selectedDrinkList: DrinkInfoType[]) => void; } -function DrinkSearchModal({ onToggleDrinkSearchModal, onClickSearchDrinkComplete }: Props) { - const { selectedDrinkList, onClickAddDrink, onClickDeleteItem, deleteSelectedDrinkList } = - useUpdateSelectedDrinkList(); - - const [regionOption, setRegionOption] = useState(""); +function DrinkSearchModal({ + onToggleDrinkSearchModal, + onClickSearchDrinkComplete, +}: Props) { + const { + selectedDrinkList, + onClickAddDrink, + onClickDeleteItem, + deleteSelectedDrinkList, + } = useUpdateSelectedDrinkList(); + + const [regionOption, setRegionOption] = useState(''); const onChangeRegionOption = (value: string) => { deleteSelectedDrinkList(); setRegionOption(value); }; - const { value: keyword, onChange: onChangeKeyword } = useInput({ useDebounce: true }); + const { value: keyword, onChange: onChangeKeyword } = useInput({ + useDebounce: true, + }); const { drinkList } = useGetDrinkList({ keyword, region: regionOption, page: 0, size: 100, - sortBy: "ByPopularity", + sortBy: 'ByPopularity', }); return ( - + @@ -53,7 +66,10 @@ function DrinkSearchModal({ onToggleDrinkSearchModal, onClickSearchDrinkComplete 술 검색하기 - + {regionOption && ( void; onChangePostStep: () => void; } -function PostBottomSheet({ onToggleDrinkSearchModal, onChangePostStep }: Props) { +function PostBottomSheet({ + onToggleDrinkSearchModal, + onChangePostStep, +}: Props) { return ( diff --git a/apps/jurumarble/src/app/vote/post/components/PostVoteContainer.tsx b/apps/jurumarble/src/app/vote/post/components/PostVoteContainer.tsx index e87eef7c..60f913b6 100644 --- a/apps/jurumarble/src/app/vote/post/components/PostVoteContainer.tsx +++ b/apps/jurumarble/src/app/vote/post/components/PostVoteContainer.tsx @@ -1,21 +1,21 @@ -"use client"; +'use client'; -import { useMemo } from "react"; +import { useMemo } from 'react'; -import { useToggle } from "@monorepo/hooks"; -import AorBMark from "components/AorBMark"; -import ImageUploadButton from "components/ImageUploadButton"; -import { Button, Input } from "components/index"; -import { media } from "lib/styles"; -import depths from "lib/styles/depths"; -import Image from "next/image"; -import { SvgIcX, SvgInfo } from "src/assets/icons/components"; -import { DrinkInfoType } from "src/types/drink"; -import styled, { css } from "styled-components"; +import { useToggle } from '@monorepo/hooks'; +import AorBMark from 'components/AorBMark'; +import ImageUploadButton from 'components/ImageUploadButton'; +import { Button, Input } from 'components/index'; +import { media } from 'lib/styles'; +import depths from 'lib/styles/depths'; +import Image from 'next/image'; +import { SvgIcX, SvgInfo } from 'src/assets/icons/components'; +import { DrinkInfoType } from 'src/types/drink'; +import styled, { css } from 'styled-components'; -import DrinkSearchModal from "./DrinkSearchModal"; -import TitleAndDescriptionSection from "./TitleAndDescriptionSection"; -import usePostVoteService from "../services/usePostVoteService"; +import DrinkSearchModal from './DrinkSearchModal'; +import TitleAndDescriptionSection from './TitleAndDescriptionSection'; +import usePostVoteService from '../services/usePostVoteService'; function PostVoteContainer() { const [isDrinkSearchModal, onToggleDrinkSearchModal] = useToggle(); @@ -81,7 +81,12 @@ function PostVoteContainer() { ) : ( @@ -94,13 +99,18 @@ function PostVoteContainer() { alt="A이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> A - + @@ -111,14 +121,19 @@ function PostVoteContainer() { alt="B이미지" fill style={{ - objectFit: "cover", - borderRadius: "10px", + objectFit: 'cover', + borderRadius: '10px', }} /> )} B - + @@ -243,14 +258,15 @@ const VoteOptionText = styled.div` gap: 16px; `; -const ABInput = styled(Input)<{ AorB: "A" | "B" }>` +const ABInput = styled(Input)<{ AorB: 'A' | 'B' }>` ${({ theme, AorB }) => css` ${theme.typography.body_long03} color: ${theme.colors.black_04}; border-bottom: 1px solid ${theme.colors.line_01}; :focus { - border-bottom: 1px solid ${AorB === "A" ? theme.colors.sub_01 : theme.colors.sub_02}; + border-bottom: 1px solid + ${AorB === 'A' ? theme.colors.sub_01 : theme.colors.sub_02}; } `} `; @@ -283,7 +299,7 @@ const BalloonText = styled.div` left: 48px; ::after { - content: ""; + content: ''; position: absolute; border-top: 8px solid transparent; border-bottom: 8px solid ${theme.colors.system_black}; diff --git a/apps/jurumarble/src/app/vote/post/components/RegionSelect.tsx b/apps/jurumarble/src/app/vote/post/components/RegionSelect.tsx index 7cdddf82..3872a756 100644 --- a/apps/jurumarble/src/app/vote/post/components/RegionSelect.tsx +++ b/apps/jurumarble/src/app/vote/post/components/RegionSelect.tsx @@ -1,9 +1,9 @@ -import { useId } from "react"; +import { useId } from 'react'; -import { useOutsideClick, useToggle } from "@monorepo/hooks"; -import { REGION_LIST } from "lib/constants"; -import { SvgArrowDown } from "src/assets/icons/components"; -import styled, { css } from "styled-components"; +import { useOutsideClick, useToggle } from '@monorepo/hooks'; +import { REGION_LIST } from 'lib/constants'; +import { SvgArrowDown } from 'src/assets/icons/components'; +import styled, { css } from 'styled-components'; interface Props { regionOption: string; @@ -11,7 +11,7 @@ interface Props { } const COPIED_REGION_LIST = [ - { value: "", label: "지역을 선택해주세요.", lat: 0, long: 0 }, + { value: '', label: '지역을 선택해주세요.', lat: 0, long: 0 }, ...REGION_LIST, ]; @@ -32,7 +32,10 @@ function RegionSelect({ regionOption, onChangeRegionOption }: Props) { onClick={onToggleOpen} > - {COPIED_REGION_LIST.find(({ value }) => value === regionOption)?.label} + { + COPIED_REGION_LIST.find(({ value }) => value === regionOption) + ?.label + } @@ -80,7 +83,7 @@ const SelectStyled = styled.div<{ isOpen: boolean }>` color: ${theme.colors.black_01}; } svg { - ${isOpen && "transform: rotateX( 180deg )"} + ${isOpen && 'transform: rotateX( 180deg )'} } `} `; diff --git a/apps/jurumarble/src/app/vote/post/components/SelectedDrinkChip.tsx b/apps/jurumarble/src/app/vote/post/components/SelectedDrinkChip.tsx index 504fd59b..5e34a40c 100644 --- a/apps/jurumarble/src/app/vote/post/components/SelectedDrinkChip.tsx +++ b/apps/jurumarble/src/app/vote/post/components/SelectedDrinkChip.tsx @@ -1,5 +1,5 @@ -import SvgIcX from "src/assets/icons/components/IcX"; -import styled, { css } from "styled-components"; +import SvgIcX from 'src/assets/icons/components/IcX'; +import styled, { css } from 'styled-components'; interface Props { children: React.ReactNode; diff --git a/apps/jurumarble/src/app/vote/post/components/TitleAndDescriptionSection.tsx b/apps/jurumarble/src/app/vote/post/components/TitleAndDescriptionSection.tsx index 17ae49d0..c012f9ad 100644 --- a/apps/jurumarble/src/app/vote/post/components/TitleAndDescriptionSection.tsx +++ b/apps/jurumarble/src/app/vote/post/components/TitleAndDescriptionSection.tsx @@ -1,6 +1,6 @@ -import { Button } from "components/button"; -import { transitions } from "lib/styles"; -import styled, { css } from "styled-components"; +import { Button } from 'components/button'; +import { transitions } from 'lib/styles'; +import styled, { css } from 'styled-components'; interface Props { title: string; diff --git a/apps/jurumarble/src/app/vote/post/hooks/useUpdateSelectedDrinkList.ts b/apps/jurumarble/src/app/vote/post/hooks/useUpdateSelectedDrinkList.ts index ac9cd23f..51168a1b 100644 --- a/apps/jurumarble/src/app/vote/post/hooks/useUpdateSelectedDrinkList.ts +++ b/apps/jurumarble/src/app/vote/post/hooks/useUpdateSelectedDrinkList.ts @@ -1,24 +1,35 @@ -import { useState } from "react"; +import { useState } from 'react'; -import { DrinkInfoType } from "src/types/drink"; +import { DrinkInfoType } from 'src/types/drink'; export default function useUpdateSelectedDrinkList() { const [selectedDrinkList, setDrinkList] = useState([]); const onClickAddDrink = (clickDrink: DrinkInfoType) => { - const isInclude = (selectedDrink: DrinkInfoType) => selectedDrink.id === clickDrink.id; + const isInclude = (selectedDrink: DrinkInfoType) => + selectedDrink.id === clickDrink.id; selectedDrinkList.some(isInclude) - ? setDrinkList((prev) => prev.filter((selectedDrink) => selectedDrink.id !== clickDrink.id)) - : selectedDrinkList.length < 2 && setDrinkList((prev) => [...prev.concat(clickDrink)]); + ? setDrinkList((prev) => + prev.filter((selectedDrink) => selectedDrink.id !== clickDrink.id), + ) + : selectedDrinkList.length < 2 && + setDrinkList((prev) => [...prev.concat(clickDrink)]); }; const onClickDeleteItem = (clickDrink: DrinkInfoType) => { - setDrinkList((prev) => prev.filter((selectedDrink) => selectedDrink.id !== clickDrink.id)); + setDrinkList((prev) => + prev.filter((selectedDrink) => selectedDrink.id !== clickDrink.id), + ); }; const deleteSelectedDrinkList = () => { setDrinkList([]); }; - return { selectedDrinkList, onClickAddDrink, onClickDeleteItem, deleteSelectedDrinkList }; + return { + selectedDrinkList, + onClickAddDrink, + onClickDeleteItem, + deleteSelectedDrinkList, + }; } diff --git a/apps/jurumarble/src/app/vote/post/page.tsx b/apps/jurumarble/src/app/vote/post/page.tsx index 4adf4eb0..cc9416e1 100644 --- a/apps/jurumarble/src/app/vote/post/page.tsx +++ b/apps/jurumarble/src/app/vote/post/page.tsx @@ -1,4 +1,4 @@ -import PostVoteContainer from "./components/PostVoteContainer"; +import PostVoteContainer from './components/PostVoteContainer'; function PostPage() { return ; diff --git a/apps/jurumarble/src/app/vote/post/services/useGetDrinkList.ts b/apps/jurumarble/src/app/vote/post/services/useGetDrinkList.ts index 41cd8f79..1d9340b8 100644 --- a/apps/jurumarble/src/app/vote/post/services/useGetDrinkList.ts +++ b/apps/jurumarble/src/app/vote/post/services/useGetDrinkList.ts @@ -1,8 +1,11 @@ -import { useInfiniteQuery } from "@tanstack/react-query"; -import { getDrinkList } from "lib/apis/drink"; -import { queryKeys } from "lib/queryKeys"; +import { useInfiniteQuery } from '@tanstack/react-query'; +import { getDrinkList } from 'lib/apis/drink'; +import { queryKeys } from 'lib/queryKeys'; -type SearchDrinkServiceProps = Exclude[0], undefined>; +type SearchDrinkServiceProps = Exclude< + Parameters[0], + undefined +>; const getQueryKey = (params: SearchDrinkServiceProps) => [ queryKeys.SEARCH_DRINK_LIST, @@ -19,7 +22,9 @@ export default function useGetDrinkList(params: SearchDrinkServiceProps) { }), { getNextPageParam: ({ last, number }) => { - if (last) {return undefined;} + if (last) { + return undefined; + } return { page: number + 1, }; diff --git a/apps/jurumarble/src/app/vote/post/services/usePostVoteService.ts b/apps/jurumarble/src/app/vote/post/services/usePostVoteService.ts index 7f8e9a7f..79891cd3 100644 --- a/apps/jurumarble/src/app/vote/post/services/usePostVoteService.ts +++ b/apps/jurumarble/src/app/vote/post/services/usePostVoteService.ts @@ -1,32 +1,35 @@ -import React, { useCallback, useState } from "react"; +import React, { useCallback, useState } from 'react'; -import { useMutation, useQueryClient } from "@tanstack/react-query"; -import Path from "lib/Path"; -import { uploadImageAPI } from "lib/apis/common"; -import { postDrinkVoteAPI, postNormalVoteAPI } from "lib/apis/vote"; -import { queryKeys } from "lib/queryKeys"; -import { useRouter } from "next/navigation"; -import { DrinkInfoType } from "src/types/drink"; -import { PostVoteType } from "src/types/vote"; +import { useMutation, useQueryClient } from '@tanstack/react-query'; +import Path from 'lib/Path'; +import { uploadImageAPI } from 'lib/apis/common'; +import { postDrinkVoteAPI, postNormalVoteAPI } from 'lib/apis/vote'; +import { queryKeys } from 'lib/queryKeys'; +import { useRouter } from 'next/navigation'; +import { DrinkInfoType } from 'src/types/drink'; +import { PostVoteType } from 'src/types/vote'; export default function usePostVoteService() { const router = useRouter(); const queryClient = useQueryClient(); const [postVoteInfo, setPostVoteInfo] = useState({ - detail: "", + detail: '', drinkAId: 0, drinkBId: 0, - imageA: "", - imageB: "", - title: "", - titleA: "", - titleB: "", + imageA: '', + imageB: '', + title: '', + titleA: '', + titleB: '', }); - const { title, detail, titleA, titleB, imageA, imageB, drinkAId, drinkBId } = postVoteInfo; + const { title, detail, titleA, titleB, imageA, imageB, drinkAId, drinkBId } = + postVoteInfo; - const onChangeVoteText = (e: React.ChangeEvent) => { + const onChangeVoteText = ( + e: React.ChangeEvent, + ) => { const { name, value } = e.target; setPostVoteInfo({ ...postVoteInfo, @@ -60,12 +63,12 @@ export default function usePostVoteService() { if (e.target.files.length === 1) { if (e.target.files[0].size > 2000000) { - alert("파일 용량이 2MB를 초과하였습니다."); + alert('파일 용량이 2MB를 초과하였습니다.'); return; } if (!!postVoteInfo.imageA) { const formDataB = new FormData(); - formDataB.append("images", e.target.files[0]); + formDataB.append('images', e.target.files[0]); try { const dataB = await uploadImageAPI(formDataB); setPostVoteInfo({ @@ -78,7 +81,7 @@ export default function usePostVoteService() { return; } const formDataA = new FormData(); - formDataA.append("images", e.target.files[0]); + formDataA.append('images', e.target.files[0]); try { const dataA = await uploadImageAPI(formDataA); @@ -93,14 +96,17 @@ export default function usePostVoteService() { } if (e.target.files.length === 2) { - if (e.target.files[0].size > 2000000 || e.target.files[1].size > 2000000) { - alert("파일 용량이 2MB를 초과하였습니다."); + if ( + e.target.files[0].size > 2000000 || + e.target.files[1].size > 2000000 + ) { + alert('파일 용량이 2MB를 초과하였습니다.'); return; } const formDataA = new FormData(); const formDataB = new FormData(); - formDataA.append("images", e.target.files[0]); - formDataB.append("images", e.target.files[1]); + formDataA.append('images', e.target.files[0]); + formDataB.append('images', e.target.files[1]); try { const dataA = await uploadImageAPI(formDataA); const dataB = await uploadImageAPI(formDataB); @@ -120,7 +126,8 @@ export default function usePostVoteService() { ); const { mutate: mutateNomalVote } = useMutation( - (voteInfo: Omit) => postNormalVoteAPI(voteInfo), + (voteInfo: Omit) => + postNormalVoteAPI(voteInfo), { onSuccess: () => { queryClient.invalidateQueries([queryKeys.VOTE_LIST]); @@ -129,7 +136,7 @@ export default function usePostVoteService() { }, ); const { mutate: mutateDrinkVote } = useMutation( - (voteInfo: Omit) => + (voteInfo: Omit) => postDrinkVoteAPI(voteInfo), { onSuccess: () => { diff --git a/apps/jurumarble/src/app/vote/services/useGetVoteListService.tsx b/apps/jurumarble/src/app/vote/services/useGetVoteListService.tsx index 272439c6..1ac6bbd0 100644 --- a/apps/jurumarble/src/app/vote/services/useGetVoteListService.tsx +++ b/apps/jurumarble/src/app/vote/services/useGetVoteListService.tsx @@ -1,9 +1,9 @@ -import { useEffect, useMemo, useState } from "react"; +import { useEffect, useMemo, useState } from 'react'; -import { useInfiniteQuery } from "@tanstack/react-query"; -import { getVoteListAPI } from "lib/apis/vote"; -import { reactQueryKeys } from "lib/queryKeys"; -import { VoteSortType } from "src/types/common"; +import { useInfiniteQuery } from '@tanstack/react-query'; +import { getVoteListAPI } from 'lib/apis/vote'; +import { reactQueryKeys } from 'lib/queryKeys'; +import { VoteSortType } from 'src/types/common'; interface Props { size: number; @@ -13,15 +13,22 @@ interface Props { const SafeRange = 5; -export default function useInfiniteMainListService({ size, sortBy, keyword }: Props) { +export default function useInfiniteMainListService({ + size, + sortBy, + keyword, +}: Props) { const [nowShowing, setNowShowing] = useState(0); const { data, isLoading, isError, fetchNextPage } = useInfiniteQuery( reactQueryKeys.mainVoteList(), - ({ pageParam = 0 }) => getVoteListAPI({ page: pageParam, size, sortBy, keyword }), + ({ pageParam = 0 }) => + getVoteListAPI({ page: pageParam, size, sortBy, keyword }), { getNextPageParam: (lastPage, pages) => { - if (lastPage.last) {return undefined;} + if (lastPage.last) { + return undefined; + } return pages.length; }, keepPreviousData: true, @@ -35,15 +42,28 @@ export default function useInfiniteMainListService({ size, sortBy, keyword }: Pr ); const onChangeNowShowing = (index: number) => { - if (nowShowing + index < 0) {return;} - if (nowShowing + index > mainVoteList.length - 1) {return;} + if (nowShowing + index < 0) { + return; + } + if (nowShowing + index > mainVoteList.length - 1) { + return; + } setNowShowing((prev) => prev + index); }; useEffect(() => { - if (nowShowing === mainVoteList.length - SafeRange) {fetchNextPage();} - // eslint-disable-next-line react-hooks/exhaustive-deps + if (nowShowing === mainVoteList.length - SafeRange) { + fetchNextPage(); + } + // eslint-disable-next-line react-hooks/exhaustive-deps }, [nowShowing, mainVoteList.length]); - return { data, isError, isLoading, mainVoteList, nowShowing, onChangeNowShowing }; + return { + data, + isError, + isLoading, + mainVoteList, + nowShowing, + onChangeNowShowing, + }; } diff --git a/apps/jurumarble/src/assets/icons/components/IcArrowDown.tsx b/apps/jurumarble/src/assets/icons/components/IcArrowDown.tsx index ab7e3f47..dda10e26 100644 --- a/apps/jurumarble/src/assets/icons/components/IcArrowDown.tsx +++ b/apps/jurumarble/src/assets/icons/components/IcArrowDown.tsx @@ -1,4 +1,4 @@ -import type { SVGProps } from "react"; +import type { SVGProps } from 'react'; const SvgArrowDown = (props: SVGProps) => ( ) => ( ) => ( width={20} height={20} > - + ) => ( ) => ( ) => ( fill="none" {...props} > - + diff --git a/apps/jurumarble/src/assets/icons/components/IcCamera.tsx b/apps/jurumarble/src/assets/icons/components/IcCamera.tsx index c6a87354..6d7a6d59 100644 --- a/apps/jurumarble/src/assets/icons/components/IcCamera.tsx +++ b/apps/jurumarble/src/assets/icons/components/IcCamera.tsx @@ -1,4 +1,4 @@ -import type { SVGProps } from "react"; +import type { SVGProps } from 'react'; const SvgIcCamera = (props: SVGProps) => ( ) => ( ) => ( width={24} height={24} > - + ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( width={20} height={20} > - + ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( xmlnsXlink="http://www.w3.org/1999/xlink" {...props} > - + - + ) => ( ) => ( ) => ( - - + + ) => ( - + ) => ( ) => ( - + diff --git a/apps/jurumarble/src/assets/icons/components/IcNext.tsx b/apps/jurumarble/src/assets/icons/components/IcNext.tsx index 562ae259..84b7b0fb 100644 --- a/apps/jurumarble/src/assets/icons/components/IcNext.tsx +++ b/apps/jurumarble/src/assets/icons/components/IcNext.tsx @@ -1,4 +1,4 @@ -import type { SVGProps } from "react"; +import type { SVGProps } from 'react'; const SvgNext = (props: SVGProps) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - - - + + + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - - - - - + + + + + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - - - - - - - - - + + + + + + + + + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + - - + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - - - - - - - - + + + + + + + + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( fill="currentColor" vectorEffect="non-scaling-stroke" /> - + ) => ( - + diff --git a/apps/jurumarble/src/assets/icons/components/WomenAvatar.tsx b/apps/jurumarble/src/assets/icons/components/WomenAvatar.tsx index a1388625..e3423506 100644 --- a/apps/jurumarble/src/assets/icons/components/WomenAvatar.tsx +++ b/apps/jurumarble/src/assets/icons/components/WomenAvatar.tsx @@ -1,4 +1,4 @@ -import type { SVGProps } from "react"; +import type { SVGProps } from 'react'; const SvgWomenAvatar = (props: SVGProps) => ( ` ${({ theme, AorB }) => css` ${theme.typography.caption_chip} - background-color: ${AorB === "A" ? theme.colors.sub_01 : theme.colors.sub_02}; + background-color: ${AorB === 'A' + ? theme.colors.sub_01 + : theme.colors.sub_02}; color: ${theme.colors.white}; position: absolute; top: 0; diff --git a/apps/jurumarble/src/components/AuthProcess.tsx b/apps/jurumarble/src/components/AuthProcess.tsx index d99075c6..2d3ac4d4 100644 --- a/apps/jurumarble/src/components/AuthProcess.tsx +++ b/apps/jurumarble/src/components/AuthProcess.tsx @@ -1,12 +1,12 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -"use client"; +'use client'; -import { useEffect } from "react"; +import { useEffect } from 'react'; -import Path from "lib/Path"; -import { getUserInfoAPI } from "lib/apis/user"; -import { isLogin } from "lib/utils/auth"; -import { usePathname, useRouter } from "next/navigation"; +import Path from 'lib/Path'; +import { getUserInfoAPI } from 'lib/apis/user'; +import { isLogin } from 'lib/utils/auth'; +import { usePathname, useRouter } from 'next/navigation'; const LOGIN_BLOCK_PATHS = [ Path.LOGIN_PAGE, @@ -43,7 +43,7 @@ function AuthProcess() { router.push(Path.REGISTER_PAGE); } } catch (error) { - alert("에러가 발생하였습니다."); + alert('에러가 발생하였습니다.'); } }; diff --git a/apps/jurumarble/src/components/BottomBar.tsx b/apps/jurumarble/src/components/BottomBar.tsx index 96364fb5..da54b3de 100644 --- a/apps/jurumarble/src/components/BottomBar.tsx +++ b/apps/jurumarble/src/components/BottomBar.tsx @@ -1,37 +1,37 @@ -"use client"; +'use client'; -import Path from "lib/Path"; -import { usePathname, useRouter } from "next/navigation"; -import SvgIcCheck from "src/assets/icons/components/IcCheck"; -import SvgIcHome from "src/assets/icons/components/IcHome"; -import SvgIcMapPin from "src/assets/icons/components/IcMapPin"; -import SvgIcMark from "src/assets/icons/components/IcMark"; -import SvgIcUser from "src/assets/icons/components/IcUser"; -import styled from "styled-components"; +import Path from 'lib/Path'; +import { usePathname, useRouter } from 'next/navigation'; +import SvgIcCheck from 'src/assets/icons/components/IcCheck'; +import SvgIcHome from 'src/assets/icons/components/IcHome'; +import SvgIcMapPin from 'src/assets/icons/components/IcMapPin'; +import SvgIcMark from 'src/assets/icons/components/IcMark'; +import SvgIcUser from 'src/assets/icons/components/IcUser'; +import styled from 'styled-components'; const NAVIGATION_LIST = [ { - name: "홈", + name: '홈', path: Path.MAIN_PAGE, icon: , }, { - name: "술도장", + name: '술도장', path: Path.STAMP_PAGE, icon: , }, { - name: "투표", + name: '투표', path: Path.VOTE_HOME, icon: , }, { - name: "술지도", + name: '술지도', path: Path.DRINK_MAP_PAGE, icon: , }, { - name: "마이", + name: '마이', path: Path.MY_PAGE, icon: , }, @@ -47,7 +47,11 @@ function BottomBar() { {NAVIGATION_LIST.map(({ icon, name, path }) => { return ( - router.push(path)}> + router.push(path)} + > {icon} {name} @@ -84,7 +88,8 @@ const BarItem = styled.div<{ isActive: boolean }>` flex-direction: column; align-items: center; justify-content: center; - color: ${({ isActive, theme }) => (isActive ? theme.colors.black_01 : theme.colors.black_05)}; + color: ${({ isActive, theme }) => + isActive ? theme.colors.black_01 : theme.colors.black_05}; cursor: pointer; `; diff --git a/apps/jurumarble/src/components/Chip.tsx b/apps/jurumarble/src/components/Chip.tsx index 347bc91f..23fde584 100644 --- a/apps/jurumarble/src/components/Chip.tsx +++ b/apps/jurumarble/src/components/Chip.tsx @@ -1,11 +1,11 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { - variant: "region" | "numberOfParticipants" | "isVote"; + variant: 'region' | 'numberOfParticipants' | 'isVote'; children: React.ReactNode; } -type variant = Pick; +type variant = Pick; function Chip({ variant, children }: Props) { return {children}; diff --git a/apps/jurumarble/src/components/DivideLine.tsx b/apps/jurumarble/src/components/DivideLine.tsx index 80e1075e..6e927625 100644 --- a/apps/jurumarble/src/components/DivideLine.tsx +++ b/apps/jurumarble/src/components/DivideLine.tsx @@ -1,4 +1,4 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; function DivideLine() { return ; diff --git a/apps/jurumarble/src/components/Header.tsx b/apps/jurumarble/src/components/Header.tsx index ae0adff7..87e62ef4 100644 --- a/apps/jurumarble/src/components/Header.tsx +++ b/apps/jurumarble/src/components/Header.tsx @@ -1,9 +1,13 @@ -"use client"; +'use client'; -import Path from "lib/Path"; -import Link from "next/link"; -import { SvgHeaderSearch, SvgLogo, SvgNotification } from "src/assets/icons/components"; -import styled from "styled-components"; +import Path from 'lib/Path'; +import Link from 'next/link'; +import { + SvgHeaderSearch, + SvgLogo, + SvgNotification, +} from 'src/assets/icons/components'; +import styled from 'styled-components'; function Header() { return ( diff --git a/apps/jurumarble/src/components/ImageUploadButton.tsx b/apps/jurumarble/src/components/ImageUploadButton.tsx index c9126856..0e2b0cb3 100644 --- a/apps/jurumarble/src/components/ImageUploadButton.tsx +++ b/apps/jurumarble/src/components/ImageUploadButton.tsx @@ -1,9 +1,9 @@ -import SvgIcCamera from "src/assets/icons/components/IcCamera"; -import styled, { css, useTheme } from "styled-components"; +import SvgIcCamera from 'src/assets/icons/components/IcCamera'; +import styled, { css, useTheme } from 'styled-components'; interface Props { - width: `${number}px` | `${number}%` | "auto"; - height: `${number}px` | `${number}%` | "auto"; + width: `${number}px` | `${number}%` | 'auto'; + height: `${number}px` | `${number}%` | 'auto'; } function ImageUploadButton({ width, height }: Props) { diff --git a/apps/jurumarble/src/components/LevelChip.tsx b/apps/jurumarble/src/components/LevelChip.tsx index 55ad790a..eaafa84c 100644 --- a/apps/jurumarble/src/components/LevelChip.tsx +++ b/apps/jurumarble/src/components/LevelChip.tsx @@ -1,4 +1,4 @@ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { level: number; diff --git a/apps/jurumarble/src/components/Loading.tsx b/apps/jurumarble/src/components/Loading.tsx index fca6f4e3..961399da 100644 --- a/apps/jurumarble/src/components/Loading.tsx +++ b/apps/jurumarble/src/components/Loading.tsx @@ -1,6 +1,6 @@ -"use client"; +'use client'; -import styled from "styled-components"; +import styled from 'styled-components'; const Loading = () => { return ( @@ -34,7 +34,7 @@ const Box = styled.div` } .loader4:before { - content: ""; + content: ''; position: absolute; background-color: ${({ theme }) => theme.colors.main_01}; top: 0px; @@ -50,7 +50,7 @@ const Box = styled.div` } .loader4:after { - content: "LOADING ..."; + content: 'LOADING ...'; color: ${({ theme }) => theme.colors.main_01}; font-weight: 200; font-size: 16px; diff --git a/apps/jurumarble/src/components/SearchInput.tsx b/apps/jurumarble/src/components/SearchInput.tsx index 0635e27e..771489dd 100644 --- a/apps/jurumarble/src/components/SearchInput.tsx +++ b/apps/jurumarble/src/components/SearchInput.tsx @@ -1,11 +1,11 @@ -"use client"; +'use client'; -import { FormEvent, forwardRef, MouseEvent } from "react"; +import { FormEvent, forwardRef, MouseEvent } from 'react'; -import { Button } from "components/button"; -import { Input } from "components/input"; -import SvgIcSearch from "src/assets/icons/components/IcSearch"; -import styled, { css, useTheme } from "styled-components"; +import { Button } from 'components/button'; +import { Input } from 'components/input'; +import SvgIcSearch from 'src/assets/icons/components/IcSearch'; +import styled, { css, useTheme } from 'styled-components'; /** * @TODO 리팩토링 필요 @@ -16,7 +16,9 @@ interface Props { value: string; onChange?: (keyword: string) => void; placeholder?: string; - eventHandler?: (e: FormEvent | MouseEvent) => void; + eventHandler?: ( + e: FormEvent | MouseEvent, + ) => void; } const SearchInput = forwardRef( diff --git a/apps/jurumarble/src/components/VoteHeader.tsx b/apps/jurumarble/src/components/VoteHeader.tsx index 5b89e416..b54d805b 100644 --- a/apps/jurumarble/src/components/VoteHeader.tsx +++ b/apps/jurumarble/src/components/VoteHeader.tsx @@ -1,6 +1,6 @@ -import { ReactNode } from "react"; +import { ReactNode } from 'react'; -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface Props { leftButton?: ReactNode; diff --git a/apps/jurumarble/src/components/button/Button.tsx b/apps/jurumarble/src/components/button/Button.tsx index e699e3cd..aba86df8 100644 --- a/apps/jurumarble/src/components/button/Button.tsx +++ b/apps/jurumarble/src/components/button/Button.tsx @@ -1,12 +1,12 @@ -import React from "react"; +import React from 'react'; -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface ButtonStyledProps { /** * 버튼 타입 */ - variant?: "primary" | "outline"; + variant?: 'primary' | 'outline'; /** * 버튼 가로 길이 */ @@ -21,11 +21,20 @@ interface ButtonStyledProps { borderRadius?: string; } -interface ButtonProps extends React.ButtonHTMLAttributes, ButtonStyledProps { +interface ButtonProps + extends React.ButtonHTMLAttributes, + ButtonStyledProps { children: React.ReactNode; } -function Button({ width, height, variant, borderRadius = "10px", children, ...rest }: ButtonProps) { +function Button({ + width, + height, + variant, + borderRadius = '10px', + children, + ...rest +}: ButtonProps) { return ( { /** * Input 형태 */ - variant?: "standard" | "outlined"; + variant?: 'standard' | 'outlined'; /** * Input 가로 길이 */ - width: `${number}px` | `${number}%` | "auto"; + width: `${number}px` | `${number}%` | 'auto'; /** * 포커스 여뿌 * 기본 값 : false diff --git a/apps/jurumarble/src/components/input/index.ts b/apps/jurumarble/src/components/input/index.ts index a5f313c2..b4d38647 100644 --- a/apps/jurumarble/src/components/input/index.ts +++ b/apps/jurumarble/src/components/input/index.ts @@ -1 +1 @@ -export { default as Input } from "./Input"; +export { default as Input } from './Input'; diff --git a/apps/jurumarble/src/components/layouts/index.ts b/apps/jurumarble/src/components/layouts/index.ts index ae8a3b92..a0535228 100644 --- a/apps/jurumarble/src/components/layouts/index.ts +++ b/apps/jurumarble/src/components/layouts/index.ts @@ -1 +1 @@ -export * from "./PageLayout"; +export * from './PageLayout'; diff --git a/apps/jurumarble/src/components/modal/FloatComponentTemplate.tsx b/apps/jurumarble/src/components/modal/FloatComponentTemplate.tsx index dcdab77e..c26386d3 100644 --- a/apps/jurumarble/src/components/modal/FloatComponentTemplate.tsx +++ b/apps/jurumarble/src/components/modal/FloatComponentTemplate.tsx @@ -1,8 +1,8 @@ -import React from "react"; +import React from 'react'; -import styled from "styled-components"; +import styled from 'styled-components'; -import Portal from "./Portal"; +import Portal from './Portal'; /** * @description diff --git a/apps/jurumarble/src/components/modal/ModalTemplate.tsx b/apps/jurumarble/src/components/modal/ModalTemplate.tsx index 7f975b22..21ff9a2b 100644 --- a/apps/jurumarble/src/components/modal/ModalTemplate.tsx +++ b/apps/jurumarble/src/components/modal/ModalTemplate.tsx @@ -1,9 +1,9 @@ -import React from "react"; +import React from 'react'; -import { transitions } from "lib/styles"; -import styled from "styled-components"; +import { transitions } from 'lib/styles'; +import styled from 'styled-components'; -import Portal from "./Portal"; +import Portal from './Portal'; interface ModalInnerStyled { width: `${number}px` | `${number}%`; @@ -15,11 +15,21 @@ interface ModalTemplateProps extends ModalInnerStyled { onToggleModal: () => void; } -function ModalTemplate({ width, height, children, onToggleModal, ...rest }: ModalTemplateProps) { +function ModalTemplate({ + width, + height, + children, + onToggleModal, + ...rest +}: ModalTemplateProps) { return ( - e.stopPropagation()}> + e.stopPropagation()} + > {children} diff --git a/apps/jurumarble/src/components/modal/Portal.tsx b/apps/jurumarble/src/components/modal/Portal.tsx index fc4cff67..44972659 100644 --- a/apps/jurumarble/src/components/modal/Portal.tsx +++ b/apps/jurumarble/src/components/modal/Portal.tsx @@ -1,6 +1,6 @@ -import { ReactNode, ReactPortal, useEffect, useState } from "react"; +import { ReactNode, ReactPortal, useEffect, useState } from 'react'; -import ReactDOM from "react-dom"; +import ReactDOM from 'react-dom'; interface PortalProps { children: ReactNode; diff --git a/apps/jurumarble/src/components/selectBox/Option.tsx b/apps/jurumarble/src/components/selectBox/Option.tsx index 0a67dcf4..47dc0537 100644 --- a/apps/jurumarble/src/components/selectBox/Option.tsx +++ b/apps/jurumarble/src/components/selectBox/Option.tsx @@ -1,4 +1,4 @@ -import styled from "styled-components"; +import styled from 'styled-components'; interface Props { label: string; diff --git a/apps/jurumarble/src/components/selectBox/OptionList.tsx b/apps/jurumarble/src/components/selectBox/OptionList.tsx index 4a6cdffd..c2783029 100644 --- a/apps/jurumarble/src/components/selectBox/OptionList.tsx +++ b/apps/jurumarble/src/components/selectBox/OptionList.tsx @@ -1,7 +1,7 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; -import Option from "./Option"; +import Option from './Option'; interface Option { value: string; diff --git a/apps/jurumarble/src/components/selectBox/Select.tsx b/apps/jurumarble/src/components/selectBox/Select.tsx index 18951a43..31c8af98 100644 --- a/apps/jurumarble/src/components/selectBox/Select.tsx +++ b/apps/jurumarble/src/components/selectBox/Select.tsx @@ -1,7 +1,7 @@ -import { useOutsideClick } from "@monorepo/hooks"; +import { useOutsideClick } from '@monorepo/hooks'; -import OptionList from "./OptionList"; -import SelectButton from "./SelectButton"; +import OptionList from './OptionList'; +import SelectButton from './SelectButton'; interface Option { value: string; @@ -38,7 +38,7 @@ function Select({ options={options} onChangeSelectedOption={onChangeSelectedOption} onToggleOpen={onToggleOpen} - /> + /> ) : null}
); diff --git a/apps/jurumarble/src/components/selectBox/SelectButton.tsx b/apps/jurumarble/src/components/selectBox/SelectButton.tsx index 7600791e..34832f9e 100644 --- a/apps/jurumarble/src/components/selectBox/SelectButton.tsx +++ b/apps/jurumarble/src/components/selectBox/SelectButton.tsx @@ -1,4 +1,4 @@ -import styled from "styled-components"; +import styled from 'styled-components'; interface SelectProps { children: React.ReactNode; diff --git a/apps/jurumarble/src/components/selectBox/index.ts b/apps/jurumarble/src/components/selectBox/index.ts index 66b3dd86..9bb96ca3 100644 --- a/apps/jurumarble/src/components/selectBox/index.ts +++ b/apps/jurumarble/src/components/selectBox/index.ts @@ -1,4 +1,4 @@ -export { default as Option } from "./Option"; -export { default as OptionList } from "./OptionList"; -export { default as SelectButton } from "./SelectButton"; -export { default as Select } from "./Select"; +export { default as Option } from './Option'; +export { default as OptionList } from './OptionList'; +export { default as SelectButton } from './SelectButton'; +export { default as Select } from './Select'; diff --git a/apps/jurumarble/src/components/textarea/Textarea.tsx b/apps/jurumarble/src/components/textarea/Textarea.tsx index 05e7599b..03736d4c 100644 --- a/apps/jurumarble/src/components/textarea/Textarea.tsx +++ b/apps/jurumarble/src/components/textarea/Textarea.tsx @@ -1,20 +1,20 @@ -import { TextareaHTMLAttributes } from "react"; +import { TextareaHTMLAttributes } from 'react'; -import styled, { css } from "styled-components"; +import styled, { css } from 'styled-components'; interface TextareaProps extends TextareaHTMLAttributes { /** * Input 형태 */ - variant?: "standard" | "outlined"; + variant?: 'standard' | 'outlined'; /** * Input 가로 길이 */ - width: `${number}px` | `${number}%` | "auto"; + width: `${number}px` | `${number}%` | 'auto'; /** * Input 가로 길이 */ - height: `${number}px` | `${number}%` | "auto"; + height: `${number}px` | `${number}%` | 'auto'; /** * 포커스 여부 * 기본 값 : false diff --git a/apps/jurumarble/src/hooks/useCreateQueryString.ts b/apps/jurumarble/src/hooks/useCreateQueryString.ts index 6481a7bc..68ddcbee 100644 --- a/apps/jurumarble/src/hooks/useCreateQueryString.ts +++ b/apps/jurumarble/src/hooks/useCreateQueryString.ts @@ -1,6 +1,6 @@ -import { useCallback } from "react"; +import { useCallback } from 'react'; -import { ReadonlyURLSearchParams } from "next/navigation"; +import { ReadonlyURLSearchParams } from 'next/navigation'; export function useCreateQueryString(searchParams: ReadonlyURLSearchParams) { const createQueryString = useCallback( diff --git a/apps/jurumarble/src/hooks/useInput.ts b/apps/jurumarble/src/hooks/useInput.ts index 46c5ea15..f2089829 100644 --- a/apps/jurumarble/src/hooks/useInput.ts +++ b/apps/jurumarble/src/hooks/useInput.ts @@ -1,6 +1,6 @@ -import { useCallback, useState } from "react"; +import { useCallback, useState } from 'react'; -import { useDebouncedCallback } from "@react-hookz/web"; +import { useDebouncedCallback } from '@react-hookz/web'; interface UseInputHookType { /** @@ -32,8 +32,10 @@ export default function useInput({ useDebounce = false, debounceTimeout = 150, }: UseInputHookType) { - const [value, setValue] = useState(initialValue ?? ""); - const [debouncedValue, setDebouncedValue] = useState(initialValue ?? ""); + const [value, setValue] = useState(initialValue ?? ''); + const [debouncedValue, setDebouncedValue] = useState( + initialValue ?? '', + ); const debouncedChange = useDebouncedCallback( (keyword: string) => { diff --git a/apps/jurumarble/src/lib/Path.ts b/apps/jurumarble/src/lib/Path.ts index 6ef00932..deeecb82 100644 --- a/apps/jurumarble/src/lib/Path.ts +++ b/apps/jurumarble/src/lib/Path.ts @@ -2,27 +2,27 @@ // 라고 copilot이 말함 const Path = { - DRINK_INFO_PAGE: "/drink-info", - DRINK_MAP_PAGE: "/map", - KAKAO_LOGIN_PROCESS: "/login/kakao-login-process", + DRINK_INFO_PAGE: '/drink-info', + DRINK_MAP_PAGE: '/map', + KAKAO_LOGIN_PROCESS: '/login/kakao-login-process', // no Logged In - LOGIN_PAGE: "/login", + LOGIN_PAGE: '/login', // common - MAIN_PAGE: "/", - MY_PAGE: "/my", - NAVER_LOGIN_PROCESS: "/login/naver-login-process", - NOTIFICATION_PAGE: "/notification", - POST_PAGE: "/vote/post", - PROFILE_EDIT: "/my/edit", + MAIN_PAGE: '/', + MY_PAGE: '/my', + NAVER_LOGIN_PROCESS: '/login/naver-login-process', + NOTIFICATION_PAGE: '/notification', + POST_PAGE: '/vote/post', + PROFILE_EDIT: '/my/edit', // logged In - REGISTER_PAGE: "/register", - SEARCH_PAGE: "/search", - STAMP_PAGE: "/stamp", - TEST_PAGE: "/test", - VOTE_DETAIL_PAGE: "/vote", - VOTE_HOME: "/vote", + REGISTER_PAGE: '/register', + SEARCH_PAGE: '/search', + STAMP_PAGE: '/stamp', + TEST_PAGE: '/test', + VOTE_DETAIL_PAGE: '/vote', + VOTE_HOME: '/vote', } as const; export default Path; diff --git a/apps/jurumarble/src/lib/ReactQueryProvider.tsx b/apps/jurumarble/src/lib/ReactQueryProvider.tsx index d2a9f499..c1322271 100644 --- a/apps/jurumarble/src/lib/ReactQueryProvider.tsx +++ b/apps/jurumarble/src/lib/ReactQueryProvider.tsx @@ -1,9 +1,9 @@ -"use client"; +'use client'; -import { PropsWithChildren, useState } from "react"; +import { PropsWithChildren, useState } from 'react'; -import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; -import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; export default function ReactQueryProvider({ children }: PropsWithChildren) { const [reactQueryClient] = useState( diff --git a/apps/jurumarble/src/lib/apis/auth.ts b/apps/jurumarble/src/lib/apis/auth.ts index 6ec979be..a2e8def3 100644 --- a/apps/jurumarble/src/lib/apis/auth.ts +++ b/apps/jurumarble/src/lib/apis/auth.ts @@ -1,5 +1,5 @@ -import axios from "axios"; -import { SERVER_URL } from "lib/constants"; +import axios from 'axios'; +import { SERVER_URL } from 'lib/constants'; export type CodeType = string | string[]; @@ -10,7 +10,10 @@ interface KakaoLoginRequest { } export const kakaoLoginAPI = async (kakaoLoginRequest: KakaoLoginRequest) => { - const response = await axios.post(`${SERVER_URL}api/users/signup/kakao`, kakaoLoginRequest); + const response = await axios.post( + `${SERVER_URL}api/users/signup/kakao`, + kakaoLoginRequest, + ); return response.data; }; @@ -20,6 +23,9 @@ interface NaverLoginRequest { } export const naverLoginAPI = async (naverLoginRequest: NaverLoginRequest) => { - const response = await axios.post(`${SERVER_URL}api/users/signup/naver`, naverLoginRequest); + const response = await axios.post( + `${SERVER_URL}api/users/signup/naver`, + naverLoginRequest, + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/bookmark.ts b/apps/jurumarble/src/lib/apis/bookmark.ts index b34aaf2d..bdcc366d 100644 --- a/apps/jurumarble/src/lib/apis/bookmark.ts +++ b/apps/jurumarble/src/lib/apis/bookmark.ts @@ -1,4 +1,4 @@ -import { http } from "./http/http"; +import { http } from './http/http'; export const postBookmarkAPI = async (voteId: number) => { const response = await http.post(`api/votes/${voteId}/bookmark`, { voteId }); @@ -10,6 +10,8 @@ interface GetBookmarkResponse { } export const getBookMarkCheckAPI = async (voteId: number) => { - const response = await http.get(`api/votes/${voteId}/bookmark`); + const response = await http.get( + `api/votes/${voteId}/bookmark`, + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/comment.ts b/apps/jurumarble/src/lib/apis/comment.ts index 255a9d3a..132618cb 100644 --- a/apps/jurumarble/src/lib/apis/comment.ts +++ b/apps/jurumarble/src/lib/apis/comment.ts @@ -1,6 +1,6 @@ -import { baseApi } from "./http/base"; -import { http } from "./http/http"; -import { AorB } from "./vote"; +import { baseApi } from './http/base'; +import { http } from './http/http'; +import { AorB } from './vote'; export interface PagingRequest { page: number; @@ -8,9 +8,9 @@ export interface PagingRequest { } export interface GetCommentRequest { - sortBy: "ByTime" | "ByPopularity"; + sortBy: 'ByTime' | 'ByPopularity'; paging: PagingRequest; - commentType: "votes" | "drinks"; + commentType: 'votes' | 'drinks'; typeId: number; } @@ -52,31 +52,38 @@ export const getCommentById = async ({ sortBy, typeId, }: GetCommentRequest) => { - const response = await baseApi.get(`api/${commentType}/${typeId}/comments`, { - params: { - sortBy, - page: paging.page, - size: paging.size, + const response = await baseApi.get( + `api/${commentType}/${typeId}/comments`, + { + params: { + sortBy, + page: paging.page, + size: paging.size, + }, }, - }); + ); return response.data; }; export const postLikeComment = async ( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', typeId: number, commentId: number, ) => { - const response = await http.post(`/api/${commentType}/${typeId}/comments/${commentId}/likers`); + const response = await http.post( + `/api/${commentType}/${typeId}/comments/${commentId}/likers`, + ); return response.data; }; export const postHateComment = async ( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', typeId: number, commentId: number, ) => { - const response = await http.post(`/api/${commentType}/${typeId}/comments/${commentId}/haters`); + const response = await http.post( + `/api/${commentType}/${typeId}/comments/${commentId}/haters`, + ); return response.data; }; @@ -86,31 +93,39 @@ export interface PostCommentRequest { } export const postComment = async ( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', voteId: number, body: PostCommentRequest, ) => { - const response = await http.post(`/api/${commentType}/${voteId}/comments/create`, body); + const response = await http.post( + `/api/${commentType}/${voteId}/comments/create`, + body, + ); return response.data; }; export const deleteComment = async ( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', typeId: number, commentId: number, ) => { - const response = await http.delete(`/api/${commentType}/${typeId}/comments/${commentId}`); + const response = await http.delete( + `/api/${commentType}/${typeId}/comments/${commentId}`, + ); return response.data; }; export const putComment = async ( - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', typeId: number, commentId: number, content: string, ) => { - const response = await http.put(`/api/${commentType}/${typeId}/comments/${commentId}`, { - content, - }); + const response = await http.put( + `/api/${commentType}/${typeId}/comments/${commentId}`, + { + content, + }, + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/common.ts b/apps/jurumarble/src/lib/apis/common.ts index 0541d78c..c2821f48 100644 --- a/apps/jurumarble/src/lib/apis/common.ts +++ b/apps/jurumarble/src/lib/apis/common.ts @@ -1,4 +1,4 @@ -import { http } from "./http/http"; +import { http } from './http/http'; export interface postVoteResponse { imageUrl: string; @@ -6,6 +6,6 @@ export interface postVoteResponse { } export const uploadImageAPI = async (body: FormData) => { - const response = await http.post("api/images", body); + const response = await http.post('api/images', body); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/drink.ts b/apps/jurumarble/src/lib/apis/drink.ts index f71f7ad2..328c6af1 100644 --- a/apps/jurumarble/src/lib/apis/drink.ts +++ b/apps/jurumarble/src/lib/apis/drink.ts @@ -1,10 +1,10 @@ -import axios from "axios"; -import { DATA_GO_API_KEY } from "lib/constants"; -import { DrinkInfoSortType } from "src/types/common"; -import { DrinkListResponse, DrinkMapResponse } from "src/types/drink"; +import axios from 'axios'; +import { DATA_GO_API_KEY } from 'lib/constants'; +import { DrinkInfoSortType } from 'src/types/common'; +import { DrinkListResponse, DrinkMapResponse } from 'src/types/drink'; -import { baseApi } from "./http/base"; -import { http } from "./http/http"; +import { baseApi } from './http/base'; +import { http } from './http/http'; export interface GetDrinkListRequest { page: number; @@ -17,7 +17,7 @@ export interface GetDrinkListRequest { interface GetDrinkListResponse extends DrinkListResponse {} export const getDrinkList = async (params: GetDrinkListRequest) => { - const response = await baseApi.get("api/drinks", { + const response = await baseApi.get('api/drinks', { params: { ...params, }, @@ -32,7 +32,7 @@ export interface GetHotDrinkResponse { image: string; } export const getHotDrinkList = async () => { - const response = await baseApi.get("api/drinks/hot"); + const response = await baseApi.get('api/drinks/hot'); return response.data; }; @@ -44,12 +44,17 @@ interface GetEnjoyedDrinkListRequest { export interface GetEnjoyedDrinkListResponse extends DrinkListResponse {} -export const getEnjoyedDrinkList = async (params: GetEnjoyedDrinkListRequest) => { - const response = await http.get("api/drinks/enjoys", { - params: { - ...params, +export const getEnjoyedDrinkList = async ( + params: GetEnjoyedDrinkListRequest, +) => { + const response = await http.get( + 'api/drinks/enjoys', + { + params: { + ...params, + }, }, - }); + ); return response.data; }; @@ -58,7 +63,9 @@ export interface GetIsEnjoyedDrinkAPIResponse { } export const getIsEnjoyedDrinkAPI = async (drinkId: number) => { - const response = await http.get(`api/drinks/${drinkId}/enjoy`); + const response = await http.get( + `api/drinks/${drinkId}/enjoy`, + ); return response.data; }; @@ -79,7 +86,7 @@ export interface GetDrinksMapRequest { } export const getDrinksMap = async (params: GetDrinksMapRequest) => { - const response = await baseApi.get("api/drinks/map", { + const response = await baseApi.get('api/drinks/map', { params: { ...params, }, @@ -102,14 +109,16 @@ export interface GetDrinkInfoResponse { } export const getDrinkInfo = async (drinkId: number) => { - const response = await baseApi.get(`api/drinks/${drinkId}`); + const response = await baseApi.get( + `api/drinks/${drinkId}`, + ); return response.data; }; interface GetDrinkRecommendationListRequest { page: number; perPage: number; - returnType?: "json" | "xml"; + returnType?: 'json' | 'xml'; } interface GetDrinkRecommendationListResponse { @@ -129,9 +138,11 @@ interface Data { 주원료: string; } -export const getDrinkRecommendationListAPI = async (params: GetDrinkRecommendationListRequest) => { +export const getDrinkRecommendationListAPI = async ( + params: GetDrinkRecommendationListRequest, +) => { const response = await axios.get( - "https://api.odcloud.kr/api/15048755/v1/uddi:fec53d3a-2bef-4494-b50e-f4e566f403e0", + 'https://api.odcloud.kr/api/15048755/v1/uddi:fec53d3a-2bef-4494-b50e-f4e566f403e0', { params: { ...params, diff --git a/apps/jurumarble/src/lib/apis/http/base.ts b/apps/jurumarble/src/lib/apis/http/base.ts index 5b986ff5..6e92dd4a 100644 --- a/apps/jurumarble/src/lib/apis/http/base.ts +++ b/apps/jurumarble/src/lib/apis/http/base.ts @@ -1,5 +1,5 @@ -import axios from "axios"; -import { SERVER_URL } from "lib/constants"; +import axios from 'axios'; +import { SERVER_URL } from 'lib/constants'; const axiosInstance = axios.create({ baseURL: SERVER_URL, diff --git a/apps/jurumarble/src/lib/apis/http/http.ts b/apps/jurumarble/src/lib/apis/http/http.ts index f888a089..4da40325 100644 --- a/apps/jurumarble/src/lib/apis/http/http.ts +++ b/apps/jurumarble/src/lib/apis/http/http.ts @@ -1,8 +1,8 @@ -import axios from "axios"; -import { SERVER_URL } from "lib/constants"; -import { logout } from "lib/utils/auth"; -import userStorage from "lib/utils/userStorage"; -import { toast } from "react-toastify"; +import axios from 'axios'; +import { SERVER_URL } from 'lib/constants'; +import { logout } from 'lib/utils/auth'; +import userStorage from 'lib/utils/userStorage'; +import { toast } from 'react-toastify'; const axiosInstance = axios.create({ baseURL: SERVER_URL, @@ -36,9 +36,11 @@ axiosInstance.interceptors.response.use( case 401: const tokens = userStorage.get(); - if (!tokens) {throw new Error("No tokens found");} + if (!tokens) { + throw new Error('No tokens found'); + } - alert("로그인이 만료되었습니다. 다시 로그인해주세요."); + alert('로그인이 만료되었습니다. 다시 로그인해주세요.'); logout(); @@ -51,18 +53,22 @@ axiosInstance.interceptors.response.use( throw new Error(error.response.data.message); default: - throw new Error("Unknown Error"); + throw new Error('Unknown Error'); } }, ); axiosInstance.interceptors.request.use((config) => { if (!config?.headers) { - throw new Error(`Expected 'config' and 'config.headers' not to be undefined`); + throw new Error( + `Expected 'config' and 'config.headers' not to be undefined`, + ); } const tokens = userStorage.get(); - if (!tokens) {throw new Error("No tokens found");} + if (!tokens) { + throw new Error('No tokens found'); + } const { accessToken } = tokens; if (accessToken) { diff --git a/apps/jurumarble/src/lib/apis/my.ts b/apps/jurumarble/src/lib/apis/my.ts index ea095960..e2574b92 100644 --- a/apps/jurumarble/src/lib/apis/my.ts +++ b/apps/jurumarble/src/lib/apis/my.ts @@ -1,23 +1,28 @@ -import { CommonVoteListResponse } from "src/types/vote"; +import { CommonVoteListResponse } from 'src/types/vote'; -import { http } from "./http/http"; +import { http } from './http/http'; interface GetMyVoteListRequest { page: number; size: number; } -export const getMyParticipatedVoteList = async (params: GetMyVoteListRequest) => { - const response = await http.get("api/votes/participated", { - params: { - ...params, +export const getMyParticipatedVoteList = async ( + params: GetMyVoteListRequest, +) => { + const response = await http.get( + 'api/votes/participated', + { + params: { + ...params, + }, }, - }); + ); return response.data; }; export const getMyCreatedVoteList = async (params: GetMyVoteListRequest) => { - const response = await http.get("api/votes/my-vote", { + const response = await http.get('api/votes/my-vote', { params: { ...params, }, @@ -26,11 +31,14 @@ export const getMyCreatedVoteList = async (params: GetMyVoteListRequest) => { }; export const getMyBookmarkedVoteList = async (params: GetMyVoteListRequest) => { - const response = await http.get("api/votes/bookmarked", { - params: { - ...params, + const response = await http.get( + 'api/votes/bookmarked', + { + params: { + ...params, + }, }, - }); + ); return response.data; }; @@ -41,7 +49,9 @@ interface GetVoteCountResponse { } export const getVoteCount = async () => { - const response = await http.get("api/user/mypage/count"); + const response = await http.get( + 'api/user/mypage/count', + ); return response.data; }; @@ -51,13 +61,15 @@ export interface UpdateUserInfoRequest { alcoholLimit: string; mbti: string; } -export const updateUserInfoAPI = async (updateUserInfoRequest: UpdateUserInfoRequest) => { - const response = await http.put("api/users", updateUserInfoRequest); +export const updateUserInfoAPI = async ( + updateUserInfoRequest: UpdateUserInfoRequest, +) => { + const response = await http.put('api/users', updateUserInfoRequest); return response.data; }; export const deleteUserAPI = async () => { - const response = await http.delete("api/users"); + const response = await http.delete('api/users'); return response.data; }; @@ -68,6 +80,8 @@ interface GetTheNumberOfMyVote { } export const getTheNumberOfMyVoteAPI = async () => { - const response = await http.get("api/votes/myActivities"); + const response = await http.get( + 'api/votes/myActivities', + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/notification.ts b/apps/jurumarble/src/lib/apis/notification.ts index 1f86ffbc..c804435a 100644 --- a/apps/jurumarble/src/lib/apis/notification.ts +++ b/apps/jurumarble/src/lib/apis/notification.ts @@ -1,6 +1,6 @@ -import { http } from "./http/http"; +import { http } from './http/http'; -export type NotificationType = "VOTE" | "COMMENT" | "ADMIN_NOTIFY"; +export type NotificationType = 'VOTE' | 'COMMENT' | 'ADMIN_NOTIFY'; interface Notification { id: number; @@ -14,7 +14,9 @@ interface Notification { type GetNotificationListResponse = Notification[]; export const getNotificationListAPI = async () => { - const response = await http.get("/api/notifications"); + const response = await http.get( + '/api/notifications', + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/report.ts b/apps/jurumarble/src/lib/apis/report.ts index 4914c54d..953b5791 100644 --- a/apps/jurumarble/src/lib/apis/report.ts +++ b/apps/jurumarble/src/lib/apis/report.ts @@ -1,9 +1,9 @@ -import { http } from "./http/http"; +import { http } from './http/http'; export const postReportVoteAPI = async (reportedVoteId: number) => { - return await http.post("/api/reports/votes", { reportedVoteId }); + return await http.post('/api/reports/votes', { reportedVoteId }); }; export const postReportCommentAPI = async (reportedCommentId: number) => { - return await http.post("/api/reports/comments", { reportedCommentId }); + return await http.post('/api/reports/comments', { reportedCommentId }); }; diff --git a/apps/jurumarble/src/lib/apis/restaurant.ts b/apps/jurumarble/src/lib/apis/restaurant.ts index 4f57f48e..4d580e03 100644 --- a/apps/jurumarble/src/lib/apis/restaurant.ts +++ b/apps/jurumarble/src/lib/apis/restaurant.ts @@ -1,8 +1,8 @@ -import { SERVER_URL } from "lib/constants"; +import { SERVER_URL } from 'lib/constants'; -import { http } from "./http/http"; +import { http } from './http/http'; -type CommentType = "votes" | "drinks"; +type CommentType = 'votes' | 'drinks'; interface GetRestaurantRequest { commentType: CommentType; @@ -96,10 +96,13 @@ export const putRestaurantAPI = async ({ restaurantName, restaurantImage, }: PutRestaurantRequest) => { - return await http.put(`${SERVER_URL}api/votes/${typeId}/comments/${commentId}/restaurant`, { - restaurantName, - restaurantImage, - }); + return await http.put( + `${SERVER_URL}api/votes/${typeId}/comments/${commentId}/restaurant`, + { + restaurantName, + restaurantImage, + }, + ); }; interface GetRestaurantImageRequest { diff --git a/apps/jurumarble/src/lib/apis/statistics.ts b/apps/jurumarble/src/lib/apis/statistics.ts index db46ea66..15359210 100644 --- a/apps/jurumarble/src/lib/apis/statistics.ts +++ b/apps/jurumarble/src/lib/apis/statistics.ts @@ -1,4 +1,4 @@ -import { baseApi } from "./http/base"; +import { baseApi } from './http/base'; interface GetVoteStatisticsResponse { message: string; diff --git a/apps/jurumarble/src/lib/apis/user.ts b/apps/jurumarble/src/lib/apis/user.ts index 3af0917c..048e41e6 100644 --- a/apps/jurumarble/src/lib/apis/user.ts +++ b/apps/jurumarble/src/lib/apis/user.ts @@ -1,7 +1,7 @@ -import { GENDER } from "lib/constants"; +import { GENDER } from 'lib/constants'; -import { baseApi } from "./http/base"; -import { http } from "./http/http"; +import { baseApi } from './http/base'; +import { http } from './http/http'; type GenderType = keyof typeof GENDER; @@ -17,7 +17,7 @@ export interface GetUserInfoResponse { } export const getUserInfoAPI = async () => { - const response = await http.get("api/users"); + const response = await http.get('api/users'); return response.data; }; @@ -29,7 +29,10 @@ interface AddUserInfoRequest { } export const addUserInfoAPI = async (params: AddUserInfoRequest) => { - const response = await http.put("api/users/additional-info", params); + const response = await http.put( + 'api/users/additional-info', + params, + ); return response.data; }; @@ -40,6 +43,6 @@ interface GetTestUserResponse { } export const getTestUserAPI = async () => { - const response = await baseApi.get("api/users/test"); + const response = await baseApi.get('api/users/test'); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/vote.ts b/apps/jurumarble/src/lib/apis/vote.ts index 1a48906e..6cc18b73 100644 --- a/apps/jurumarble/src/lib/apis/vote.ts +++ b/apps/jurumarble/src/lib/apis/vote.ts @@ -1,9 +1,9 @@ -import { SERVER_URL } from "lib/constants"; -import { VoteSortType } from "src/types/common"; -import { CommonVoteListResponse, Content } from "src/types/vote"; +import { SERVER_URL } from 'lib/constants'; +import { VoteSortType } from 'src/types/common'; +import { CommonVoteListResponse, Content } from 'src/types/vote'; -import { baseApi } from "./http/base"; -import { http } from "./http/http"; +import { baseApi } from './http/base'; +import { http } from './http/http'; export interface GetVoteListRequest { keyword?: string; @@ -24,8 +24,13 @@ interface GetVoteListResponse { empty: boolean; } -export const getVoteListAPI = async ({ page, size, sortBy, keyword }: GetVoteListRequest) => { - const response = await baseApi.get("api/votes", { +export const getVoteListAPI = async ({ + page, + size, + sortBy, + keyword, +}: GetVoteListRequest) => { + const response = await baseApi.get('api/votes', { params: { page, size, @@ -52,8 +57,8 @@ export interface GetVoteByIdResponse { titleB: string; region: string; postedUserAge: string | null; - postedUserAlcoholLimit: "HIGH" | "MEDIUM" | "LOW" | null; - postedUserGender: "" | ""; + postedUserAlcoholLimit: 'HIGH' | 'MEDIUM' | 'LOW' | null; + postedUserGender: '' | ''; postedUserId: number; postedUserImageUrl: null; postedUserMbti: string | null; @@ -63,7 +68,9 @@ export interface GetVoteByIdResponse { } export const getVoteByVoteIdAPI = async (voteId: number) => { - const response = await baseApi.get(`api/votes/${voteId}`); + const response = await baseApi.get( + `api/votes/${voteId}`, + ); return response.data; }; @@ -80,9 +87,12 @@ interface ModifyVoteRequest { titleB: string; } -export const modifyVoteAPI = async (newVoteInfo: ModifyVoteRequest, voteId: number) => { +export const modifyVoteAPI = async ( + newVoteInfo: ModifyVoteRequest, + voteId: number, +) => { const response = await fetch(`${SERVER_URL}api/votes/${voteId}`, { - method: "PUT", + method: 'PUT', body: JSON.stringify({ newVoteInfo, }), @@ -101,7 +111,7 @@ export interface PostNormalVoteRequest { } export const postNormalVoteAPI = async (voteInfo: PostNormalVoteRequest) => { - const response = await http.post("api/votes/normal", voteInfo); + const response = await http.post('api/votes/normal', voteInfo); return response.data; }; // export const postNormalVoteAPI = async (voteInfo: PostNormalVoteRequest) => { @@ -123,7 +133,7 @@ export interface PostDrinkVoteRequest { } export const postDrinkVoteAPI = async (voteInfo: PostDrinkVoteRequest) => { - const response = await http.post("api/votes/drink", voteInfo); + const response = await http.post('api/votes/drink', voteInfo); return response.data; }; @@ -140,27 +150,35 @@ export interface GetVotetDrinkListResponse { } export const getVoteDrinkList = async (params: GetVoteDrinkListRequest) => { - const response = await baseApi.get("api/votes/drinks", { - params: { - ...params, + const response = await baseApi.get( + 'api/votes/drinks', + { + params: { + ...params, + }, }, - }); + ); return response.data.voteSlice; }; -export const postExecuteVote = async (voteId: number, body: { choice: "A" | "B" | null }) => { +export const postExecuteVote = async ( + voteId: number, + body: { choice: 'A' | 'B' | null }, +) => { const response = await http.post(`api/votes/${voteId}/vote`, body); return response.data; }; -export type AorB = "A" | "B"; +export type AorB = 'A' | 'B'; interface GetVotingCheckResponse { userChoice: AorB | null; voted: boolean; } export const getVotingCheck = async (voteId: number) => { - const response = await http.get(`api/votes/${voteId}/voted`); + const response = await http.get( + `api/votes/${voteId}/voted`, + ); return response.data; }; diff --git a/apps/jurumarble/src/lib/apis/vote/getHotDrinkList.ts b/apps/jurumarble/src/lib/apis/vote/getHotDrinkList.ts index b3f5befc..02070420 100644 --- a/apps/jurumarble/src/lib/apis/vote/getHotDrinkList.ts +++ b/apps/jurumarble/src/lib/apis/vote/getHotDrinkList.ts @@ -1,4 +1,4 @@ -import { httpFetch } from "src/modules/httpFetch"; +import { httpFetch } from 'src/modules/httpFetch'; export interface GetHotDrinkResponse { drinkId: number; diff --git a/apps/jurumarble/src/lib/apis/vote/getHotDrinkVote.ts b/apps/jurumarble/src/lib/apis/vote/getHotDrinkVote.ts index fb74dfb0..5dbccabf 100644 --- a/apps/jurumarble/src/lib/apis/vote/getHotDrinkVote.ts +++ b/apps/jurumarble/src/lib/apis/vote/getHotDrinkVote.ts @@ -1,4 +1,4 @@ -import { httpFetch } from "src/modules/httpFetch"; +import { httpFetch } from 'src/modules/httpFetch'; interface GetHotDrinkVoteResponse { voteId: number; diff --git a/apps/jurumarble/src/lib/constants.tsx b/apps/jurumarble/src/lib/constants.tsx index 3c2c7c99..548a59fa 100644 --- a/apps/jurumarble/src/lib/constants.tsx +++ b/apps/jurumarble/src/lib/constants.tsx @@ -1,82 +1,123 @@ -import LevelChip from "components/LevelChip"; +import LevelChip from 'components/LevelChip'; import { DrinkCapacityHigh, DrinkCapacityLow, DrinkCapacityMedium, Female, Male, -} from "public/images"; +} from 'public/images'; -import Path from "./Path"; +import Path from './Path'; -export const CLIENT_URL = process.env.NEXT_PUBLIC_CLIENT_URL || ""; -export const SERVER_URL = process.env.NEXT_PUBLIC_SERVER_URL || ""; +export const CLIENT_URL = process.env.NEXT_PUBLIC_CLIENT_URL || ''; +export const SERVER_URL = process.env.NEXT_PUBLIC_SERVER_URL || ''; -export const KAKAO_CLIENT_ID = process.env.NEXT_PUBLIC_KAKAO_CLIENT_ID || ""; -export const NAVER_CLIENT_ID = process.env.NEXT_PUBLIC_NAVER_CLIENT_ID || ""; +export const KAKAO_CLIENT_ID = process.env.NEXT_PUBLIC_KAKAO_CLIENT_ID || ''; +export const NAVER_CLIENT_ID = process.env.NEXT_PUBLIC_NAVER_CLIENT_ID || ''; -export const KAKAO_MAP_API_KEY = process.env.NEXT_PUBLIC_KAKAO_MAP_API_KEY || ""; +export const KAKAO_MAP_API_KEY = + process.env.NEXT_PUBLIC_KAKAO_MAP_API_KEY || ''; export const KAKAO_LOGIN_REDIRECT_URL = - process.env.NODE_ENV === "development" + process.env.NODE_ENV === 'development' ? `http://localhost:3000/${Path.KAKAO_LOGIN_PROCESS}` : `${CLIENT_URL}${Path.KAKAO_LOGIN_PROCESS}`; export const NAVER_LOGIN_REDIRECT_URL = - process.env.NODE_ENV === "development" + process.env.NODE_ENV === 'development' ? `http://localhost:3000${Path.NAVER_LOGIN_PROCESS}` : `${CLIENT_URL}${Path.NAVER_LOGIN_PROCESS}`; -export const DATA_GO_API_KEY = process.env.NEXT_PUBLIC_DATA_GO_API_KEY || ""; +export const DATA_GO_API_KEY = process.env.NEXT_PUBLIC_DATA_GO_API_KEY || ''; export const REGION_LIST = [ - { value: "SEOUL", label: "서울", lat: 37.53391, long: 126.9775 }, - { value: "INCHEON", label: "인천", lat: 37.45323333333334, long: 126.70735277777779 }, - { value: "DAEJEON", label: "대전", lat: 36.347119444444445, long: 127.38656666666667 }, - { value: "DAEGU", label: "대구", lat: 35.868541666666665, long: 128.60355277777776 }, - { value: "GWANGJU", label: "광주", lat: 35.156974999999996, long: 126.85336388888888 }, - { value: "BUSAN", label: "부산", lat: 35.17701944444444, long: 129.07695277777776 }, - { value: "ULSAN", label: "울산", lat: 35.53540833333333, long: 129.3136888888889 }, - { value: "SEJONG", label: "세종", lat: 36.4800121, long: 127.289069 }, - { value: "GYEONGGI", label: "경기", lat: 37.39067, long: 126.7888 }, - { value: "GANGWON", label: "강원", lat: 38.642618, long: 127.170231 }, - { value: "CHUNGBUK", label: "충북", lat: 36.6325, long: 127.49358611111111 }, - { value: "CHUNGNAM", label: "충남", lat: 36.32387222222223, long: 127.42295555555556 }, - { value: "GYEONGBUK", label: "경북", lat: 36.491286, long: 128.889433 }, - { value: "GYEONGNAM", label: "경남", lat: 35.459369, long: 128.214826 }, - { value: "JEONBUK", label: "전북", lat: 35.81727, long: 127.11105277777777 }, - { value: "JEONNAM", label: "전남", lat: 34.813044444444444, long: 126.465 }, - { value: "JEJU", label: "제주", lat: 33.48569444444445, long: 126.50033333333333 }, + { value: 'SEOUL', label: '서울', lat: 37.53391, long: 126.9775 }, + { + value: 'INCHEON', + label: '인천', + lat: 37.45323333333334, + long: 126.70735277777779, + }, + { + value: 'DAEJEON', + label: '대전', + lat: 36.347119444444445, + long: 127.38656666666667, + }, + { + value: 'DAEGU', + label: '대구', + lat: 35.868541666666665, + long: 128.60355277777776, + }, + { + value: 'GWANGJU', + label: '광주', + lat: 35.156974999999996, + long: 126.85336388888888, + }, + { + value: 'BUSAN', + label: '부산', + lat: 35.17701944444444, + long: 129.07695277777776, + }, + { + value: 'ULSAN', + label: '울산', + lat: 35.53540833333333, + long: 129.3136888888889, + }, + { value: 'SEJONG', label: '세종', lat: 36.4800121, long: 127.289069 }, + { value: 'GYEONGGI', label: '경기', lat: 37.39067, long: 126.7888 }, + { value: 'GANGWON', label: '강원', lat: 38.642618, long: 127.170231 }, + { value: 'CHUNGBUK', label: '충북', lat: 36.6325, long: 127.49358611111111 }, + { + value: 'CHUNGNAM', + label: '충남', + lat: 36.32387222222223, + long: 127.42295555555556, + }, + { value: 'GYEONGBUK', label: '경북', lat: 36.491286, long: 128.889433 }, + { value: 'GYEONGNAM', label: '경남', lat: 35.459369, long: 128.214826 }, + { value: 'JEONBUK', label: '전북', lat: 35.81727, long: 127.11105277777777 }, + { value: 'JEONNAM', label: '전남', lat: 34.813044444444444, long: 126.465 }, + { + value: 'JEJU', + label: '제주', + lat: 33.48569444444445, + long: 126.50033333333333, + }, ]; export const DRINK_VOTE_SORT_LIST = [ - { value: "ByPopularity", label: "인기순" }, - { value: "ByTime", label: "최신순" }, + { value: 'ByPopularity', label: '인기순' }, + { value: 'ByTime', label: '최신순' }, ]; export const DRINK_INFO_SORT_LIST = [ - { value: "ByName", label: "이름순" }, - { value: "ByPopularity", label: "인기순" }, + { value: 'ByName', label: '이름순' }, + { value: 'ByPopularity', label: '인기순' }, ]; export const VOTE_GENDER_FILTER_LIST = [ - { value: "", label: "성별" }, - { value: "MALE", label: "남성" }, - { value: "FEMALE", label: "여성" }, + { value: '', label: '성별' }, + { value: 'MALE', label: '남성' }, + { value: 'FEMALE', label: '여성' }, ]; export const VOTE_AGE_FILTER_LIST = [ - { value: "", label: "나이" }, - { value: "teenager", label: "10대" }, - { value: "twenties", label: "20대" }, - { value: "thirties", label: "30대" }, - { value: "fourties", label: "40대" }, - { value: "fifties", label: "50대" }, + { value: '', label: '나이' }, + { value: 'teenager', label: '10대' }, + { value: 'twenties', label: '20대' }, + { value: 'thirties', label: '30대' }, + { value: 'fourties', label: '40대' }, + { value: 'fifties', label: '50대' }, ]; export const VOTE_ALCOHOL_FILTER_LIST = [ - { value: "", label: "술레벨" }, - { value: "LOW", label: "Lv.1" }, - { value: "MEDIUM", label: "Lv.2" }, - { value: "HIGH", label: "Lv.3" }, + { value: '', label: '술레벨' }, + { value: 'LOW', label: 'Lv.1' }, + { value: 'MEDIUM', label: 'Lv.2' }, + { value: 'HIGH', label: 'Lv.3' }, ]; /** @@ -84,85 +125,85 @@ export const VOTE_ALCOHOL_FILTER_LIST = [ */ export const GENDER = { - MALE: "MALE", - FEMALE: "FEMALE", + MALE: 'MALE', + FEMALE: 'FEMALE', } as const; export const GENDER_LIST = [ { - id: "MALE", - label: "남성", + id: 'MALE', + label: '남성', src: Male, }, { - id: "FEMALE", - label: "여성", + id: 'FEMALE', + label: '여성', src: Female, }, ] as const; -export type GenderTypes = (typeof GENDER_LIST)[number]["id"]; +export type GenderTypes = (typeof GENDER_LIST)[number]['id']; export const ALCOHOL_LEVEL_LIST = [ { - id: "LOW", - label: "아름다울 미(美)주가", - description: "도수가 비교적 낮은 맥주•막걸리•과실주 등 맛으로 즐기는 타입", + id: 'LOW', + label: '아름다울 미(美)주가', + description: '도수가 비교적 낮은 맥주•막걸리•과실주 등 맛으로 즐기는 타입', image: DrinkCapacityLow, levelChip: () => , }, { - id: "MEDIUM", - label: "즐거울 락(㦡)주가", - description: "소주 등 술맛이 나야 진정한 술이라고 생각하는 타입", + id: 'MEDIUM', + label: '즐거울 락(㦡)주가', + description: '소주 등 술맛이 나야 진정한 술이라고 생각하는 타입', image: DrinkCapacityMedium, levelChip: () => , }, { - id: "HIGH", - label: "사랑할 애(愛)주가", - description: "높은 도수의 소주•위스키 등 독한 술을 사랑하는 타입", + id: 'HIGH', + label: '사랑할 애(愛)주가', + description: '높은 도수의 소주•위스키 등 독한 술을 사랑하는 타입', image: DrinkCapacityHigh, levelChip: () => , }, ] as const; -export type DrinkCapacityTypes = (typeof ALCOHOL_LEVEL_LIST)[number]["id"]; +export type DrinkCapacityTypes = (typeof ALCOHOL_LEVEL_LIST)[number]['id']; export const MBTI_LIST = [ - { id: "ESTP", label: "ESTP" }, - { id: "ESFP", label: "ESFP" }, - { id: "ENFP", label: "ENFP" }, - { id: "ENTP", label: "ENTP" }, - { id: "ESTJ", label: "ESTJ" }, - { id: "ESFJ", label: "ESFJ" }, - { id: "ENFJ", label: "ENFJ" }, - { id: "ENTJ", label: "ENTJ" }, - { id: "ISTJ", label: "ISTJ" }, - { id: "ISFJ", label: "ISFJ" }, - { id: "INFJ", label: "INFJ" }, - { id: "INTJ", label: "INTJ" }, - { id: "ISTP", label: "ISTP" }, - { id: "ISFP", label: "ISFP" }, - { id: "INFP", label: "INFP" }, - { id: "INTP", label: "INTP" }, + { id: 'ESTP', label: 'ESTP' }, + { id: 'ESFP', label: 'ESFP' }, + { id: 'ENFP', label: 'ENFP' }, + { id: 'ENTP', label: 'ENTP' }, + { id: 'ESTJ', label: 'ESTJ' }, + { id: 'ESFJ', label: 'ESFJ' }, + { id: 'ENFJ', label: 'ENFJ' }, + { id: 'ENTJ', label: 'ENTJ' }, + { id: 'ISTJ', label: 'ISTJ' }, + { id: 'ISFJ', label: 'ISFJ' }, + { id: 'INFJ', label: 'INFJ' }, + { id: 'INTJ', label: 'INTJ' }, + { id: 'ISTP', label: 'ISTP' }, + { id: 'ISFP', label: 'ISFP' }, + { id: 'INFP', label: 'INFP' }, + { id: 'INTP', label: 'INTP' }, ]; export const VOTE_MBTI_LIST = [ - { value: "", label: "MBTI" }, - { value: "ESTP", label: "ESTP" }, - { value: "ESFP", label: "ESFP" }, - { value: "ENFP", label: "ENFP" }, - { value: "ENTP", label: "ENTP" }, - { value: "ESTJ", label: "ESTJ" }, - { value: "ESFJ", label: "ESFJ" }, - { value: "ENFJ", label: "ENFJ" }, - { value: "ENTJ", label: "ENTJ" }, - { value: "ISTJ", label: "ISTJ" }, - { value: "ISFJ", label: "ISFJ" }, - { value: "INFJ", label: "INFJ" }, - { value: "INTJ", label: "INTJ" }, - { value: "ISTP", label: "ISTP" }, - { value: "ISFP", label: "ISFP" }, - { value: "INFP", label: "INFP" }, - { value: "INTP", label: "INTP" }, + { value: '', label: 'MBTI' }, + { value: 'ESTP', label: 'ESTP' }, + { value: 'ESFP', label: 'ESFP' }, + { value: 'ENFP', label: 'ENFP' }, + { value: 'ENTP', label: 'ENTP' }, + { value: 'ESTJ', label: 'ESTJ' }, + { value: 'ESFJ', label: 'ESFJ' }, + { value: 'ENFJ', label: 'ENFJ' }, + { value: 'ENTJ', label: 'ENTJ' }, + { value: 'ISTJ', label: 'ISTJ' }, + { value: 'ISFJ', label: 'ISFJ' }, + { value: 'INFJ', label: 'INFJ' }, + { value: 'INTJ', label: 'INTJ' }, + { value: 'ISTP', label: 'ISTP' }, + { value: 'ISFP', label: 'ISFP' }, + { value: 'INFP', label: 'INFP' }, + { value: 'INTP', label: 'INTP' }, ]; diff --git a/apps/jurumarble/src/lib/env.ts b/apps/jurumarble/src/lib/env.ts index 7c668ef4..68fffa08 100644 --- a/apps/jurumarble/src/lib/env.ts +++ b/apps/jurumarble/src/lib/env.ts @@ -1,19 +1,20 @@ -import Path from "./Path"; +import Path from './Path'; -export const CLIENT_URL = process.env.NEXT_PUBLIC_CLIENT_URL || ""; -export const SERVER_URL = process.env.NEXT_PUBLIC_SERVER_URL || ""; +export const CLIENT_URL = process.env.NEXT_PUBLIC_CLIENT_URL || ''; +export const SERVER_URL = process.env.NEXT_PUBLIC_SERVER_URL || ''; -export const KAKAO_CLIENT_ID = process.env.NEXT_PUBLIC_KAKAO_CLIENT_ID || ""; -export const NAVER_CLIENT_ID = process.env.NEXT_PUBLIC_NAVER_CLIENT_ID || ""; +export const KAKAO_CLIENT_ID = process.env.NEXT_PUBLIC_KAKAO_CLIENT_ID || ''; +export const NAVER_CLIENT_ID = process.env.NEXT_PUBLIC_NAVER_CLIENT_ID || ''; -export const KAKAO_MAP_API_KEY = process.env.NEXT_PUBLIC_KAKAO_MAP_API_KEY || ""; +export const KAKAO_MAP_API_KEY = + process.env.NEXT_PUBLIC_KAKAO_MAP_API_KEY || ''; export const KAKAO_LOGIN_REDIRECT_URL = - process.env.NODE_ENV === "development" + process.env.NODE_ENV === 'development' ? `http://localhost:3000/${Path.KAKAO_LOGIN_PROCESS}` : `${CLIENT_URL}${Path.KAKAO_LOGIN_PROCESS}`; export const NAVER_LOGIN_REDIRECT_URL = - process.env.NODE_ENV === "development" + process.env.NODE_ENV === 'development' ? `http://localhost:3000${Path.NAVER_LOGIN_PROCESS}` : `${CLIENT_URL}${Path.NAVER_LOGIN_PROCESS}`; -export const DATA_GO_API_KEY = process.env.NEXT_PUBLIC_DATA_GO_API_KEY || ""; +export const DATA_GO_API_KEY = process.env.NEXT_PUBLIC_DATA_GO_API_KEY || ''; diff --git a/apps/jurumarble/src/lib/localFont.ts b/apps/jurumarble/src/lib/localFont.ts index 66f0860e..2102414a 100644 --- a/apps/jurumarble/src/lib/localFont.ts +++ b/apps/jurumarble/src/lib/localFont.ts @@ -1,16 +1,52 @@ -import { NextFont } from "next/dist/compiled/@next/font"; -import localFont from "next/font/local"; +import { NextFont } from 'next/dist/compiled/@next/font'; +import localFont from 'next/font/local'; export const pretandard: NextFont = localFont({ src: [ - { path: "../../public/font/Pretendard-Black.subset.woff", style: "normal", weight: "900" }, - { path: "../../public/font/Pretendard-ExtraBold.subset.woff", style: "normal", weight: "800" }, - { path: "../../public/font/Pretendard-Bold.subset.woff", style: "normal", weight: "700" }, - { path: "../../public/font/Pretendard-SemiBold.subset.woff", style: "normal", weight: "600" }, - { path: "../../public/font/Pretendard-Medium.subset.woff", style: "normal", weight: "500" }, - { path: "../../public/font/Pretendard-Regular.subset.woff", style: "normal", weight: "400" }, - { path: "../../public/font/Pretendard-Light.subset.woff", style: "normal", weight: "300" }, - { path: "../../public/font/Pretendard-ExtraLight.subset.woff", style: "normal", weight: "200" }, - { path: "../../public/font/Pretendard-Thin.subset.woff", style: "normal", weight: "100" }, + { + path: '../../public/font/Pretendard-Black.subset.woff', + style: 'normal', + weight: '900', + }, + { + path: '../../public/font/Pretendard-ExtraBold.subset.woff', + style: 'normal', + weight: '800', + }, + { + path: '../../public/font/Pretendard-Bold.subset.woff', + style: 'normal', + weight: '700', + }, + { + path: '../../public/font/Pretendard-SemiBold.subset.woff', + style: 'normal', + weight: '600', + }, + { + path: '../../public/font/Pretendard-Medium.subset.woff', + style: 'normal', + weight: '500', + }, + { + path: '../../public/font/Pretendard-Regular.subset.woff', + style: 'normal', + weight: '400', + }, + { + path: '../../public/font/Pretendard-Light.subset.woff', + style: 'normal', + weight: '300', + }, + { + path: '../../public/font/Pretendard-ExtraLight.subset.woff', + style: 'normal', + weight: '200', + }, + { + path: '../../public/font/Pretendard-Thin.subset.woff', + style: 'normal', + weight: '100', + }, ], }); diff --git a/apps/jurumarble/src/lib/queryKeys.ts b/apps/jurumarble/src/lib/queryKeys.ts index 4de0164d..46fc457e 100644 --- a/apps/jurumarble/src/lib/queryKeys.ts +++ b/apps/jurumarble/src/lib/queryKeys.ts @@ -1,47 +1,63 @@ export const queryKeys = { - BOOKMARK_CHECK: "bookmarkCheck" as const, - DETAIL_COMMENT_LIST: "commentByVoteId" as const, - DETAIL_FILTERED_ANALYSIS: "filteredAnalysisByVoteId" as const, - DETAIL_VOTE_COUNT: "voteCountByVoteId" as const, - DRINK_STAMP: "drinkStamp" as const, - DRINK_STAMP_LIST: "drinkStampList" as const, - DRINKS_INFO: "drinksInfo" as const, - DRINKS_MAP: "drinksMap" as const, - HOT_DRINK_LIST: "hotDrinkList" as const, - HOT_DRINK_VOTE: "hotDrinkVote" as const, - LOGIN_INFO: "loginInfo" as const, - MAIN_VOTE_LIST: "mainVoteList" as const, - MY_BOOKMARKED_VOTE: "myBookmarkedVote" as const, - MY_CREATED_VOTE: "myCreatedVote" as const, - MY_PARTICIPATED_VOTE: "myParticipatedVote" as const, - NOTIFICATION_LIST: "notificationList" as const, - RESTAURANT_IMAGE_LIST: "restaurantImageList" as const, - RESTAURANT_LIST: "restaurantList" as const, - SEARCH_DRINK_LIST: "searchDrinkList" as const, - SEARCH_VOTE_DRINK_LIST: "searchVoteDrinkList" as const, - THE_NUMBER_OF_MY_VOTE: "theNumberOfMyVote" as const, - TODAY_DRINK_RECOMMENDATION: "todayDrinkRecommendation" as const, - USER_INFO: "userInfo" as const, - VOTE_DETAIL: "voteDetail" as const, - VOTE_LIST: "voteList" as const, - VOTING_CHECK: "votingCheck" as const, + BOOKMARK_CHECK: 'bookmarkCheck' as const, + DETAIL_COMMENT_LIST: 'commentByVoteId' as const, + DETAIL_FILTERED_ANALYSIS: 'filteredAnalysisByVoteId' as const, + DETAIL_VOTE_COUNT: 'voteCountByVoteId' as const, + DRINK_STAMP: 'drinkStamp' as const, + DRINK_STAMP_LIST: 'drinkStampList' as const, + DRINKS_INFO: 'drinksInfo' as const, + DRINKS_MAP: 'drinksMap' as const, + HOT_DRINK_LIST: 'hotDrinkList' as const, + HOT_DRINK_VOTE: 'hotDrinkVote' as const, + LOGIN_INFO: 'loginInfo' as const, + MAIN_VOTE_LIST: 'mainVoteList' as const, + MY_BOOKMARKED_VOTE: 'myBookmarkedVote' as const, + MY_CREATED_VOTE: 'myCreatedVote' as const, + MY_PARTICIPATED_VOTE: 'myParticipatedVote' as const, + NOTIFICATION_LIST: 'notificationList' as const, + RESTAURANT_IMAGE_LIST: 'restaurantImageList' as const, + RESTAURANT_LIST: 'restaurantList' as const, + SEARCH_DRINK_LIST: 'searchDrinkList' as const, + SEARCH_VOTE_DRINK_LIST: 'searchVoteDrinkList' as const, + THE_NUMBER_OF_MY_VOTE: 'theNumberOfMyVote' as const, + TODAY_DRINK_RECOMMENDATION: 'todayDrinkRecommendation' as const, + USER_INFO: 'userInfo' as const, + VOTE_DETAIL: 'voteDetail' as const, + VOTE_LIST: 'voteList' as const, + VOTING_CHECK: 'votingCheck' as const, }; export const reactQueryKeys = { detailCommentList: ( typeId: number, - commentType: "votes" | "drinks", + commentType: 'votes' | 'drinks', size?: number, page?: number, sortBy?: string, - ) => [queryKeys.DETAIL_COMMENT_LIST, typeId, commentType, size, page, sortBy] as const, + ) => + [ + queryKeys.DETAIL_COMMENT_LIST, + typeId, + commentType, + size, + page, + sortBy, + ] as const, detailFilterdAnalysis: ( id: number, mbti?: string, gender?: string, age?: string, alcoholLimit?: string, - ) => [queryKeys.DETAIL_FILTERED_ANALYSIS, id, mbti, gender, age, alcoholLimit] as const, + ) => + [ + queryKeys.DETAIL_FILTERED_ANALYSIS, + id, + mbti, + gender, + age, + alcoholLimit, + ] as const, detailVoteCount: (id: number) => [queryKeys.DETAIL_VOTE_COUNT, id] as const, drinksInfo: (id: number) => [queryKeys.DRINKS_INFO, id] as const, drinksMap: ( diff --git a/apps/jurumarble/src/lib/registory.tsx b/apps/jurumarble/src/lib/registory.tsx index 26aa6e81..4d6d645a 100644 --- a/apps/jurumarble/src/lib/registory.tsx +++ b/apps/jurumarble/src/lib/registory.tsx @@ -1,11 +1,15 @@ -"use client"; +'use client'; -import React, { useState } from "react"; +import React, { useState } from 'react'; -import { useServerInsertedHTML } from "next/navigation"; -import { ServerStyleSheet, StyleSheetManager } from "styled-components"; +import { useServerInsertedHTML } from 'next/navigation'; +import { ServerStyleSheet, StyleSheetManager } from 'styled-components'; -export default function StyledComponentsRegistry({ children }: { children: React.ReactNode }) { +export default function StyledComponentsRegistry({ + children, +}: { + children: React.ReactNode; +}) { // Only create stylesheet once with lazy initial state // x-ref: https://reactjs.org/docs/hooks-reference.html#lazy-initial-state const [styledComponentsStyleSheet] = useState(() => new ServerStyleSheet()); @@ -18,11 +22,13 @@ export default function StyledComponentsRegistry({ children }: { children: React return <>{styles}; }); - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { return <>{children}; } return ( - {children} + + {children} + ); } diff --git a/apps/jurumarble/src/lib/styles/StyledComponents.tsx b/apps/jurumarble/src/lib/styles/StyledComponents.tsx index d3e81609..780ad963 100644 --- a/apps/jurumarble/src/lib/styles/StyledComponents.tsx +++ b/apps/jurumarble/src/lib/styles/StyledComponents.tsx @@ -1,14 +1,13 @@ -"use client"; +'use client'; -import { PropsWithChildren } from "react"; +import { PropsWithChildren } from 'react'; -import { theme } from "@monorepo/ui"; -import StyledComponentsRegistry from "lib/registory"; -import { ThemeProvider } from "styled-components"; - -import GlobalStyles from "./globalStyles"; -import { jurumarbleTheme } from "./theme"; +import { theme } from '@monorepo/ui'; +import StyledComponentsRegistry from 'lib/registory'; +import { ThemeProvider } from 'styled-components'; +import GlobalStyles from './globalStyles'; +import { jurumarbleTheme } from './theme'; function StyledComponents({ children }: PropsWithChildren) { const mergedTheme = { diff --git a/apps/jurumarble/src/lib/styles/getClassNames.ts b/apps/jurumarble/src/lib/styles/getClassNames.ts index e3a1f792..fa61791e 100644 --- a/apps/jurumarble/src/lib/styles/getClassNames.ts +++ b/apps/jurumarble/src/lib/styles/getClassNames.ts @@ -1,8 +1,10 @@ -import typography from "./typography.module.css"; +import typography from './typography.module.css'; type Styles = { [key: string]: string }; export function getClassNames(styles: T) { - type BooleanMap = Partial & { [key: string]: boolean }>; + type BooleanMap = Partial< + Record & { [key: string]: boolean } + >; type ClassNames = keyof T | false | null | undefined | BooleanMap; type ExtraClassName = ClassNames | Omit; @@ -16,16 +18,16 @@ export function getClassNames(styles: T) { const fn = (...classNames: MergedClassName[]) => { return (classNames.filter((cn) => cn) as (keyof T)[]) .map((className) => { - if (typeof className === "object") { + if (typeof className === 'object') { const keys = Object.keys(className) as (keyof T)[]; return keys .filter((key) => className[key]) .map((key) => styleUtils[key]) - .join(" "); + .join(' '); } return styleUtils[className] ?? className; }) - .join(" "); + .join(' '); }; return fn; diff --git a/apps/jurumarble/src/lib/styles/globalStyles.ts b/apps/jurumarble/src/lib/styles/globalStyles.ts index 2f23b55e..b526c607 100644 --- a/apps/jurumarble/src/lib/styles/globalStyles.ts +++ b/apps/jurumarble/src/lib/styles/globalStyles.ts @@ -1,5 +1,5 @@ -import { createGlobalStyle } from "styled-components"; -import reset from "styled-reset"; +import { createGlobalStyle } from 'styled-components'; +import reset from 'styled-reset'; const GlobalStyles = createGlobalStyle` ${reset} diff --git a/apps/jurumarble/src/lib/styles/index.ts b/apps/jurumarble/src/lib/styles/index.ts index 86aea7bd..f2865d20 100644 --- a/apps/jurumarble/src/lib/styles/index.ts +++ b/apps/jurumarble/src/lib/styles/index.ts @@ -1,6 +1,6 @@ -export * from "./theme"; -export { default as transitions } from "./transitions"; -export { default as GlobalStyles } from "./globalStyles"; -export { default as StyledComponents } from "./StyledComponents"; -export * from "./media"; -export * from "./depths"; +export * from './theme'; +export { default as transitions } from './transitions'; +export { default as GlobalStyles } from './globalStyles'; +export { default as StyledComponents } from './StyledComponents'; +export * from './media'; +export * from './depths'; diff --git a/apps/jurumarble/src/lib/styles/media.ts b/apps/jurumarble/src/lib/styles/media.ts index 545f1a3a..433c2f71 100644 --- a/apps/jurumarble/src/lib/styles/media.ts +++ b/apps/jurumarble/src/lib/styles/media.ts @@ -1,4 +1,5 @@ -export const mediaQuery = (minWidth: number) => `@media (min-width: ${minWidth}px)`; +export const mediaQuery = (minWidth: number) => + `@media (min-width: ${minWidth}px)`; export const mediaSize = { large: 1024, diff --git a/apps/jurumarble/src/lib/styles/styled.d.ts b/apps/jurumarble/src/lib/styles/styled.d.ts index 82cbaf1e..e87336b3 100644 --- a/apps/jurumarble/src/lib/styles/styled.d.ts +++ b/apps/jurumarble/src/lib/styles/styled.d.ts @@ -1,9 +1,9 @@ -import { theme } from "@monorepo/ui"; +import { theme } from '@monorepo/ui'; -import { ThemeColors, ThemeMedia, ThemeTypography } from "./theme"; +import { ThemeColors, ThemeMedia, ThemeTypography } from './theme'; type Theme = typeof theme; -declare module "styled-components" { +declare module 'styled-components' { export interface DefaultTheme extends Theme { colors: ThemeColors; typography: ThemeTypography; diff --git a/apps/jurumarble/src/lib/styles/theme.ts b/apps/jurumarble/src/lib/styles/theme.ts index 162583ce..ac8afa78 100644 --- a/apps/jurumarble/src/lib/styles/theme.ts +++ b/apps/jurumarble/src/lib/styles/theme.ts @@ -1,29 +1,29 @@ const colors = { - bg_01: "#f0f0f0", - bg_02: "#f5f5f5", - black_01: "#222222", - black_02: "#373737", - black_03: "#676767", - black_04: "#898989", - black_05: "#cccccc", - kakao: "#fee500", - line_01: "#e9e9e9", - line_02: "#f5f5f5", - main_01: "#ff4a16", - main_02: "#ffe8e1", - main_drop_shadow_bottom: "rgba(235, 235, 235, 0.80)", - main_drop_shadow_top: "rgba(235, 235, 235, 0.80)", - modal: "rgba(0, 0, 0, 0.5)", - modal_shadow: "rgba(235, 235, 235, 0.80)", - naver: "#03c75a", - sub_01: "#ffa183", - sub_02: "#aedac4", - system_black: "rgba(0, 0, 0, 0.80)", - system_blue: "rgba(0, 26, 255, 0.80)", - system_green: "#04b014", - system_red: "#dc0000", - system_yellow: "#f5a623", - white: "#ffffff", + bg_01: '#f0f0f0', + bg_02: '#f5f5f5', + black_01: '#222222', + black_02: '#373737', + black_03: '#676767', + black_04: '#898989', + black_05: '#cccccc', + kakao: '#fee500', + line_01: '#e9e9e9', + line_02: '#f5f5f5', + main_01: '#ff4a16', + main_02: '#ffe8e1', + main_drop_shadow_bottom: 'rgba(235, 235, 235, 0.80)', + main_drop_shadow_top: 'rgba(235, 235, 235, 0.80)', + modal: 'rgba(0, 0, 0, 0.5)', + modal_shadow: 'rgba(235, 235, 235, 0.80)', + naver: '#03c75a', + sub_01: '#ffa183', + sub_02: '#aedac4', + system_black: 'rgba(0, 0, 0, 0.80)', + system_blue: 'rgba(0, 26, 255, 0.80)', + system_green: '#04b014', + system_red: '#dc0000', + system_yellow: '#f5a623', + white: '#ffffff', } as const; const typography = { diff --git a/apps/jurumarble/src/lib/styles/transitions.ts b/apps/jurumarble/src/lib/styles/transitions.ts index 2e621101..78cdc7a5 100644 --- a/apps/jurumarble/src/lib/styles/transitions.ts +++ b/apps/jurumarble/src/lib/styles/transitions.ts @@ -1,4 +1,4 @@ -import { keyframes } from "styled-components"; +import { keyframes } from 'styled-components'; const fadeIn = keyframes` 0% { diff --git a/apps/jurumarble/src/lib/utils/auth.ts b/apps/jurumarble/src/lib/utils/auth.ts index 72f2427e..6e439972 100644 --- a/apps/jurumarble/src/lib/utils/auth.ts +++ b/apps/jurumarble/src/lib/utils/auth.ts @@ -1,18 +1,20 @@ -import Path from "lib/Path"; +import Path from 'lib/Path'; -import userStorage from "./userStorage"; +import userStorage from './userStorage'; export function logout() { - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { userStorage.remove(); window.location.replace(Path.MAIN_PAGE); } } export function isLogin() { - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { const user = userStorage.get(); - if (!user) {return false;} + if (!user) { + return false; + } const { accessToken } = user; return !!accessToken; diff --git a/apps/jurumarble/src/lib/utils/formatDate.ts b/apps/jurumarble/src/lib/utils/formatDate.ts index 08525a18..dcdc2fc6 100644 --- a/apps/jurumarble/src/lib/utils/formatDate.ts +++ b/apps/jurumarble/src/lib/utils/formatDate.ts @@ -1,7 +1,7 @@ export function formatDate(inputDate: string) { const date = new Date(inputDate); const year = date.getFullYear(); - const month = String(date.getMonth() + 1).padStart(2, "0"); - const day = String(date.getDate()).padStart(2, "0"); + const month = String(date.getMonth() + 1).padStart(2, '0'); + const day = String(date.getDate()).padStart(2, '0'); return `${year}. ${month}. ${day}`; } diff --git a/apps/jurumarble/src/lib/utils/formatUserInfo.ts b/apps/jurumarble/src/lib/utils/formatUserInfo.ts index b5d8b75a..62ace5e3 100644 --- a/apps/jurumarble/src/lib/utils/formatUserInfo.ts +++ b/apps/jurumarble/src/lib/utils/formatUserInfo.ts @@ -1,21 +1,35 @@ // male이 들어오면 남, female이 들어오면 여 리턴 export const convertGender = (gender: string) => { - if (gender === "MALE") {return "남";} - return "여"; + if (gender === 'MALE') { + return '남'; + } + return '여'; }; // age = teenager, twenties, thirties, fourties, fifties export const convertAge = (age: string) => { - if (age === "teenager") {return "10대";} - if (age === "twenties") {return "20대";} - if (age === "thirties") {return "30대";} - if (age === "fourties") {return "40대";} - return "50대"; + if (age === 'teenager') { + return '10대'; + } + if (age === 'twenties') { + return '20대'; + } + if (age === 'thirties') { + return '30대'; + } + if (age === 'fourties') { + return '40대'; + } + return '50대'; }; // lever = HIGH, MEDIUM, LOW export const convertLevel = (level: string) => { - if (level === "HIGH") {return "Lv.3";} - if (level === "MEDIUM") {return "Lv.2";} - return "Lv.1"; + if (level === 'HIGH') { + return 'Lv.3'; + } + if (level === 'MEDIUM') { + return 'Lv.2'; + } + return 'Lv.1'; }; diff --git a/apps/jurumarble/src/lib/utils/userStorage.ts b/apps/jurumarble/src/lib/utils/userStorage.ts index ac8731af..707a4977 100644 --- a/apps/jurumarble/src/lib/utils/userStorage.ts +++ b/apps/jurumarble/src/lib/utils/userStorage.ts @@ -1,4 +1,4 @@ -export const USER_STORAGE_KEY = "JURUMARBLE_USER"; +export const USER_STORAGE_KEY = 'JURUMARBLE_USER'; interface Token { accessToken: string; @@ -6,10 +6,12 @@ interface Token { const userStorage = { get() { - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { const user = localStorage.getItem(USER_STORAGE_KEY); try { - if (!user) {return null;} + if (!user) { + return null; + } const parsedUser = JSON.parse(user) as Token; return parsedUser; } catch (e) { @@ -19,12 +21,12 @@ const userStorage = { } }, set(user: Token) { - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { localStorage.setItem(USER_STORAGE_KEY, JSON.stringify(user)); } }, remove() { - if (typeof window !== "undefined") { + if (typeof window !== 'undefined') { localStorage.removeItem(USER_STORAGE_KEY); } }, diff --git a/apps/jurumarble/src/modules/getQueryClient.tsx b/apps/jurumarble/src/modules/getQueryClient.tsx index 2ba0ef40..019528b5 100644 --- a/apps/jurumarble/src/modules/getQueryClient.tsx +++ b/apps/jurumarble/src/modules/getQueryClient.tsx @@ -1,6 +1,6 @@ -import { cache } from "react"; +import { cache } from 'react'; -import { QueryClient } from "@tanstack/query-core"; +import { QueryClient } from '@tanstack/query-core'; const getQueryClient = cache(() => new QueryClient()); export default getQueryClient; diff --git a/apps/jurumarble/src/modules/httpFetch.ts b/apps/jurumarble/src/modules/httpFetch.ts index 3f16528a..7ed1be32 100644 --- a/apps/jurumarble/src/modules/httpFetch.ts +++ b/apps/jurumarble/src/modules/httpFetch.ts @@ -1,7 +1,7 @@ -import { createHttpFetch } from "@mogakko/http-fetch"; -import { SERVER_URL } from "lib/env"; -import { logout } from "lib/utils/auth"; -import userStorage from "lib/utils/userStorage"; +import { createHttpFetch } from '@mogakko/http-fetch'; +import { SERVER_URL } from 'lib/env'; +import { logout } from 'lib/utils/auth'; +import userStorage from 'lib/utils/userStorage'; export const httpFetch = createHttpFetch({ baseUrl: SERVER_URL, @@ -14,9 +14,9 @@ export const authHttpFetch = createHttpFetch({ if (response.status === 401) { const tokens = userStorage.get(); if (!tokens) { - throw new Error("No tokens found"); + throw new Error('No tokens found'); } - alert("로그인이 만료되었습니다. 다시 로그인해주세요."); + alert('로그인이 만료되었습니다. 다시 로그인해주세요.'); logout(); } return response; @@ -24,7 +24,7 @@ export const authHttpFetch = createHttpFetch({ request: async (args) => { const tokens = userStorage.get(); if (!tokens) { - throw new Error("No tokens found"); + throw new Error('No tokens found'); } const { accessToken } = tokens; diff --git a/apps/jurumarble/src/modules/hydrateOnClient.tsx b/apps/jurumarble/src/modules/hydrateOnClient.tsx index dedba797..e3c5a607 100644 --- a/apps/jurumarble/src/modules/hydrateOnClient.tsx +++ b/apps/jurumarble/src/modules/hydrateOnClient.tsx @@ -1,5 +1,5 @@ -"use client"; +'use client'; -import { Hydrate as HydrateOnClient } from "@tanstack/react-query"; +import { Hydrate as HydrateOnClient } from '@tanstack/react-query'; export default HydrateOnClient; diff --git a/apps/jurumarble/src/services/useBookmarkService.ts b/apps/jurumarble/src/services/useBookmarkService.ts index b6c11070..d8ecbb35 100644 --- a/apps/jurumarble/src/services/useBookmarkService.ts +++ b/apps/jurumarble/src/services/useBookmarkService.ts @@ -1,13 +1,19 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; -import Path from "lib/Path"; -import { getBookMarkCheckAPI, postBookmarkAPI } from "lib/apis/bookmark"; -import { queryKeys } from "lib/queryKeys"; -import { useRouter } from "next/navigation"; -import { toast } from "react-toastify"; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import Path from 'lib/Path'; +import { getBookMarkCheckAPI, postBookmarkAPI } from 'lib/apis/bookmark'; +import { queryKeys } from 'lib/queryKeys'; +import { useRouter } from 'next/navigation'; +import { toast } from 'react-toastify'; -type PostBookmarkProps = Exclude[0], undefined>; -const getBookmarkQueryKey = (params: PostBookmarkProps) => [queryKeys.BOOKMARK_CHECK, params]; +type PostBookmarkProps = Exclude< + Parameters[0], + undefined +>; +const getBookmarkQueryKey = (params: PostBookmarkProps) => [ + queryKeys.BOOKMARK_CHECK, + params, +]; export default function useBookmarkService(voteId: PostBookmarkProps) { const queryClient = useQueryClient(); @@ -24,30 +30,50 @@ export default function useBookmarkService(voteId: PostBookmarkProps) { const router = useRouter(); - const { mutate: mutateBookMark } = useMutation(() => postBookmarkAPI(voteId), { - async onMutate() { - await queryClient.cancelQueries(getBookmarkQueryKey(voteId)); - const previousData = queryClient.getQueryData(getBookmarkQueryKey(voteId)); - queryClient.setQueryData(getBookmarkQueryKey(voteId), (old: any) => [old, voteId]); - return { previousData }; - }, - onSuccess: () => { - const previousData = queryClient.getQueryData(getBookmarkQueryKey(voteId)) as any; - toast(previousData[0].bookmarked ? "북마크에서 삭제되었어요" : "북마크에 추가되었어요", { - toastId: "bookmark", - }); - }, - onError(err, drinkId, context) { - queryClient.setQueryData(getBookmarkQueryKey(voteId), context?.previousData); - if (confirm("로그인이 필요한 서비스입니다.")) { - router.push(Path.LOGIN_PAGE); - } - }, + const { mutate: mutateBookMark } = useMutation( + () => postBookmarkAPI(voteId), + { + async onMutate() { + await queryClient.cancelQueries(getBookmarkQueryKey(voteId)); + const previousData = queryClient.getQueryData( + getBookmarkQueryKey(voteId), + ); + queryClient.setQueryData(getBookmarkQueryKey(voteId), (old: any) => [ + old, + voteId, + ]); + return { previousData }; + }, + onSuccess: () => { + const previousData = queryClient.getQueryData( + getBookmarkQueryKey(voteId), + ) as any; + toast( + previousData[0].bookmarked + ? '북마크에서 삭제되었어요' + : '북마크에 추가되었어요', + { + toastId: 'bookmark', + }, + ); + }, + onError(err, drinkId, context) { + queryClient.setQueryData( + getBookmarkQueryKey(voteId), + context?.previousData, + ); + if (confirm('로그인이 필요한 서비스입니다.')) { + router.push(Path.LOGIN_PAGE); + } + }, - onSettled(_, __) { - queryClient.invalidateQueries({ queryKey: getBookmarkQueryKey(voteId) }); + onSettled(_, __) { + queryClient.invalidateQueries({ + queryKey: getBookmarkQueryKey(voteId), + }); + }, }, - }); + ); return { isBookmark, mutateBookMark }; } diff --git a/apps/jurumarble/src/services/useDrinkStampService.ts b/apps/jurumarble/src/services/useDrinkStampService.ts index a713ae13..c83cfb25 100644 --- a/apps/jurumarble/src/services/useDrinkStampService.ts +++ b/apps/jurumarble/src/services/useDrinkStampService.ts @@ -1,14 +1,21 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; -import { getIsEnjoyedDrinkAPI, postDrinkEnjoyAPI } from "lib/apis/drink"; -import { queryKeys } from "lib/queryKeys"; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import { getIsEnjoyedDrinkAPI, postDrinkEnjoyAPI } from 'lib/apis/drink'; +import { queryKeys } from 'lib/queryKeys'; -type PostDrinkStampProps = Exclude[0], undefined>; -const getDrinkStampQueryKey = (params: PostDrinkStampProps) => [queryKeys.DRINK_STAMP, params]; +type PostDrinkStampProps = Exclude< + Parameters[0], + undefined +>; +const getDrinkStampQueryKey = (params: PostDrinkStampProps) => [ + queryKeys.DRINK_STAMP, + params, +]; export default function useDrinkStampService(drinkId: PostDrinkStampProps) { - const { data: isStampedDrink } = useQuery(getDrinkStampQueryKey(drinkId), () => - getIsEnjoyedDrinkAPI(drinkId), + const { data: isStampedDrink } = useQuery( + getDrinkStampQueryKey(drinkId), + () => getIsEnjoyedDrinkAPI(drinkId), ); const queryClient = useQueryClient(); @@ -17,16 +24,26 @@ export default function useDrinkStampService(drinkId: PostDrinkStampProps) { { async onMutate(drinkId) { await queryClient.cancelQueries(getDrinkStampQueryKey(drinkId)); - const previousData = queryClient.getQueryData(getDrinkStampQueryKey(drinkId)); - queryClient.setQueryData(getDrinkStampQueryKey(drinkId), (old: any) => [old, drinkId]); + const previousData = queryClient.getQueryData( + getDrinkStampQueryKey(drinkId), + ); + queryClient.setQueryData(getDrinkStampQueryKey(drinkId), (old: any) => [ + old, + drinkId, + ]); return { previousData }; }, onError(err, drinkId, context) { - queryClient.setQueryData(getDrinkStampQueryKey(drinkId), context?.previousData); + queryClient.setQueryData( + getDrinkStampQueryKey(drinkId), + context?.previousData, + ); }, onSettled(_, __, drinkId) { - queryClient.invalidateQueries({ queryKey: getDrinkStampQueryKey(drinkId) }); + queryClient.invalidateQueries({ + queryKey: getDrinkStampQueryKey(drinkId), + }); }, }, ); diff --git a/apps/jurumarble/src/services/useGetUserInfo.ts b/apps/jurumarble/src/services/useGetUserInfo.ts index e29eae63..219a1c07 100644 --- a/apps/jurumarble/src/services/useGetUserInfo.ts +++ b/apps/jurumarble/src/services/useGetUserInfo.ts @@ -1,22 +1,26 @@ -import { useQuery } from "@tanstack/react-query"; -import { getUserInfoAPI, GetUserInfoResponse } from "lib/apis/user"; -import { queryKeys } from "lib/queryKeys"; +import { useQuery } from '@tanstack/react-query'; +import { getUserInfoAPI, GetUserInfoResponse } from 'lib/apis/user'; +import { queryKeys } from 'lib/queryKeys'; const getQueryKey = [queryKeys.USER_INFO]; export default function useGetUserInfo() { - const { data: userInfo } = useQuery(getQueryKey, getUserInfoAPI, { - placeholderData: () => ({ - alcoholLimit: "", - email: "", - gender: "MALE", - imageUrl: "", - mbti: "ESTJ", - nickname: "", - userId: 0, - yearOfBirth: 1990, - }), - }); + const { data: userInfo } = useQuery( + getQueryKey, + getUserInfoAPI, + { + placeholderData: () => ({ + alcoholLimit: '', + email: '', + gender: 'MALE', + imageUrl: '', + mbti: 'ESTJ', + nickname: '', + userId: 0, + yearOfBirth: 1990, + }), + }, + ); return { userInfo }; } diff --git a/apps/jurumarble/src/types/common.ts b/apps/jurumarble/src/types/common.ts index cff9eb21..92d453ff 100644 --- a/apps/jurumarble/src/types/common.ts +++ b/apps/jurumarble/src/types/common.ts @@ -1,5 +1,9 @@ -import { DRINK_INFO_SORT_LIST, DRINK_VOTE_SORT_LIST, REGION_LIST } from "lib/constants"; +import { + DRINK_INFO_SORT_LIST, + DRINK_VOTE_SORT_LIST, + REGION_LIST, +} from 'lib/constants'; -export type DrinkInfoSortType = (typeof DRINK_INFO_SORT_LIST)[number]["value"]; -export type VoteSortType = (typeof DRINK_VOTE_SORT_LIST)[number]["value"]; -export type RegionType = (typeof REGION_LIST)[number]["value"]; +export type DrinkInfoSortType = (typeof DRINK_INFO_SORT_LIST)[number]['value']; +export type VoteSortType = (typeof DRINK_VOTE_SORT_LIST)[number]['value']; +export type RegionType = (typeof REGION_LIST)[number]['value']; diff --git a/apps/jurumarble/src/types/drink.ts b/apps/jurumarble/src/types/drink.ts index ba73bce0..ce548fac 100644 --- a/apps/jurumarble/src/types/drink.ts +++ b/apps/jurumarble/src/types/drink.ts @@ -30,7 +30,7 @@ export interface DrinkInfo { enjoyCount: number | null; } -export type DrinkInfoType = Pick; +export type DrinkInfoType = Pick; export interface DrinkMapInfo { drinkId: number; diff --git a/apps/jurumarble/src/types/my.ts b/apps/jurumarble/src/types/my.ts index de2a6f5a..69d6d681 100644 --- a/apps/jurumarble/src/types/my.ts +++ b/apps/jurumarble/src/types/my.ts @@ -1,7 +1,7 @@ export const TAB_LIST = [ - { id: "created-vote", name: "작성한 투표" }, - { id: "paticipated-vote", name: "참여한 투표" }, - { id: "bookmarked-vote", name: "북마크 투표" }, + { id: 'created-vote', name: '작성한 투표' }, + { id: 'paticipated-vote', name: '참여한 투표' }, + { id: 'bookmarked-vote', name: '북마크 투표' }, ] as const; -export type TabList = (typeof TAB_LIST)[number]["id"]; +export type TabList = (typeof TAB_LIST)[number]['id']; diff --git a/apps/jurumarble/src/types/register.ts b/apps/jurumarble/src/types/register.ts index c7b67539..8e797e64 100644 --- a/apps/jurumarble/src/types/register.ts +++ b/apps/jurumarble/src/types/register.ts @@ -1,8 +1,8 @@ export interface MBTIType { - M: "E" | "I" | null; - B: "S" | "N" | null; - T: "T" | "F" | null; - I: "J" | "P" | null; + M: 'E' | 'I' | null; + B: 'S' | 'N' | null; + T: 'T' | 'F' | null; + I: 'J' | 'P' | null; } -export type Direction = "left" | "right"; +export type Direction = 'left' | 'right'; diff --git a/apps/jurumarble/src/types/vote.ts b/apps/jurumarble/src/types/vote.ts index 83c5c76a..06d0b9fd 100644 --- a/apps/jurumarble/src/types/vote.ts +++ b/apps/jurumarble/src/types/vote.ts @@ -1,7 +1,13 @@ -import { postDrinkVoteAPI, postNormalVoteAPI } from "lib/apis/vote"; +import { postDrinkVoteAPI, postNormalVoteAPI } from 'lib/apis/vote'; -type PostNormalVoteRequest = Exclude[0], undefined>; -type PostDrinkVoteRequest = Exclude[0], undefined>; +type PostNormalVoteRequest = Exclude< + Parameters[0], + undefined +>; +type PostDrinkVoteRequest = Exclude< + Parameters[0], + undefined +>; export type PostVoteType = PostNormalVoteRequest & PostDrinkVoteRequest; /** diff --git a/package.json b/package.json index bad7e086..176e949d 100644 --- a/package.json +++ b/package.json @@ -3,11 +3,7 @@ "private": true, "scripts": { "chooz": "yarn workspace @monorepo/chooz", - "juma": "yarn workspace @monorepo/jurumarble", - "eslint": "yarn workspaces foreach -pi run eslint", - "eslint:fix": "yarn workspaces foreach -pi run eslint:fix --cache", - "prettier": "yarn workspaces foreach -pi run prettier", - "prettier:fix": "yarn workspaces foreach -pi run prettier:fix --cache" + "juma": "yarn workspace @monorepo/jurumarble" }, "workspaces": { "packages": [