Merge branch 'feat/notification' into develop

public/firebase-messaging-sw.js

@@ -25,7 +25,9 @@ self.addEventListener('push', function (event) {
       image: data.image,
       data: {
         click_action: data.click_action,
-        targetUrl: url.targetUrl
+        targetUrl: url.targetUrl,
+        targetId: url.targetId,
+        targetType: url.targetType
       }
     };
 
@@ -36,14 +38,18 @@ self.addEventListener('push', function (event) {
 });
 
 // 알림을 클릭하면 사이트로 이동한다.
-self.addEventListener('notificationclick', function (event) {
+self.addEventListener('notificationclick', async function (event) {
   event.preventDefault();
   // 알림창 닫기
   event.notification.close();
 
   // 이동할 url
   const urlToOpen = event.notification.data.targetUrl;
+  // const targetId = event.notification.data.targetId;
   console.log(urlToOpen);
+  console.log(event.notification);
+  const Type = event.notification.data.targetType;
+  console.log('asdfasf', Type);
   // 클라이언트에 해당 사이트가 열려 있는지 체크
   const promiseChain = clients
     .matchAll({
@@ -64,7 +70,13 @@ self.addEventListener('notificationclick', function (event) {
       if (matchingClient) {
         return matchingClient.focus();
       } else {
-        return clients.openWindow(urlToOpen);
+        if (Type === 'RESERVATION') {
+          return clients.openWindow(
+            `reservation/myreservationlist?targetId=${event.notification.data.targetId}`
+          );
+        } else {
+          return clients.openWindow(`community/${event.notification.data.targetId}`);
+        }
       }
     });
 

src/api/auth/auth.post.api.ts

@@ -1,13 +1,14 @@
 // import { ICommon } from '../types/common';
-import { postRequest } from '../request';
+import { patchRequest, postRequest } from '../request';
 import {
   ISignIn,
   ISignUp,
   IEmail,
   IEmailAuth,
   IPhoneNumber,
   IPhoneAuth,
-  UserLoginType
+  UserLoginType,
+  IPasswordVerifyChange
 } from '../types/auth';
 import { ICommon } from '../types/common';
 
@@ -54,6 +55,16 @@ export const emailauthrequest = async ({ emailAddress }: IEmail) => {
   return response;
 };
 
+/* 비밀번호 찾기 코드 요청 */
+
+export const emailauthpasswordrequest = async ({ emailAddress }: IEmail) => {
+  const response = await postRequest<ICommon<null>, IEmail>(`auth/password`, {
+    emailAddress
+  });
+
+  return response;
+};
+
 /* 이메일 코드 검증 */
 
 export const emailauthverify = async ({ emailAddress, code }: IEmailAuth) => {
@@ -65,6 +76,23 @@ export const emailauthverify = async ({ emailAddress, code }: IEmailAuth) => {
   return response;
 };
 
+/* 비밀번호 변경 patch */
+
+export const passwordchangerequest = async ({
+  email,
+  password
+}: IPasswordVerifyChange) => {
+  const response = await patchRequest<ICommon<null>, IPasswordVerifyChange>(
+    `auth/password`,
+    {
+      email,
+      password
+    }
+  );
+
+  return response;
+};
+
 /* 휴대전화 번호 인증 요청*/
 
 export const phoneauthrequest = async ({ phoneNumber }: IPhoneNumber) => {

src/api/types/auth.ts

@@ -45,6 +45,14 @@ export interface IWithdraw {
 export interface IEmail {
   emailAddress: string;
 }
+
+export interface IEmailChange {
+  email: string;
+}
+
+export interface IPasswordVerifyChange extends IEmailChange {
+  password: string;
+}
 export interface IEmailAuth extends IEmail {
   code: string;
 }

src/api/types/notification.ts

@@ -6,6 +6,7 @@ export interface NotificationType {
   content: string;
   targetUrl: string;
   date: string;
+  targetId: string;
 }
 
 interface NotificationListType {

src/components/notification/NoticeCommunityLayout.tsx

@@ -3,15 +3,16 @@ import CalculateTime from '@/utils/calculateTime';
 import Link from 'next/link';
 
 export const NotificationCommunityLayout = ({ notice }: { notice: NotificationType }) => {
+  console.log(notice);
   return (
-    <Link href={notice.targetUrl}>
+    <Link href={`community/${notice?.targetId}`}>
       <div
         key={notice?.notificationId}
         className="flex flex-row  justify-start items-center mt-[16px] mb-[36px] relative">
         <img src="/Notification-Check.svg" className="mr-[14px]" />
 
         <div className="flex flex-col justify-start items-start">
-          <div className="text-xs font-medium text-neutral-600  flex-grow">
+          <div className=" w-[250px] text-xs font-medium text-neutral-600  flex-grow">
             {notice?.content}
           </div>
         </div>

src/components/notification/NotificationLayout.tsx

@@ -1,10 +1,19 @@
 import { NotificationType } from '@/api/types/notification';
+import { useReservationStore } from '@/store/reservationModal.store';
 import CalculateTime from '@/utils/calculateTime';
 import Link from 'next/link';
 
 export const NotificationLayout = ({ notice }: { notice: NotificationType }) => {
+  const { setOpen, setReservationId, setIsMeeting } = useReservationStore();
+
   return (
-    <Link href={notice.targetUrl}>
+    <Link
+      href={`/reservation/myreservationlist?targetId=${notice?.targetId}`}
+      onClick={() => {
+        setOpen(true);
+        setIsMeeting(true);
+        setReservationId(notice?.targetId as any);
+      }}>
       <div
         key={notice?.notificationId}
         className="flex flex-row  justify-start items-center mt-[16px] mb-[36px] relative">

src/components/reservation/myReservationList/TodayReservation.tsx

@@ -1,14 +1,37 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import FocuszoneItem from './roomTypeItem/FocuszoneItem';
 import MeetingRoomItem from './roomTypeItem/MeetingRoomItem';
 import RechargingItem from './roomTypeItem/RechargingItem';
 import { useQuery } from 'react-query';
 import { getTodayReservationList } from '../remote/myreservation';
 import { todayListData } from '../model/myreservation';
 import { motion } from 'framer-motion';
-
+import { useReservationStore } from '@/store/reservationModal.store';
+import { useSearchParams, useRouter, usePathname } from 'next/navigation';
 const TodayReservation = () => {
   const { data } = useQuery(['todayReservationList'], () => getTodayReservationList());
+  const { setOpen, setReservationId, setIsMeeting } = useReservationStore();
+  const searchParams = useSearchParams();
+  const router = useRouter();
+  const search = searchParams.get('targetId');
+  const pathname = usePathname();
+  /* eslint-disable */
+  useEffect(() => {
+    setOpen(true);
+    setIsMeeting(true);
+    setReservationId(search as any);
+  }, [search, router]);
+
+  //10초후에 사라지도록 설정
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      if (searchParams.toString()) {
+        // 쿼리 스트링이 있는 경우 쿼리 스트링을 제거하고 페이지를 새로고침하지 않습니다.
+        router.replace(pathname);
+      }
+    }, 10000);
+    return () => clearTimeout(timer);
+  }, [setReservationId, setOpen]);
 
   if (data?.length == 0) {
     return (

src/components/reservation/myReservationList/modal/MeetingDetailModal.tsx

@@ -1,14 +1,16 @@
 'use client';
 import useOnClickOutside from '@/components/community/hooks/useOnClickOutside';
 import { useReservationStore } from '@/store/reservationModal.store';
-import React, { useRef } from 'react';
+import React, { useEffect, useRef } from 'react';
 import { useQuery } from 'react-query';
 import { getReservationDetail } from '../../remote/myreservation';
 import { format, isBefore, isSameDay, parseISO } from 'date-fns';
 import { participantsType } from '../../model/myreservation';
 import { ko } from 'date-fns/locale';
+import { useRouter } from 'next/navigation';
 
 const MeetingDetailModal = () => {
+  const router = useRouter();
   const {
     setOpen,
     reservationId,
@@ -28,14 +30,23 @@ const MeetingDetailModal = () => {
     }
   );
 
+  /* eslint-disable */
+  useEffect(() => {
+    if (data == undefined) {
+      alert('이미 종료된 일정입니다');
+      router.push('/');
+    }
+  }, []);
   if (data == undefined) {
     return null;
   }
 
-  const date = isSameDay(parseISO(data.startAt), new Date())
-    ? '오늘'
-    : format(parseISO(data?.startAt), 'EEE요일', { locale: ko });
-
+  const date =
+    data && data.startAt
+      ? isSameDay(parseISO(data.startAt), new Date())
+        ? '오늘'
+        : format(parseISO(data.startAt), 'EEE요일', { locale: ko })
+      : '';
   const renderButton = () => {
     const result = isBefore(data?.startAt, new Date());
     if (!result && data?.myMemberType == 'REPRESENTATIVE') {

src/components/sign/findpassword/EmailCertification.tsx

@@ -3,15 +3,16 @@ import { SignupBtnStatus } from '@/models/signupBtnStatus';
 import { motion } from 'framer-motion';
 import { useMutation } from 'react-query';
 import { invertSecond } from '@/utils/invertSecond';
-import { emailauthrequest, emailauthverify } from '@/api/auth/auth.post.api';
+import { emailauthpasswordrequest, emailauthverify } from '@/api/auth/auth.post.api';
 import { signError } from '@/constant/signError';
 import ToBack from '@/components/shared/sign/ToBack';
 
 interface EmailCertificationProps {
   setStep: Dispatch<React.SetStateAction<number>>;
+  setEmail: Dispatch<React.SetStateAction<string>>;
 }
 
-const EmailCertification = ({ setStep }: EmailCertificationProps) => {
+const EmailCertification = ({ setStep, setEmail }: EmailCertificationProps) => {
   const [userEmail, setUserEmail] = useState<string>('');
   const [emailValid, setEmailValid] = useState(false);
   const [btnStatus, setBtnStatus] = useState<SignupBtnStatus>('FIRST');
@@ -23,8 +24,12 @@ const EmailCertification = ({ setStep }: EmailCertificationProps) => {
   //추가
   const [errorMessage, setErrorMessage] = useState('');
 
-  const { mutateAsync: emailRequest } = useMutation((email: string) => {
-    return emailauthrequest({ emailAddress: email });
+  // const { mutateAsync: emailRequest } = useMutation((email: string) => {
+  //   return emailauthrequest({ emailAddress: email });
+  // });
+
+  const { mutateAsync: emailVerifyRequest } = useMutation((email: string) => {
+    return emailauthpasswordrequest({ emailAddress: email });
   });
 
   const { mutateAsync: emailVerify } = useMutation(
@@ -89,8 +94,9 @@ const EmailCertification = ({ setStep }: EmailCertificationProps) => {
   const handleClick = async () => {
     if (btnStatus == 'SECOND') {
       try {
-        const { status } = await emailRequest(userEmail);
+        const { status } = await emailVerifyRequest(userEmail);
         if (status == 'SUCCESS') {
+          setEmail(userEmail);
           setIsRequest(true);
           setBtnStatus('THIRD');
         }

src/components/sign/findpassword/NewPasswordForm.tsx

@@ -1,9 +1,13 @@
+import { passwordchangerequest } from '@/api/auth/auth.post.api';
 import React, { ChangeEvent, Dispatch, useState } from 'react';
+import { useMutation } from 'react-query';
 
 const NewPasswordForm = ({
-  setStep
+  setStep,
+  Email
 }: {
   setStep: Dispatch<React.SetStateAction<number>>;
+  Email: string;
 }) => {
   const [newPassword, setNewPassword] = useState('');
   const [checkPassword, setCheckPassword] = useState('');
@@ -29,6 +33,12 @@ const NewPasswordForm = ({
     );
   };
 
+  const { mutateAsync: passwordChange } = useMutation(
+    ({ email, password }: { email: string; password: string }) => {
+      return passwordchangerequest({ email: email, password: password });
+    }
+  );
+
   const checkValidPassword = () => {
     const passwordRegex = /^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[@#$%^&+=!])(?=\S+$).{8,16}$/;
     if (!passwordRegex.test(newPassword)) {
@@ -46,6 +56,7 @@ const NewPasswordForm = ({
 
   const handleButtonClick = () => {
     //todo : 비밀번호 변경 요청 api 필요
+    passwordChange({ email: Email, password: newPassword });
     setStep((prev) => prev + 1);
   };
 

src/components/sign/findpassword/SetNewPasswod.tsx

@@ -3,9 +3,11 @@ import NewPasswordForm from './NewPasswordForm';
 import ToBack from '@/components/shared/sign/ToBack';
 
 const SetNewPassword = ({
-  setStep
+  setStep,
+  Email
 }: {
   setStep: Dispatch<React.SetStateAction<number>>;
+  Email: string;
 }) => {
   return (
     <div className="max-w-[360px] mx-auto">
@@ -14,7 +16,7 @@ const SetNewPassword = ({
         새로 사용할 <br />
         비밀번호를 설정해주세요.
       </div>
-      <NewPasswordForm setStep={setStep} />
+      <NewPasswordForm setStep={setStep} Email={Email} />
     </div>
   );
 };

src/pages/_document.tsx

@@ -4,6 +4,7 @@ export default function Document() {
   return (
     <Html lang="ko">
       <Head>
+        <title>{'Offispace'}</title>
         <link rel="manifest" href="/manifest.json" />
         <link rel="icon" href="/favicon16.png" />
       </Head>

src/pages/mypage/changeprofile/index.tsx

@@ -47,6 +47,8 @@ export default function Profile() {
       };
       reader.readAsDataURL(event.target.files[0]); // 파일을 데이터 URL로 읽습니다.
     }
+    alert('프로필 사진이 변경되었습니다.');
+    window.location.reload();
   };
 
   const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
@@ -58,7 +60,7 @@ export default function Profile() {
     console.log(formData);
   };
   useUpdateMember();
-
+  console.log(member);
   return (
     <div className="w-full  flex items-center justify-center">
       <div className="w-full max-w-md bg-white p-6 rounded-lg ">