Upgrade/study function

assets/images/imageUrl.ts

@@ -2,17 +2,21 @@ export const CHICKEN_IMAGE =
   "https://user-images.githubusercontent.com/84257439/235454460-07e32553-3be0-41f2-8e3e-801c2ecdf059.png";
 
 export const GATHER_SHARE_IMAGES = [
-  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EC%88%A0%EC%9E%90%EB%A6%AC.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%A7%9B%EC%A7%912.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%A7%9B%EC%A7%91.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EC%9D%91.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%A7%A5%EC%A3%BC.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%85%B8%ED%8A%B8%EB%B6%81+%EC%B9%B4%EA%B3%B5.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EC%98%81%ED%99%94.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%94%94%EC%A0%80%ED%8A%B8.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EA%B3%A0%EC%96%91%EC%9D%B4.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EC%B9%9C%EA%B5%AC%EC%B0%BE%EC%95%84.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EA%B2%8C%EC%9E%84.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EC%98%81%ED%99%94%EA%B4%80.jpg",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%B3%B4%EB%93%9C%EA%B2%8C%EC%9E%84.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%86%8C%EB%AA%A8%EC%9E%84/%EB%A9%94%EC%9D%B8%EC%BB%A4%EB%B2%84/%EC%B6%9C%EC%82%AC.webp",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%B0%B0%EB%84%88/%ED%8E%AD%EA%B7%842.jpg",
   "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%B0%B0%EB%84%88/%ED%8E%AD%EA%B7%841.jpg",
-  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EB%AA%A8%EC%9E%84+%EA%B3%B5%EC%9C%A0+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%85%B8%ED%8A%B8%EB%B6%81+%EC%B9%B4%EA%B3%B5.jpg",
 ];
 
 export const DEFAULT_IMAGE_URL =

components/molecules/NewTwoButtonRow.tsx

@@ -1,28 +1,31 @@
 import { Button, Flex } from "@chakra-ui/react";
