Release test 0.0.1 (#41)

* feat: 기본 컴포넌트 생성

* feat: 지도 구현

* Update README.md

* Update README.md

* Update README.md

* feat: marker 이미지 추가

* feat: only icon marker 디자인 완료

* feat: name marker 디자인 완료

* refactor: 지도에 보이는 방식 변경

* feat: 업체 리스트 디자인 완료

하트 상태 useState로 관리

* Create pull_request_template.md

* feat: 검색창 구현

* feat: 픽한업체 디자인

* refactor: 겹치는 코드 분리

size 인수로 받는 함수 만들어서 그 사이즈에 맞게 이미지 코드 반환

* feat: 필터 디자인 완료

* feat: 스크롤바 디자인

* style: store list 디자인 변경사항 반영

* style: 이름 마커 디자인 수정

* feat: 라우터 설정

* feat: 가게 정보 디자인 완료

* style: heart -> 👍 으로 디자인 변경

* fix: 지도 안뜨는 문제 해결

* refact: 공통 컴포넌트 분리 (필터, 검색창)

* refact: 이름 마커 컴포넌트 공통으로 리팩토링

* refact: children props 넘겨주는 방식 변경

* refact: icon marker 코드 하나로 분리

* chore: 해당하는 마커만 지도에 띄우기

* fix: 우선 error는 안뜨도록 수정

* fix: 같은 매장 여러번 클릭할 수 있도록 수정

* fix: 기본값 설정

* docs: PR template update

체크리스트 추가

* [#17] feat: 헤더 #17 (#21)

* feat : 화면 구현

* feat : 헤더 구현

* style : 알림 아이콘 추가

* [#3] feat: 제휴가게 페이지  (#13)

* feat: component 구성

* style: 타이틀 디자인 구현 완성

* style: 필터, 검색, 버튼 디자인 완료

* style: store 컴포넌트 디자인 완료

* style: 변경된 디자인 반영

* feat: 가게 검색 모달 창 디자인 완료

* feat: 공통 버튼 컴포넌트 분리

* feat: [제휴가게 조회] 컴포넌트 구성

* style: [제휴가게 조회] 화면 디자인 완료

* feat: 스탬프 모달 완성

* feat: 조건 박스 추가

* refact: modal 폴더 생성

* feat: 제휴 종료 모달 완성

* fix: 버튼 스타일링 변경

* refact: && 연산자로 변경

* [#22] feat: 가게 찾기 페이지 API 연결 (#25)

* fix: img 오류 수정

* feat: api data 형식 추가 및 적용

* feat: 가게 전체 조회 api 연결

* style: 제목 div 깨짐 수정

* feat: map type filter 설정

* feat: filter API 설정

* feat: 위도 경도 연결

* refact: 전체 필터용으로 api 방식 수정

* feat: 픽한업체 필터 설정

* feat: 검색어 필터 연결

/contact 부분 props 수정 필요

* feat: storeInfo와 filter 예외처리

storeInfo가 열려있는 상태로 filter를 누르면 지도 내용이 누른 filter를 반영하도록 변경

* chore: 사용안하는 코드 삭제

* feat: 픽한 업체 API 연결

* feat: 가게 상세 정보 조회 API 연결

* fix: 선택한 가게 기본값 설정

* feat: 이름 마커 zindex 설정

* feat: 맨 위 데이터 "이름 마커" 로 뜨는 조건

* style: 디자인적 요소 수정

cursor 포인터로, 도보 시간 0분으로 안뜨도록, 픽한 업체 글자 눌렀을때도 클릭 되도록

* [#24] feat : 팝업관리, 쿠폰관리, 마이페이지, 대시보드 화면 구현 (#29)

* feat : 화면 구현

* feat : 헤더 구현

* feat : 로그인 모달 구현

* feat : 회원가입 화면 구현

* style : header 알림 아이콘 추가

* style : 로그인 모달 세부 디자인 수정

* feat : api 설정 및 부분 연동

* feat : 로그인 액세스토큰 세션 스토리지에 저장

* feat : 대시보드 레이아웃 잡기

* feat : 첫번째 박스 구현

* feat : 두번째 박스 구현

* feat : 대시보드 화면 완성

* feat : 쿠폰관리 리스트 화면 구현

* feat : 팝업관리 화면 구현

* feat : popup api 연동

* feat : 쿠폰 등록 화면 구현

* feat : 비었을때 보여줄 컴포넌트 삽입

* feat : 팝업등록 화면 구현

* feat : 마이페이지 화면 구현

* feat : 팝업관리 화면 구현, 일부 api 연동

* [#16] feat: 팝업관리 페이지 디자인 구현 (#31)

* feat: 가게 검색 모달 창 디자인 완료

* feat: 스탬프 모달 완성

* feat: 조건 박스 추가

* refact: modal 폴더 생성

* feat: 컴포넌트 구성

* feat: 팝업 관리 페이지 디자인 완료

* feat: 환경 설정

package json 수정, base api 수정

* [#28] feat: 제휴가게 API 연결 (#37)

* fix: icon 에러 수정

* feat: 제휴가게리스트 API 연결

* feat: 라우터 연결

* fix: img 오류 수정

* feat: 제휴가게 상세 API 연결

* feat: modal api 연결 및 디자인 수정

* style: checkbox 적용

* [#39] fix : 서브메뉴 디자인 변경 및 링크추가 (#40)

* style : 팝업 / 쿠폰 관리 삭제박스 추가

* fix : 헤더 디자인 수정 및 링크 추가

---------

Co-authored-by: Ethan Lim <[email protected]>

components/atoms/basics.ts

@@ -1,5 +1,7 @@
 import styled from "@emotion/styled";
 
+import { Checkbox } from "@mui/material";
+
 interface HorizontalBox {
   column?: string;
 }
@@ -22,7 +24,6 @@ export const FlexBox = styled.div<HorizontalBox>`
   flex-flow: ${(props) => (props?.column ? "column nowrap" : "row nowrap")};
 `;
 
-
 export const NumberBall = styled.div`
   width: 24px;
   height: 24px;

components/hooks/useCouponData.ts

@@ -1,4 +1,7 @@
-import { useState } from "react";
+
+import { getCoupons } from "@/pages/api/coupon";
+import { useEffect, useState } from "react";
+
 
 interface CouponContent {
   couponName: string;
@@ -8,25 +11,40 @@ interface CouponContent {
 }
 
 export const useCouponData = () => {
-  const [coupons, setCoupons] = useState<CouponContent[]>(exData);
+
+  const [coupons, setCoupons] = useState<CouponContent[]>([]);
 
   // api 호출해서 초기화
+  useEffect(() => {
+    const fetchData = async () => {
+      const result = await getCoupons({
+        type: "COUPON",
+        pageNumber: 1,
+        pageSize: 5,
+      });
+
+      result && setCoupons(result.coupons);
+    };
+
+    fetchData();
+  }, []);
+
 
   return { coupons };
 };
 
-// 예시 데이터
-const exData: CouponContent[] = [
-  {
-    couponName: "엽떡 10000원 할인",
-    couponStore: "엽기 떡볶이",
-    couponCondition: ["10만원 이상 구매시", "4명 이상이 오면"],
-    couponQuantity: 50,
-  },
-  {
-    couponName: "소소 떡볶이 10000원 할인",
-    couponStore: "엽기 떡볶이",
-    couponCondition: ["10만원 이상 구매시", "4명 이상이 오면"],
-    couponQuantity: 50,
-  },
-];
+// // 예시 데이터
+// const exData: CouponContent[] = [
+//   {
+//     couponName: "엽떡 10000원 할인",
+//     couponStore: "엽기 떡볶이",
+//     couponCondition: ["10만원 이상 구매시", "4명 이상이 오면"],
+//     couponQuantity: 50,
+//   },
+//   {
+//     couponName: "소소 떡볶이 10000원 할인",
+//     couponStore: "엽기 떡볶이",
+//     couponCondition: ["10만원 이상 구매시", "4명 이상이 오면"],
+//     couponQuantity: 50,
+//   },
+// ];

components/hooks/usePopupData.ts

@@ -3,10 +3,12 @@ import { useEffect, useState } from "react";
 
 enum PopupPeriod {
   none,
-  aDay,
-  aWeek,
-  twoWeek,
-  aMonth,
+
+  aDay = "하루간",
+  aWeek = "1주간",
+  twoWeek = "2주간",
+  aMonth = "1달간",
+
 }
 
 interface Popup {
@@ -18,13 +20,18 @@ interface Popup {
 }
 
 export const usePopupData = () => {
-  const [popups, setPopups] = useState<Popup[]>(exData);
+
+  const [popups, setPopups] = useState<Popup[]>([]);
+
 
   // api 호출해서 초기화
   useEffect(() => {
     const fetchData = async () => {
       const data = await getPopups(0);
       console.log(data);
+
+      data && setPopups(data.content);
+
     };
 
     fetchData();
@@ -35,19 +42,21 @@ export const usePopupData = () => {
 
 // 예시 데이터
 
-const exData: Popup[] = [
-  {
-    title: "오늘만 배부른 최뚝배기 가게 5% 추가할인!",
-    contents: "내용",
-    period: PopupPeriod.twoWeek,
-    timing: true,
-    store: "최뚝배기",
-  },
-  {
-    title: "오늘만 배부른 최뚝배기 가게 5% 추가할인!",
-    contents: "내용",
-    period: PopupPeriod.twoWeek,
-    timing: true,
-    store: "최뚝배기",
-  },
-];
+
+// const exData: Popup[] = [
+//   {
+//     title: "오늘만 배부른 최뚝배기 가게 5% 추가할인!",
+//     contents: "내용",
+//     period: PopupPeriod.twoWeek,
+//     timing: true,
+//     store: "최뚝배기",
+//   },
+//   {
+//     title: "오늘만 배부른 최뚝배기 가게 5% 추가할인!",
+//     contents: "내용",
+//     period: PopupPeriod.twoWeek,
+//     timing: true,
+//     store: "최뚝배기",
+//   },
+// ];
+

components/hooks/useUniv.ts

@@ -0,0 +1,17 @@
+import { getUnivs } from "@/pages/api/others";
+import { useEffect, useState } from "react";
+
+export const useUniv = async () => {
+  const [univ, setUniv] = useState();
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const result = await getUnivs();
+      setUniv(result);
+    };
+
+    fetchData();
+  }, []);
+
+  return { univ };
+};

components/organisms/Header.tsx

@@ -8,6 +8,9 @@ import { useRouter } from "next/router";
 import { useModal } from "../hooks/useModal";
 import { useSetRecoilState } from "recoil";
 import { initialState } from "@/state/user/user";
+
+import { Logout } from "@/pages/api/login";
+
 /*
 TODO:
 1. 로그인 - 세션스토리지 안에 로그인 여부에 따라서 다르게
@@ -27,7 +30,12 @@ const Header = () => {
   useEffect(() => {
     console.table(`USER SESSION DATA : ${userSessionData}`);
   }, [userSessionData]);
-  const logoutHandler = () => {
+
+  const logoutHandler = async () => {
+    console.log("logout");
+    const response = await Logout();
+    console.log(response);
+
     setLogout({
       logined: false,
       email: "",
@@ -55,13 +63,16 @@ const Header = () => {
           <UpperMenuItem
             onClick={() => {
               if (userSessionData) {
-                openModal();
+                logoutHandler();
+
               } else {
                 openModal();
               }
             }}
           >
-            {userSessionData ? "로그인" : "로그아웃"}
+
+            {userSessionData ? "로그아웃" : "로그인"}
+
           </UpperMenuItem>
 
           <UpperMenuItem>
@@ -84,14 +95,14 @@ const Header = () => {
             <Link href="/dashboard">대시보드</Link>
           </LowerMenuItem>
           <LowerMenuItem>
-            <Link href="/">가게찾기</Link>
+            <Link href="/search">가게찾기</Link>
           </LowerMenuItem>
           <LowerMenuItem>
-            <Link href="/">제휴가게</Link>
-
+            <Link href="/contact">제휴가게</Link>
           </LowerMenuItem>
           <LowerMenuItem>
-            <Link href="/">학생관리</Link>
+            학생관리
+
             <SubDropdownMenu>
               <SubDropdownMenuItem>
                 <Link href="/student/popup">팝업관리</Link>
@@ -148,6 +159,9 @@ const SubDropdownMenu = styled.div`
 
   visibility: hidden;
 
+  border-radius: 8px;
+  background: #f6f6f6;
+
   display: flex;
   flex-flow: column nowrap;
 `;
@@ -161,6 +175,10 @@ const SubDropdownMenuItem = styled.div`
   font-size: 0.7rem;
   width: 100px;
   height: 1.5rem;
+
+
+  padding: 3px 0px;
+
   &:hover {
     background-color: gray;
     color: white;
@@ -170,8 +188,11 @@ const SubDropdownMenuItem = styled.div`
 const LowerMenuItem = styled.li`
   position: relative;
 
-  color: #000;
+
+  color: var(--, #3d4149);
   text-align: center;
+  font-family: Pretendard;
+
   font-size: 16px;
   font-style: normal;
   font-weight: 400;

components/styles/PopUp.styles.tsx

@@ -69,6 +69,17 @@ export const TablePeriodTitle = styled.div`
   align-items: center;
 `;
 
+
+export const TableDeleteTitle = styled.div`
+  width: 35px;
+  border-radius: 6px;
+  background: #f7f7f7;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+`;
+
+
 export const PopUpsContainer = styled.div`
   border-radius: 6px;
   border: 1px solid #f7f7f7;
@@ -80,6 +91,20 @@ export const PopupContainer = styled.div`
   display: flex;
 `;
 
+
+export const DeleteBox = styled.div`
+  color: var(--, #3d4149);
+  font-size: 17px;
+  font-weight: 400;
+  line-height: 19.264px; /* 113.316% */
+  letter-spacing: -1.02px;
+  width: 35px;
+  display: flex;
+  align-items: center;
+  margin: 5px 8px;
+  border-bottom: 1px solid var(--g0, #f4f4f4);
+`;
+
 export const NumberBox = styled.div`
   width: 72px;
   color: ${COLORS.blue};