Refactor/develop

assets/images/studyCover.tsx

@@ -0,0 +1,11 @@
+export const STUDY_COVER_IMAGES = [
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC4.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC5.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC6.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC7.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC9.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC8.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC11.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC2.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%B0%B0%EA%B2%BD/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC10.png",
+];

assets/images/studyMain.tsx

@@ -0,0 +1,10 @@
+export const STUDY_MAIN_IMAGES = [
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC3.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC14.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC12.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC13.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC15.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC17.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC18.png",
+  "https://studyabout.s3.ap-northeast-2.amazonaws.com/%EC%B9%B4%ED%8E%98+%EB%A9%94%EC%9D%B8+%EC%9D%B4%EB%AF%B8%EC%A7%80/%EB%9E%9C%EB%8D%A4/%EA%B7%B8%EB%A6%BC16.png",
+];

components/atoms/PlaceSelector.tsx

@@ -0,0 +1,43 @@
+import { Select } from "@chakra-ui/react";
+import { ChangeEvent } from "react";
+
+import { PLACE_TO_NAME } from "../../constants/serviceConstants/studyConstants/studyCafeNameConstants";
+import { DispatchType } from "../../types/hooks/reactTypes";
+
+interface IPlaceSelector {
+  defaultValue: string;
+  options: string[];
+  setValue: DispatchType<string>;
+  isBorder?: boolean;
+}
+
+export default function PlaceSelector({
+  defaultValue,
+  options,
+  setValue: setParentValue,
+  isBorder = true,
+}: IPlaceSelector) {
+  const onChange = (e: ChangeEvent<HTMLSelectElement>) => {
+    const targetValue = e.currentTarget.value;
+    setParentValue(targetValue === "선택 없음" ? null : targetValue);
+  };
+
+  return (
+    <div className="max-w-md">
+      <Select
+        focusBorderColor="#00c2b3"
+        size="sm"
+        color="primary"
+        value={defaultValue}
+        onChange={onChange}
+        border={!isBorder ? "none" : undefined}
+      >
+        {options.map((option, idx) => (
+          <option value={option} key={idx}>
+            {PLACE_TO_NAME[option] || "선택 없음"}
+          </option>
+        ))}
+      </Select>
+    </div>
+  );
+}

components/atoms/Selector.tsx

@@ -1,5 +1,3 @@
-"use client";
-
 import { Select } from "@chakra-ui/react";
 import { ChangeEvent, useEffect, useState } from "react";
 

components/molecules/DateVoteBlock.tsx