+import Link from "next/link";
 import { JSXElementConstructor, ReactElement } from "react";
 
 interface NewTwoButtonRowProps {
   leftProps: {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     icon?: ReactElement<any, string | JSXElementConstructor<any>>;
     children?: React.ReactNode;
+    url: string;
   };
   rightProps: {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     icon?: ReactElement<any, string | JSXElementConstructor<any>>;
     children?: React.ReactNode;
     isDisabled?: boolean;
+    func: () => void;
   };
 }
 
 function NewTwoButtonRow({ leftProps, rightProps }: NewTwoButtonRowProps) {
   return (
     <Flex>
       <Button
-        as="div"
-        flex={1}
-        mr={3}
+        as={Link}
         size="lg"
+        href={leftProps.url}
+        flex={1}
         h="48px"
         bgColor="white"
         borderRadius="12px"
@@ -32,8 +35,8 @@ function NewTwoButtonRow({ leftProps, rightProps }: NewTwoButtonRowProps) {
       >
         {leftProps.children}
       </Button>
+
       <Button
-        as="div"
         flex={1}
         size="lg"
         h="48px"
@@ -42,6 +45,7 @@ function NewTwoButtonRow({ leftProps, rightProps }: NewTwoButtonRowProps) {
         boxShadow=" 0px 5px 10px 0px rgba(66, 66, 66, 0.1)"
         leftIcon={rightProps?.icon}
         isDisabled={rightProps?.isDisabled}
+        onClick={rightProps.func}
       >
         {rightProps.children}
       </Button>

components/molecules/cards/GroupThumbnailCard.tsx

@@ -9,7 +9,7 @@ import { SingleLineText } from "../../../styles/layout/components";
 import {
   GroupParicipantProps,
   GroupStatus,
-  IGroupWritingCategory
+  IGroupWritingCategory,
 } from "../../../types/models/groupTypes/group";
 import { IUserSummary } from "../../../types/models/userTypes/userInfoTypes";
 import { UserIcon } from "../../Icons/UserIcons";
@@ -68,13 +68,13 @@ export function GroupThumbnailCard({
         <Flex my={1} justify="space-between" align="center">
           <Box fontSize="11px" lineHeight="12px">
             <Box as="span" fontWeight="medium" lineHeight="12px" color="mint">
-              {category.main}
+              {category?.main}
             </Box>
             <Box as="span" fontWeight="regular" color="var(--gray-400)">
               ・
             </Box>
             <Box as="span" color="gray.500" fontWeight="regular">
-              {category.sub}
+              {category?.sub}
             </Box>
           </Box>
 

components/organisms/drawer/BottomFlexDrawer.tsx

@@ -49,7 +49,7 @@ export default function BottomFlexDrawer({
   const [drawerHeight, setDrawerHeight] = useState(isDrawerUp ? maxHeight : DRAWER_MIN_HEIGHT); // 초기 높이
   const startYRef = useRef(0); // 드래그 시작 위치 저장
   const currentHeightRef = useRef(drawerHeight); // 현재 높이 저장
-
+ 
   useEffect(() => {
     if (isDrawerUp) setDrawerHeight(maxHeight);
     else setDrawerHeight(DRAWER_MIN_HEIGHT);

components/services/studyVote/StudyVoteDrawer.tsx → components/services/studyVote/StudyPlacePickerDrawer.tsx

@@ -1,8 +1,144 @@
-function StudyVoteDrawer() {
-  return <></>;
+import { Box, Flex } from "@chakra-ui/react";
+import { useEffect, useState } from "react";
+
+import { useCurrentLocation } from "../../../hooks/custom/CurrentLocationHook";
+import { setStudyToThumbnailInfo } from "../../../libs/study/setStudyToThumbnailInfo";
+import {
+  DEFAULT_SUB_PLACE_CNT,
+  RECOMMENDATION_KM,
+  sortByDistanceSub,
+  SubPlaceProps,
+} from "../../../pageTemplates/vote/VoteDrawer";
+import { DispatchType } from "../../../types/hooks/reactTypes";
+import {
+  StudyDailyInfoProps,
+  StudyParticipationProps,
+} from "../../../types/models/studyTypes/studyDetails";
+import { StudyThumbnailCardProps } from "../../molecules/cards/StudyThumbnailCard";
+import PickerRowButton from "../../molecules/PickerRowButton";
+import BottomFlexDrawer, { BottomFlexDrawerOptions } from "../../organisms/drawer/BottomFlexDrawer";
+
+interface StudyPlacePickerDrawerProps {
+  studyVoteData: StudyDailyInfoProps;
+  setModalType: (type: "timeSelect") => void;
+  id: string;
+
+  subArr: SubPlaceProps[];
+  setSubArr: DispatchType<SubPlaceProps[]>;
+  findMyPickMainPlace: StudyParticipationProps;
+}
+
+function StudyPlacePickerDrawer({
+  setModalType,
+  studyVoteData,
+  id,
+  subArr,
+  setSubArr,
+  findMyPickMainPlace,
+}: StudyPlacePickerDrawerProps) {
+  const { currentLocation } = useCurrentLocation();
+
+  const [defaultPlaceArr, setDefaultPlaceArr] = useState<SubPlaceProps[]>([]);
+
+  useEffect(() => {
+    if (!studyVoteData) return;
+    const temp: SubPlaceProps[] = [];
+    const temp2: SubPlaceProps[] = [];
+    const sortedSub = sortByDistanceSub(studyVoteData, findMyPickMainPlace);
+    sortedSub.forEach((par, idx) => {
+      if (idx < DEFAULT_SUB_PLACE_CNT && par.place.distance <= RECOMMENDATION_KM) temp.push(par);
+      else temp2.push(par);
+    });
+    setSubArr(temp);
+    setDefaultPlaceArr(temp2);
+  }, [studyVoteData]);
+
+  const drawerOptions2: BottomFlexDrawerOptions = {
+    header: {
+      title: "스터디 장소 투표",
+      subTitle: "참여 가능한 스터디 장소를 모두 선택해 주세요¡",
+    },
+    footer: {
+      text: "다 음",
+      func: () => setModalType("timeSelect"),
+      // loading: isLoading1 || isLoading2,
+    },
+  };
+
+  const convertData = (data: StudyParticipationProps): StudyThumbnailCardProps => {
+    const isMain = id === data.place._id;
+    return setStudyToThumbnailInfo(
+      [data],
+      null,
+      isMain
+        ? currentLocation
+        : { lat: findMyPickMainPlace?.place.latitude, lon: findMyPickMainPlace?.place?.longitude },
+      null,
+      true,
+      null,
+      null,
+      null,
+    )[0];
+  };
+
+  return (
+    <>
+      <BottomFlexDrawer
+        isOverlay
+        isHideBottom
+        isDrawerUp
+        zIndex={5000}
+        height={410}
+        setIsModal={() => setModalType(null)}
+        drawerOptions={drawerOptions2}
+      >
+        <Flex w="full" direction="column" overflowY="scroll">
+          <Box mb={2} w="full">
+            <PickerRowButton
+              {...convertData(findMyPickMainPlace)}
+              onClick={() => setModalType(null)}
+              pickType="main"
+            />
+          </Box>
+          {subArr?.map((props, idx) => {
+            const id = props.place._id;
+            const par = defaultPlaceArr.find((par) => par.place._id === id);
+            return (
+              <Box key={idx} mb={2} w="full">
+                <PickerRowButton
+                  {...convertData(props)}
+                  onClick={() =>
+                    subArr.some((sub) => sub.place._id === id)
+                      ? setSubArr((old) => old.filter((old) => old.place._id !== id))
+                      : setSubArr((old) => [...old, par])
+                  }
+                  pickType="second"
+                  isNoSelect={!subArr.some((par) => par.place._id === id)}
+                />
+              </Box>
+            );
+          })}
+          {defaultPlaceArr?.map((props, idx) => {
+            const id = props.place._id;
+            const par = defaultPlaceArr.find((par) => par.place._id === id);
+            return (
+              <Box key={idx} mb={2} w="full">
+                <PickerRowButton
+                  {...convertData(props)}
+                  onClick={() => setSubArr((old) => [...old, par])}
+                  pickType={null}
+                  isNoSelect={!subArr.some((par) => par.place._id === id)}
+                />
+              </Box>
+            );
+          })}
+        </Flex>
+      </BottomFlexDrawer>
+    </>
+  );
 }
 
-export default StudyVoteDrawer;
+export default StudyPlacePickerDrawer;
 
 // import { Box } from "@chakra-ui/react";
 // import dayjs from "dayjs";
@@ -17,7 +153,7 @@ export default StudyVoteDrawer;
 
 // dayjs.locale("ko");
 
-// interface IStudyVoteDrawer extends IModal {
+// interface IStudyPlacePickerDrawer extends IModal {
 //   imagePropsArr: {
 //     id: string;
 //     name: string;
@@ -29,13 +165,13 @@ export default StudyVoteDrawer;
 //   hasPlace?: boolean;
 // }
 
-// export default function StudyVoteDrawer({
+// export default function StudyPlacePickerDrawer({
 //   setIsModal,
 //   date,
 //   hasPlace,
 //   handleSubmit,
 //   isLoading,
-// }: IStudyVoteDrawer) {
+// }: IStudyPlacePickerDrawer) {
 //   // const { date, id } = useParams<{ date: string; id: string }>();
 //   // const router = useRouter();
 

constants/serviceConstants/pointSystemConstants.ts

@@ -18,7 +18,7 @@ export const POINT_SYSTEM_PLUS = {
   STUDY_INVITE: { value: 2, message: "친구 초대 보너스" },
   DAILY_ATTEND: { value: 2, message: "일일 출석" },
   PROMOTION: { value: 100, message: "홍보 리워드" },
-  LIKE: { value: 2, message: "좋아요" },
+  LIKE: { value: 1, message: "좋아요" },
 };
 
 export const POINT_SYSTEM_DEPOSIT = {

libs/study/getStudyTime.ts

@@ -5,8 +5,8 @@ import { dayjsToFormat } from "../../utils/dateTimeUtils";
 
 export const getStudyTime = (users: StudyMemberProps[]): { start: string; end: string } => {
   if (!users) return null;
-  let startTime;
-  let endTime;
+  let startTime = dayjs();
+  let endTime = dayjs();
 
   users.forEach((user) => {
     const userStart = dayjs(user.time.start);
@@ -16,6 +16,6 @@ export const getStudyTime = (users: StudyMemberProps[]): { start: string; end: s
     if (userStart.isBefore(startTime)) startTime = userStart;
     if (userEnd.isAfter(endTime)) endTime = userEnd;
   });
-
+ 
   return { start: dayjsToFormat(startTime, "HH:mm"), end: dayjsToFormat(endTime, "HH:mm") };
 };

modals/study/StudySimpleVoteModal.tsx

@@ -209,8 +209,8 @@ function StudySimpleVoteModal({ studyVoteData, setIsModal }: StudySimpleVoteModa
             {studyDateStatus === "today"
               ? mainPlaceFullName || "장소를 선택해 주세요"
               : mainPlaceFullName
-                ? `${mainPlaceFullName} 외 ${myVote?.subPlace?.length + 1}곳`
-                : "등록된 장소가 없습니다."}
+              ? `${mainPlaceFullName} 외 ${myVote?.subPlace?.length + 1}곳`
+              : "등록된 장소가 없습니다."}
           </Box>
         </Box>
         <Button

pageTemplates/gather/detail/GatherHeader.tsx

@@ -53,7 +53,7 @@ function GatherHeader({ gatherData }: IGatherHeader) {
       </Header>
       {drawerType === "kakaoShare" && (
         <RightDrawer title="이미지 공유" onClose={() => setDrawerType(null)}>
-          <Box>
+          <Box pb={20}>
             <Box fontSize="16px" mt="4px" mb="20px" fontWeight={600}>
               단톡방에 공유 할 이미지를 선택해 주세요!
             </Box>
@@ -65,7 +65,7 @@ function GatherHeader({ gatherData }: IGatherHeader) {
               ))}
             </Container>
           </Box>
-          <Box position="fixed" bottom="0" w="90%" maxW="var(--view-max-width)">
+          <Box position="fixed" bottom="8px" w="90%" maxW="var(--view-max-width)">
             <KakaoShareBtn
               isFull
               title={title}

pageTemplates/group/detail/GroupHeader.tsx

@@ -97,7 +97,7 @@ function GroupHeader({ group }: IGroupHeader) {
 
   return (
     <>
-      <Header title="모임 정보" rightPadding={6} isCenter>
+      <Header title="모임 정보" rightPadding={6} isCenter >
         <MenuButton menuArr={menuArr} />
       </Header>
       {isSettigModal && (

pageTemplates/ranking/RankingOverview.tsx

@@ -35,6 +35,7 @@ function RankingOverview({ myRankInfo }: IRankingOverview) {
                 uid={userInfo.uid}
                 size="lg"
                 isPriority={true}
+                isLink={false}
               />
               <ProfileUserName>{userInfo?.name}</ProfileUserName>
             </ProfileWrapper>