Feat: 디바운싱 재적용, 모바일환경에서 커서공유 블락

WePlanPlans · Jan 26, 2024 · d4dc03f · d4dc03f
2 parents 3fb36fd + 80f7e8b
commit d4dc03f
Show file tree

Hide file tree

Showing 96 changed files with 724 additions and 692 deletions.
diff --git a/index.html b/index.html
@@ -1,16 +1,29 @@
 <!doctype html>
 <html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0 maximum-scale=1" />
+    <title>위플플 | 여정 공유 플랫폼</title>
+  </head>
+  <!-- Google tag (gtag.js) -->
+  <script
+    async
+    src="https://www.googletagmanager.com/gtag/js?id=G-1285JF2LMZ"></script>
+  <script>
+    window.dataLayer = window.dataLayer || [];
+    function gtag() {
+      dataLayer.push(arguments);
+    }
+    gtag('js', new Date());
 
-<head>
-  <meta charset="UTF-8" />
-  <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0 maximum-scale=1" />
-  <title>위플플 | 여정 공유 플랫폼</title>
-</head>
+    gtag('config', 'G-1285JF2LMZ');
+  </script>
 
-<body>
-  <div id="root"></div>
-  <script type="module" src="/src/main.tsx"></script>
-</body>
-
-</html>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/src/@types/detail.types.ts b/src/@types/detail.types.ts
@@ -1,5 +1,6 @@
 interface tourDetail {
   id: number;
+  contentTypeId: number;
   title: string;
   liked: boolean;
   fullAddress: string;

diff --git a/src/@types/review.types.ts b/src/@types/review.types.ts
@@ -1,11 +1,34 @@
-interface ReviewRequest {
-  tourItemId: number;
+interface Keyword {
+  keywordId: number;
+  content: string;
+  type?: string;
+}
+
+interface CommentItemProps {
+  commentId: number;
+  authorNickname: string;
+  authorProfileImageUrl: string;
+  createdTime: string;
+  content: string;
+  onClick?: () => void;
+  isAuthor: boolean;
+}
+
+interface MyReviewContent {
+  reviewId: number;
+  authorNickname: string;
+  authorProfileImageUrl: string;
   rating: number;
-  keywords: Keyword[];
+  createdTime: string;
   content: string;
+  keywords: Keyword[];
+  commentCount: number;
+  isAuthor?: boolean;
 }
 
-interface Keyword {
-  keywordId: number;
+interface ReviewRequest {
+  tourItemId: number;
+  rating: number;
+  keywords: Keyword[];
   content: string;
 }
diff --git a/src/@types/tours.types.ts b/src/@types/tours.types.ts
@@ -1,30 +1,30 @@
-export type TourKeywordInfo = {
+interface TourKeywordInfo {
   keywordId: number;
   content: string;
   type: string;
   keywordCount: number;
-};
+}
 
-export interface RegionTypes {
+interface RegionTypes {
   areaCode?: number;
   subAreaCode?: number;
   name: string;
 }
 
-export interface ToursCategoryItemProps extends RegionTypes {
+interface ToursCategoryItemProps extends RegionTypes {
   isSelected: boolean;
   onSelect: (name: string) => void;
 }
 
-export interface ToursListProps {
+interface ToursListProps {
   selectedRegion: string;
 }
 
-export interface ToursCategoryProps extends ToursListProps {
+interface ToursCategoryProps extends ToursListProps {
   setSelectedRegion: (region: string) => void;
 }
 
-export interface TourType {
+interface TourType {
   contentTypeId?: number;
   id: number;
   title: string;
@@ -38,7 +38,7 @@ export interface TourType {
   latitude?: string;
 }
 
-export interface LikedListType {
+interface LikedListType {
   tripLikedItemId: number;
   tourItemId: number;
   contentTypeId: number;
@@ -52,3 +52,25 @@ export interface LikedListType {
   preferTotalCount: number;
   notPreferTotalCount: number;
 }
+
+interface ReviewInfoItemProps {
+  reviewId: number;
+  authorNickname: string;
+  authorProfileImageUrl: string;
+  rating: number;
+  createdTime: string;
+  content: string;
+  keywords: Keyword[]; // keywordId, content, type
+  commentCount: number;
+  onClick?: () => void;
+  tourItemId?: number;
+  contentTypeId?: number;
+  canTextOverflow: boolean;
+  isAuthor?: boolean;
+}
+
+interface Keyword {
+  keywordId: number;
+  content: string;
+  type?: string;
+}
diff --git a/src/@types/trips.types.ts b/src/@types/trips.types.ts
@@ -51,3 +51,25 @@ interface AuthorityType {
     tripId: string;
   };
 }
+interface TripSurveySetMemberInfo {
+  memberId: number;
+  nickname: string;
+  thumbnail: string;
+}
+
+interface TripMemeberInfo {
+  nickname: string;
+  profileImageUrl: string;
+}
+
+interface Participant {
+  memberId: number;
+  nickname: string;
+  thumbnail: string;
+}
+
+interface Participants {
+  tripSurveyMemberCount: number;
+  tripSurveySetMemberInfos: Participant[];
+  nonTripSurveySetMemberInfos: Participant[];
+}
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,6 +1,3 @@
-import { ThemeProvider } from 'styled-components';
-import { GlobalStyle } from '@styles/globalStyles';
-import { theme } from '@styles/theme';
 import { RecoilRoot } from 'recoil';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
@@ -17,11 +14,8 @@ const App = () => {
       <RecoilRoot>
         <BrowserRouter>
           <ScrollToTop />
-          <ThemeProvider theme={theme}>
-            <GlobalStyle />
-            <MainRouter />
-            <SocketRouter />
-          </ThemeProvider>
+          <MainRouter />
+          <SocketRouter />
         </BrowserRouter>
       </RecoilRoot>
       <ReactQueryDevtools initialIsOpen={false} />

diff --git a/src/api/review.ts b/src/api/review.ts
@@ -1,6 +1,5 @@
 import client from './client';
 import authClient from './authClient';
-
 // 리뷰 관련 API
 
 // 리뷰수정

diff --git a/src/api/socket.ts b/src/api/socket.ts
@@ -125,6 +125,7 @@ export const pubUpdateTransportation = (
     destination: `/pub/trips/${tripId}/updateTransportation`,
     body: JSON.stringify(pubUpdateTransportation),
   });
+  console.log('펍실행');
 };
 
 // 여행 아이템 방문 날짜 변경 이벤트 발생시

diff --git a/src/components/DetailSectionBottom/DetailReviews.tsx b/src/components/DetailSectionBottom/DetailReviews.tsx
@@ -27,11 +27,11 @@ import EditDelete from '@components/common/modal/children/EditDelete';
 import MyAlert from '@components/common/modal/children/MyAlert';
 import { alertTypeState } from '@recoil/modal';
 
-interface reviewProps {
-  reviewData: any;
-}
-
-export default function DetailReviews({ reviewData }: reviewProps) {
+export default function DetailReviews({
+  reviewData,
+}: {
+  reviewData: tourDetail;
+}) {
   const [reviewDataLength, setReviewDataLength] = useState<number>(0);
   const { title, contentTypeId } = reviewData;
   const params = useParams();
@@ -73,7 +73,7 @@ export default function DetailReviews({ reviewData }: reviewProps) {
     return <div>데이터를 불러오는 중 오류가 발생했습니다.</div>;
   }
 
-  const handleReviewClick = (item: any) => {
+  const handleReviewClick = (item: ReviewInfoItemProps) => {
     const reviewId = item.reviewId;
     navigate(`/reviewComment/${reviewId}`, { state: { item, tourItemId } });
   };
@@ -155,24 +155,26 @@ export default function DetailReviews({ reviewData }: reviewProps) {
             {
               return (
                 <React.Fragment key={index}>
-                  {group?.data.data.reviewInfos.content.map((item: any) => (
-                    <ReviewItem
-                      key={item.reviewId}
-                      reviewId={item.reviewId}
-                      authorNickname={item.authorNickname}
-                      authorProfileImageUrl={item.authorProfileImageUrl}
-                      rating={item.rating}
-                      createdTime={item.createdTime}
-                      content={item.content}
-                      keywords={item.keywords}
-                      commentCount={item.commentCount}
-                      onClick={() => handleReviewClick(item)}
-                      tourItemId={tourItemId}
-                      contentTypeId={contentTypeId}
-                      canTextOverflow={true}
-                      isAuthor={item.isAuthor}
-                    />
-                  ))}
+                  {group?.data.data.reviewInfos.content.map(
+                    (item: ReviewInfoItemProps) => (
+                      <ReviewItem
+                        key={item.reviewId}
+                        reviewId={item.reviewId}
+                        authorNickname={item.authorNickname}
+                        authorProfileImageUrl={item.authorProfileImageUrl}
+                        rating={item.rating}
+                        createdTime={item.createdTime}
+                        content={item.content}
+                        keywords={item.keywords}
+                        commentCount={item.commentCount}
+                        onClick={() => handleReviewClick(item)}
+                        tourItemId={tourItemId}
+                        contentTypeId={contentTypeId}
+                        canTextOverflow={true}
+                        isAuthor={item.isAuthor}
+                      />
+                    ),
+                  )}
                 </React.Fragment>
               );
             }
@@ -187,7 +189,7 @@ export default function DetailReviews({ reviewData }: reviewProps) {
         {modalChildren === 'MyAlert' && alertType === 'LoginReview' && (
           <MyAlert
             title="로그인"
-            content="리뷰 쓰기 시 로그인이 필요해요. 로그인하시겠어요?"
+            content="리뷰를 쓰려면 로그인이 필요해요. 로그인하러 가볼까요?"
           />
         )}
       </Modal>

diff --git a/src/components/DetailSectionBottom/ReviewItem.tsx b/src/components/DetailSectionBottom/ReviewItem.tsx
@@ -22,29 +22,7 @@ import { MouseEvent, useState } from 'react';
 import { getEmoji } from '@utils/utils';
 import { getStarFill } from '@utils/getStarFill';
 
-interface Keyword {
-  keywordId: number;
-  content: string;
-  type: string;
-}
-
-interface ItemProps {
-  reviewId: number;
-  authorNickname: string;
-  authorProfileImageUrl: string;
-  rating: number;
-  createdTime: any;
-  content: string;
-  keywords: Keyword[]; // keywordId, content, type
-  commentCount: number;
-  onClick?: () => void;
-  tourItemId?: number;
-  contentTypeId?: number;
-  canTextOverflow: boolean;
-  isAuthor?: boolean;
-}
-
-const Item: React.FC<ItemProps> = (props: ItemProps) => {
+const Item: React.FC<ReviewInfoItemProps> = (props: ReviewInfoItemProps) => {
   const {
     reviewId,
     authorNickname,
@@ -206,7 +184,7 @@ const Item: React.FC<ItemProps> = (props: ItemProps) => {
                     .map((keyword, idx) => (
                       <div
                         key={idx}
-                        className="rounded-md bg-gray1 px-2 py-1 text-gray6">
+                        className="rounded-md bg-gray1 px-2 py-1 text-xs text-gray6">
                         {getEmoji(keyword.content)} {keyword.content}
                       </div>
                     ))}