@@ -19,12 +19,12 @@ function DateVoteBlock({ buttonProps, func, cnt }: DateVoteBlockProps) {
   const locationEn = searchParams.get("location");
 
   const myStudy = useRecoilValue(myStudyState);
-  console.log(5, myStudy);
+
   return (
     <Flex w="100%" justify="space-between" align="center">
       <Box fontSize="16px" fontWeight={500}>
         <Box as="span" mr="4px">
-          현재 참여 인원:
+          현재 신청 인원:
         </Box>
 
         <Box display="inline-block" color="var(--color-mint)">

components/molecules/cards/PostThumbnailCard.tsx

@@ -58,12 +58,13 @@ export function PostThumbnailCard({
           borderRadius="var(--rounded-lg)"
           position="relative"
           overflow="hidden"
+          pos="relative"
         >
           <Image
             src={image.url}
             alt="thumbnailImage"
-            width={80}
-            height={80}
+            fill={true}
+            sizes="100px"
             priority={image.priority}
           />
         </Box>

constants/contentsText/Private.tsx

@@ -20,4 +20,4 @@ const P = styled.p`
 
 export const OPEN_KAKAO_LINK = "https://open.kakao.com/o/sjDgVzmf";
 
-export const PROMOTION_TEXT = `안녕하세요! 저희는 대학생들의 카공, 그룹스터디, 친목을 위한 동아리 ABOUT입니다! 자율적으로 참여할 수 있는 카공 스터디와, 여러 분야의 그룹 스터디, 그리고 다양한 주제의 오프라인 모임을 통해 대학생들의 공부와 취미, 재미까지 모두 챙길 수 있는 모임을 지향하고 있습니다!\n\n ☕️ 카공 스터디 ☕️\n\n✔ 개인 공부 + 소소한 대화의 스터디 분위기 \n✔ 원하는 날짜, 시간, 장소에 자율 스터디 참여 \n✔ 지역, 또래, 관심사를 공유하는 친구들과 카공 \n\n☕️그룹스터디☕️ \n\n✔ 자격증, 어학, 프로그래밍, 취업준비, 자기계발 등 모든 분야 \n✔ 토익, 오픽, 영어회화, 일본어회화, 컴활, 투두메이트, 열품타(공부인증), 습관만들기, 리그오브레전드, 파이썬, C++, 개발 프로젝트, 운동인증, 코딩테스트, 편입 스터디,한국사 등 \n\n☕️기타☕️ \n\n✔ 다양한 오프라인 모임과 이벤트 \n✔ 체계적인 운영과 관리 체계 \n✔ 열심히 공부한 뒤 같이 놀기도 하는 동아리 \n\n✅ 가입 조건 ✅ \n\n✔ 한 달에 최소 1회 이상 카공 스터디 참여 \n✔ 만 19~26세의 대학생(졸업생) \n\n🚨종교/이성 목적 등 불온한 목적의 가입을 엄격히 금지합니다. \n🚨타인에게 피해나 불편함을 주는 행위 발각시 즉시 추방됩니다. \n\n☕️ 모임 장소 ☕️ \n\n- 수원 지역 \n- 안양/과천/군포 지역 (과천/군포 추가 예정) \n- 양천/영등포 지역 \n- 강남 지역 \n- 동대문/성북구 지역 \n- 인천 지역 \n- 마포/서대문구 지역 (준비중, 신청 가능) \n- 성남 지역 (준비중, 신청 가능) \n\n!!스터디 지역은 계속 확장되는 중입니다!! \n\n☕️ 회비 ☕️\n 가입비: 2000원 보증금: 3000원 (탈퇴시 환급) \n\n📝 가입 신청 및 동아리 구경 📝 \nhttps://studyabout.club \n\n가입 신청: '카카오 로그인' \n동아리 구경: '게스트 로그인' \n\n✔ 저희는 교내 동아리가 아닌 대학교 연합동아리입니다. \n✔ 오픈 지역은 지속적으로 추가 및 확장 중에 있습니다. \n✔ 특정 종교, 정치, 시민 단체와 전혀 관련 없는 건전한 연합동아리로, 다양한 관심사와 배움을 추구하는 대학생들을 환영합니다. 동아리 관련 문의는 링크를 통해 해주세요.\n\n https://open.kakao.com/o/sjDgVzmf `;
+export const PROMOTION_TEXT = `안녕하세요! 저희는 대학생들의 카공, 그룹스터디, 친목을 위한 동아리 ABOUT입니다! 자율적으로 참여할 수 있는 카공 스터디와, 여러 분야의 그룹 스터디, 그리고 다양한 주제의 오프라인 모임을 통해 대학생들의 공부와 취미, 재미까지 모두 챙길 수 있는 모임을 지향하고 있습니다!\n\n ☕️ 카공 스터디 ☕️\n\n✔ 개인 공부 + 소소한 대화의 스터디 분위기 \n✔ 원하는 날짜, 시간, 장소에 자율 스터디 참여 \n✔ 지역, 또래, 관심사를 공유하는 친구들과 카공 \n\n☕️그룹스터디☕️ \n\n✔ 자격증, 어학, 프로그래밍, 취업준비, 자기계발 등 모든 분야 \n✔ 토익, 오픽, 영어회화, 일본어회화, 컴활, 투두메이트, 열품타(공부인증), 습관만들기, 리그오브레전드, 파이썬, C++, 개발 프로젝트, 운동인증, 코딩테스트, 편입 스터디,한국사 등 \n\n☕️기타☕️ \n\n✔ 다양한 오프라인 모임과 이벤트 \n✔ 체계적인 운영과 관리 체계 \n✔ 열심히 공부한 뒤 같이 놀기도 하는 동아리 \n\n✅ 가입 조건 ✅ \n\n✔ 한 달에 최소 1회 이상 카공 스터디 참여 \n✔ 만 19~26세의 대학생(졸업생) \n\n🚨종교/이성 목적 등 불온한 목적의 가입을 엄격히 금지합니다. \n🚨타인에게 피해나 불편함을 주는 행위 발각시 즉시 추방됩니다. \n\n☕️ 모임 장소 ☕️ \n\n- 수원 지역 \n- 안양/과천/군포 지역 (과천/군포 추가 예정) \n- 양천/영등포 지역 \n- 강남 지역 \n- 동대문/성북구 지역 \n- 인천 지역 \n- 마포/서대문구 지역 (준비중, 신청 가능) \n- 성남 지역 (준비중, 신청 가능) \n\n!!스터디 지역은 계속 확장되는 중입니다!! \n\n☕️ 회비 ☕️\n 가입비: 2000원 보증금: 3000원 (탈퇴시 환급) \n\n📝 가입 신청 및 동아리 구경 📝 \nwww.study-about.club \n\n가입 신청: '카카오 로그인' \n동아리 구경: '게스트 로그인' \n\n✔ 저희는 교내 동아리가 아닌 대학교 연합동아리입니다. \n✔ 오픈 지역은 지속적으로 추가 및 확장 중에 있습니다. \n✔ 특정 종교, 정치, 시민 단체와 전혀 관련 없는 건전한 연합동아리로, 다양한 관심사와 배움을 추구하는 대학생들을 환영합니다. 동아리 관련 문의는 링크를 통해 해주세요.\n\n https://open.kakao.com/o/sjDgVzmf `;

constants/serviceConstants/studyConstants/studyCafeNameConstants.ts

@@ -150,10 +150,12 @@ export const PLACE_TO_NAME = {
   [DONG_수유역]: "엔제리너스",
   [DONG_회기역]: "READSTREET",
 
+  //인천
   [INC_인하대]: "더스토리",
   [INC_송도DT]: "스타벅스",
   [INC_구월동]: "파스쿠찌",
   [INC_송도]: "카페꼼마",
   [INC_부평]: "하이테이블",
   [INC_인천대]: "스타벅스",
 };
+

hooks/study/queries.ts

@@ -32,7 +32,7 @@ export const useStudyPlacesQuery = (
           status: active,
         },
       });
-      console.log(4, active);
+
       const places = res.data.filter(
         (place) =>
           place.brand !== "자유 신청" && (location === "all" || place.location === location),

libs/study/getStudyVoteCnt.ts

@@ -8,7 +8,7 @@ export const getStudyVoteCnt = (studyVoteData: IParticipation[], filterUid?: str
     if (par.place.brand === "자유 신청") return;
     par?.attendences.forEach((who) => {
       if (who?.user.uid === filterUid) return;
-      temp.add(who.user.uid);
+      if (who.firstChoice) temp.add(who.user.uid);
     });
   });
 

modals/study/StudySimpleVoteModal.tsx

@@ -5,10 +5,11 @@ import { useEffect, useState } from "react";
 import { useQueryClient } from "react-query";
 import { useRecoilValue } from "recoil";
 
-import Selector from "../../components/atoms/Selector";
+import PlaceSelector from "../../components/atoms/PlaceSelector";
 import ImageTileFlexLayout from "../../components/molecules/layouts/ImageTileFlexLayout";
 import { IImageTileData } from "../../components/molecules/layouts/ImageTitleGridLayout";
 import { StudyVoteTimeRullets } from "../../components/services/studyVote/StudyVoteTimeRulletDrawer";
+import { STUDY_CHECK_POP_UP } from "../../constants/keys/localStorage";
 import { STUDY_VOTE } from "../../constants/keys/queryKeys";
 import { POINT_SYSTEM_PLUS } from "../../constants/serviceConstants/pointSystemConstants";
 import { useToast } from "../../hooks/custom/CustomToast";
@@ -107,19 +108,27 @@ function StudySimpleVoteModal({ studyVoteData, setIsModal }: StudySimpleVoteModa
     } else patchAttend(myVote);
   };
 
+  const hasDismissedStudy = localStorage.getItem(STUDY_CHECK_POP_UP) === dayjsToStr(dayjs());
+
   const imageDataArr: IImageTileData[] = studyVoteData
-    ?.filter((par) => par.status === "dismissed")
+    ?.filter((par) => par.status !== "dismissed")
     .map((par) => ({
       imageUrl: par.place.image,
       text: par.place.branch,
       id: par.place._id,
-      func: () => setSelectedPlace(par.place._id),
+      func: () => {
+        if (par.place.branch === "개인 스터디" && !hasDismissedStudy) {
+          toast("warning", "사전 투표 인원만 참여가 가능합니다.");
+          return;
+        }
+        setSelectedPlace(par.place._id);
+      },
     }))
     .sort((a) => (a.text === "개인 스터디" ? 1 : -1));
 
   const dismissedPlaces = studyVoteData
     ?.filter((par) => par.status === "dismissed")
-    .map((par) => par.place.branch);
+    .map((par) => par.place._id);
 
   const footerOptions: IFooterOptions = {
     main: {
@@ -139,7 +148,7 @@ function StudySimpleVoteModal({ studyVoteData, setIsModal }: StudySimpleVoteModa
             </ModalSubtitle>
             <ImageTileFlexLayout imageDataArr={imageDataArr} selectedId={[selectedPlace]} />
             <Box mt="20px">
-              <Selector
+              <PlaceSelector
                 options={["선택 없음", ...dismissedPlaces]}
                 defaultValue={selectedPlace}
                 setValue={setSelectedPlace}

pageTemplates/home/studyController/StudyController.tsx

@@ -128,10 +128,7 @@ function StudyController() {
         <DateCalendarModal selectedDate={selectedDateDayjs} setIsModal={() => setModalType(null)} />
       )}
       {modalType === "todayVote" && (
-        <StudySimpleVoteModal
-          studyVoteData={studyVoteData}
-          setIsModal={() => setModalType(null)}
-        />
+        <StudySimpleVoteModal studyVoteData={studyVoteData} setIsModal={() => setModalType(null)} />
       )}
     </>
   );

pageTemplates/study/StudyWaitingPlaces.tsx

@@ -32,7 +32,7 @@ function StudyWaitingPlaces({ studyWaitingPlaces }: StudyWaitingPlacesProps) {
       ),
     };
   });
-  console.log(studyWaitingPlaces);
+
   return (
     <>
       {placeCardArr.length ? (

pages/study/waiting/[location]/[date]/index.tsx

@@ -153,6 +153,7 @@ const getWaitingSpaceProps = (studyData: IParticipation[]) => {
       }
     });
   });
+
   return userArr.sort((a, b) => (dayjs(a.createdAt).isAfter(dayjs(b.createdAt)) ? 1 : -1));
 };
 

pages/study/writing/complete.tsx

@@ -38,15 +38,15 @@ function WritingStudyComplete() {
       writer: session?.user.name,
       date: dayjs(),
       title: studyWriting?.fullname,
-      content: studyWriting.content,
+      content,
     });
   };
 
   const LIST_CONTENTS = [
-    "관리자가 승인하는 즉시 신규 등록됩니다.",
-    "등록된 장소는 한 달 동안만 임시로 유지됩니다.",
-    "정규 장소로 확정을 위해서는 한 달 이내에 해당 장소에서 스터디가 2회 진행되어야 합니다.",
-    "정규 장소 확정에 성공한다면 등록자에게는 300 POINT의 상품이 지급됩니다.",
+    "관리자가 승인하는 즉시 신규 장소로 추가됩니다.",
+    "추가된 장소는 한 달 동안만 임시로 유지됩니다.",
+    "고정 장소로 전환을 위해서는 한 달 이내에 스터디가 2회 이상 진행되어야 합니다.",
+    "전환에 성공한다면 등록자에게는 300 POINT의 상품이 지급됩니다.",
   ];
 
   return (

pages/study/writing/image.tsx

@@ -3,6 +3,8 @@ import { useRouter } from "next/router";
 import { useState } from "react";
 import { useRecoilState } from "recoil";
 
+import { STUDY_COVER_IMAGES } from "../../../assets/images/studyCover";
+import { STUDY_MAIN_IMAGES } from "../../../assets/images/studyMain";
 import BottomNav from "../../../components/layouts/BottomNav";
 import Header from "../../../components/layouts/Header";
 import Slide from "../../../components/layouts/PageSlide";
@@ -12,7 +14,6 @@ import { useFailToast } from "../../../hooks/custom/CustomToast";
 import RegisterLayout from "../../../pageTemplates/register/RegisterLayout";
 import RegisterOverview from "../../../pageTemplates/register/RegisterOverview";
 import { sharedStudyWritingState } from "../../../recoils/sharedDataAtoms";
-import { STORE_GIFT } from "../../../storage/Store";
 
 function WritingStudyImage() {
   const router = useRouter();
@@ -38,16 +39,16 @@ function WritingStudyImage() {
     router.push(`/study/writing/complete`);
   };
 
-  const mainImageArr = STORE_GIFT.map((item) => ({
-    imageUrl: item.image,
+  const mainImageArr = STUDY_MAIN_IMAGES.map((item) => ({
+    imageUrl: item,
     func: () => {
-      setImageProps((old) => ({ ...old, mainImage: item.image }));
+      setImageProps((old) => ({ ...old, mainImage: item }));
     },
   }));
-  const coverImageArr = STORE_GIFT.map((item) => ({
-    imageUrl: item.image,
+  const coverImageArr = STUDY_COVER_IMAGES.map((item) => ({
+    imageUrl: item,
     func: () => {
-      setImageProps((old) => ({ ...old, coverImage: item.image }));
+      setImageProps((old) => ({ ...old, coverImage: item }));
     },
   }));
 

pages/test.tsx

@@ -10,7 +10,7 @@ const urlBase64ToUint8Array = (base64String) => {
 
   // 패딩 추가
   const padding = "=".repeat((4 - (base64String.length % 4)) % 4);
-  const base64 = (base64String + padding).replace(/\-/g, "+").replace(/_/g, "/");
+  const base64 = (base64String + padding).replace(/-/g, "+").replace(/_/g, "/");
 
   // 패딩 후 문자열과 길이 출력
   console.log("Padded base64String:", base64);

public/pwabuilder-sw.js

@@ -14,11 +14,9 @@ self.addEventListener("message", (event) => {
   }
 });
 
-console.log("Service Worker Loaded...");
-
 self.addEventListener("push", (e) => {
   const data = e.data.json();
-  console.log("Push Recieved...");
+
   self.registration.showNotification(data.title, {
     body: "Knock Knock",
   });