-
+
+
-
+ {ChangeDate()}
+
+ (initialPage);
+
+ const queryClient = useQueryClient();
+ const { data, isLoading, isError, error } = useUserPostsCall(
+ currentPage || 1
+ );
+ const totalPages = data?.totalPages;
+
+ useEffect(() => {
+ router.push(`?page=${currentPage}`);
+ queryClient.invalidateQueries({ queryKey: ["sortPosts", currentPage] });
+ }, [currentPage, queryClient, router]);
+
+ // 컴포넌트가 마운트될 때 상태 초기화
+ useEffect(() => {
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ setCurrentPage(newPage);
+ }, []);
+
+ // URL 변경 사항을 감지하여 상태 업데이트
+ useEffect(() => {
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ setCurrentPage(newPage);
+ }, [searchParams]);
+
+ const renderNoPostsFound = () => {
+ if (data?.content.length === 0) {
+ return (
+ (initialPage);
+
+ const queryClient = useQueryClient();
+ const { data, isLoading, isError, error } = useUserCommentsCall(
+ currentPage || 1
+ );
+ const totalPages = data?.totalPages;
+
+ const comments = data?.content;
+
+ useEffect(() => {
+ router.push(`?page=${currentPage}`);
+ queryClient.invalidateQueries({ queryKey: ["sortPosts", currentPage] });
+ }, [currentPage, queryClient, router]);
+
+ // 컴포넌트가 마운트될 때 상태 초기화
+ useEffect(() => {
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ setCurrentPage(newPage);
+ }, []);
+
+ // URL 변경 사항을 감지하여 상태 업데이트
+ useEffect(() => {
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ setCurrentPage(newPage);
+ }, [searchParams]);
+
+ const renderNoPostsFound = () => {
+ if (data?.content.length === 0) {
+ return (
+
- 여행 일정 관리를 플래너로! + 여행 일정 관리를 플래너 + 로!
- 플래너를 이용해 더욱 편리하게 여행 일정을 관리해보세요. + 플래너를 이용해 더욱 + 편리하게 여행 일정을 관리해보세요. +
++ 선택한 날짜가 포함된 달의 플랜을 표시합니다.
-
);
-};
\ No newline at end of file
+}
diff --git a/src/app/change-nickname/page.tsx b/src/app/change-nickname/page.tsx
deleted file mode 100644
index 5b1b89b..0000000
--- a/src/app/change-nickname/page.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-'use client';
-
-import { url } from '../store';
-import { useRouter } from 'next/navigation';
-import { useState } from 'react';
-import useAuthStore from '../store';
-
-export default function ChangeNickname() {
- const { clearTokens } = useAuthStore();
-
- const [nickname, set_nickname] = useState('')
- const router = useRouter();
-
- async function change_nickname() {
- const data = { nickname: nickname }
-
- try {
- const response = await fetch(`${url}/member/authed/nickname`, {
- method: 'PATCH',
- headers: {
- 'Authorization': `${localStorage.getItem("accessToken")}`,
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data),
- });
-
- if (response.status === 200) {
- alert("닉네임 변경이 완료되었습니다")
- router.push('/');
- }
-
- else if (response.status === 400) {
- alert("유저를 찾지 못하였습니다")
- }
-
- else if (response.status === 403) {
- // 엑세스 토큰 재발급 시도
- const responseagain = await fetch(`${url}/member/authed/nickname`, {
- method: 'PATCH',
- headers: {
- 'Refresh': `${localStorage.getItem("refreshToken")}`,
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data),
- });
- if (responseagain.status === 200) {
- alert("닉네임 변경이 완료되었습니다")
- router.push('/');
- const token = responseagain.headers.get('Authorization');
- if (typeof token === 'string') {
- localStorage.setItem('accessToken', token);
- }
-
- }
- else if (responseagain.status === 403) {
- alert("세션이 종료되었습니다. 다시 로그인해주세요")
- router.push('/');
- clearTokens();
-
- }
- }
- }
- catch (error) {
- }
- }
-
- return (
- <>
- {ChangeDate()}
- -
-
-
- 경북궁
-서울 종로구 사직로 161 경복궁
-한복 빌려 입고 이쁜 사진 찍기!
-
-
-
- 4분
-
-
-
- 애즈라이크 서촌
-서울 종로구 효자로 7길 23 1층 애즈라이크
-스테이크 샌드위치 추천 메뉴
-
-
-
- 14분
-
-
+ {showModal && (
+ 서울역
-서울 용산구 한강대로 405
-21시 6번 플랫폼
+
+ 플랜 추가
+
+
+
+ {filterData?.length !== 0 &&
+ filterData?.map((planner: FilterPlanner) => (
+
handleShowModal(planner.planner)}
+ >
+
+ ))}
+ {!isLoading && filterData?.length === 0 && (
+ + {planner?.planner?.title} +
+{planner?.planner?.subTitle}
++ {planner?.planner?.personnel}명 +
++ + {planner?.planner?.location?.length} + + 개의 일정이 있습니다. +
++ 선택한 달에 등록된 일정이 없습니다. +
+ )}
-
-
- );
-}
\ No newline at end of file
diff --git a/src/app/change-pw/page.tsx b/src/app/change-pw/page.tsx
deleted file mode 100644
index d20551e..0000000
--- a/src/app/change-pw/page.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-'use client';
-
-import { url } from '../store';
-import { useRouter } from 'next/navigation';
-import { useState } from 'react';
-import useAuthStore from '../store';
-
-export default function ChangePassword() {
- const { clearTokens } = useAuthStore();
-
- const [password, set_password] = useState('')
- const [password_check, set_password_check] = useState('')
-
- const router = useRouter();
-
- async function change_password() {
- if (password === password_check) {
- const data = { password: password }
-
- try {
- const response = await fetch(`${url}/member/authed/password`, {
- method: 'PATCH',
- headers: {
- 'Authorization': `${localStorage.getItem("accessToken")}`,
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data),
- });
-
- if (response.status === 200) {
- alert("암호 변경이 완료되었습니다")
- router.push('/');
-
-
- }
-
- else if (response.status === 400) {
- alert("비밀번호는 영문(대,소문자)과 숫자가 적어도 1개 이상씩 포함되어야 합니다 또한 길이가 8에서 30 사이여야 합니다")
- }
-
-
- else if (response.status === 403) {
- // 엑세스 토큰 재발급 시도
- const responseagain = await fetch(`${url}/member/authed/password`, {
- method: 'PATCH',
- headers: {
- 'Refresh': `${localStorage.getItem("refreshToken")}`,
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data),
- });
- if (responseagain.status === 200) {
- alert("암호 변경이 완료되었습니다")
- router.push('/');
- const token = responseagain.headers.get('Authorization');
- if (typeof token === 'string') {
- localStorage.setItem('accessToken', token);
- }
-
- } else if (response.status === 403) {
- alert("세션이 종료되었습니다. 다시 로그인해주세요")
- router.push('/');
- clearTokens();
-
- }
- }
- }
- catch (error) {
- }
- } else {
- alert("암호가 일치하지 않습니다. 다시 확인해주세요.")
- }
- }
-
- return (
- <>
-
-
- set_nickname(e.target.value)}
- required
- />
-
-
-
-
-
-
- );
-}
\ No newline at end of file
diff --git a/src/app/check-my-activity/boards/page.tsx b/src/app/check-my-activity/boards/page.tsx
new file mode 100644
index 0000000..18c5240
--- /dev/null
+++ b/src/app/check-my-activity/boards/page.tsx
@@ -0,0 +1,81 @@
+"use client";
+
+import CardPost from "@/app/components/CardPost";
+import ErrorShow from "@/app/components/Error";
+import LoadingSpinner from "@/app/components/Loading";
+import NavigationNumberMain from "@/app/components/NavigationNumberMain";
+import useUserPostsCall from "@/hooks/userHooks/useUserPostsCall";
+import { Post } from "@/types/post";
+import { useQueryClient } from "@tanstack/react-query";
+import { useRouter, useSearchParams } from "next/navigation";
+import { Suspense, useEffect, useState } from "react";
+
+function CheckMyActivityBoard() {
+ const router = useRouter();
+ const searchParams = useSearchParams();
+
+ const initialPage = parseInt(searchParams.get("page") || "1", 10);
+
+ const [currentPage, setCurrentPage] = useState
-
- set_password(e.target.value)}
- required
- />
-
- set_password_check(e.target.value)}
- required
-
- />
-
-
-
+
+ );
+ }
+ };
+
+ return (
+ 게시글이 존재하지 않습니다.
+
+ {renderNoPostsFound()}
+
+ );
+}
+
+function CheckMyActivityBoardWrapper() {
+ return (
+
+
+ );
+ }
+ };
+
+ return (
+ 댓글이 존재하지 않습니다.
+
+ {renderNoPostsFound()}
+
+ );
+}
+
+function CheckMyActivityCommentWrapper() {
+ return (
+
+
+ );
+}
+
+export default CheckMyActivity;
diff --git a/src/app/check-my-info/page.tsx b/src/app/check-my-info/page.tsx
index 417c417..9c50d12 100644
--- a/src/app/check-my-info/page.tsx
+++ b/src/app/check-my-info/page.tsx
@@ -1,122 +1,62 @@
-'use client';
+"use client";
-import React, { useEffect, useState } from 'react';
-import useAuthStore from '../store';
-import { useRouter } from 'next/navigation';
+import { Link } from "@nextui-org/react";
-import { url } from '../store';
-import { Link } from '@nextui-org/react';
+import useGetUserInfo from "@/hooks/userHooks/useGetUserInfo";
export default function CheckMyInfo() {
- const router = useRouter();
- const { clearTokens } = useAuthStore();
-
- const [userInfo, setUserInfo] = useState({
- username: '',
- nickname: '',
- real_name: '',
- email: '',
- age: 0
- });
-
- useEffect(() => {
- getMyInfo();
- }, []);
-
-
- // 값을 받아오는 api 호출에서 중복된 코드가 보임
- // Jwt 토큰을 이용해 데이터를 받아오는 부분
- const getMyInfo = async () => {
- try {
- const response = await fetch(`${url}members/authed`, {
- method: 'GET',
- headers: {
- 'Authorization': `${localStorage.getItem("accessToken")}`,
- 'Content-Type': 'application/json'
- }
- });
-
- if (response.status === 200) {
- const data = await response.json();
- setUserInfo({
- username: data.username,
- nickname: data.nickname,
- email: data.email,
- real_name: data.name,
- age: data.age
- });
- } else if (response.status === 400) {
- alert("사용자 정보를 찾을 수 없습니다");
- } else if (response.status === 403) {
- await handleTokenRefresh();
- }
- } catch (error) {
- alert("Error");
- }
- };
-
-
- // Jwt 토큰이 만료되었다면 Refresh 토큰 이용해 데이터를 받아오는 부분
- const handleTokenRefresh = async () => {
- try {
- const response = await fetch(`${url}/member/authed`, {
- method: 'GET',
- headers: {
- 'Refresh': `${localStorage.getItem("refreshToken")}`,
- 'Content-Type': 'application/json'
- }
- });
-
- if (response.status === 200) {
- const data = await response.json();
- setUserInfo({
- username: data.username,
- nickname: data.nickname,
- email: data.email,
- real_name: data.name,
- age: data.age
- });
-
- const token = response.headers.get('Authorization');
- if (token) {
- localStorage.setItem('accessToken', token);
- }
- } else {
- alert("세션이 만료되었습니다. 다시 로그인해주세요");
- clearTokens();
- router.push('/');
- }
- } catch (error) {
- alert("Error");
- }
- };
+ const { data, error, isLoading } = useGetUserInfo();
return (
- <>
-
+
+
+
+
+
+
+ +
+ {pageStatus === "board" ? (
+
+
-
-
- 
+
+
);
}
diff --git a/src/app/components/CardPost.tsx b/src/app/components/CardPost.tsx
index 3512437..fc9d411 100644
--- a/src/app/components/CardPost.tsx
+++ b/src/app/components/CardPost.tsx
@@ -1,10 +1,12 @@
-'use client';
+"use client";
import Link from "next/link";
import { CardPostProps } from "@/types/post";
import { IoEyeOutline } from "react-icons/io5";
import { FaRegCommentDots } from "react-icons/fa6";
import formatDate from "@/util/formatDate";
+import Image from "next/image";
+import blurImage from "@/util/blurImage";
const CardPost = ({ post }: CardPostProps): JSX.Element => {
const titleCut = () => {
@@ -20,10 +22,8 @@ const CardPost = ({ post }: CardPostProps): JSX.Element => {
};
return (
-
+
-
+
+
+
+
+ 나의 활동
+
+
+
+
+
+ 회원 탈퇴
+
+
+
+
- + {data?.nickname} +
+{data?.email}
-
+
+ {userInfo.nickname}
-{userInfo.email}
-가입일: 2024년 1월 15일
-
-
- 비밀번호 수정
+
- 설정
+-
+
- + + 내 정보 수정 - - 프로필 수정 + +
- + + 비밀번호 변경 -
+
+
+
-
+
(initialPage);
- const [sortOption, setSortOption] = useState(initialSortOption);
+ const [currentPage, setCurrentPage] = useState(initialPage);
+ const [sortOption, setSortOption] = useState(initialSortOption);
const queryClient = useQueryClient();
- const { data, isLoading, isError, error } = useSortPosts(currentPage || 1, sortOption);
+ const { data, isLoading, isError, error, refetch } = useSortPosts(
+ currentPage || 1,
+ sortOption
+ );
const totalPages = data?.totalPages;
useEffect(() => {
router.push(`?page=${currentPage}&sort=${sortOption}`);
- queryClient.invalidateQueries({ queryKey: ['sortPosts', currentPage, sortOption] });
+ queryClient.invalidateQueries({
+ queryKey: ["sortPosts", currentPage, sortOption],
+ });
}, [currentPage, sortOption, queryClient, router]);
useEffect(() => {
- queryClient.invalidateQueries({ queryKey: ['sortPosts', currentPage, sortOption] });
+ queryClient.invalidateQueries({
+ queryKey: ["sortPosts", currentPage, sortOption],
+ });
}, [currentPage, sortOption, queryClient]);
// 컴포넌트가 마운트될 때 상태 초기화
useEffect(() => {
- const newPage = parseInt(searchParams.get('page') || '1', 10);
- const newSortOption = searchParams.get('sort') || 'latest';
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ const newSortOption = searchParams.get("sort") || "latest";
+ refetch();
setCurrentPage(newPage);
setSortOption(newSortOption);
}, []);
// URL 변경 사항을 감지하여 상태 업데이트
useEffect(() => {
- const newPage = parseInt(searchParams.get('page') || '1', 10);
- const newSortOption = searchParams.get('sort') || 'latest';
+ const newPage = parseInt(searchParams.get("page") || "1", 10);
+ const newSortOption = searchParams.get("sort") || "latest";
setCurrentPage(newPage);
setSortOption(newSortOption);
}, [searchParams]);
@@ -59,24 +66,32 @@ const CardPosts = () => {
게시글이 존재하지 않습니다.
- )
- };
+ );
+ }
};
return (
- ({
+ mode: "onChange", // 입력 값이 변경될 때마다 유효성 검사
+ reValidateMode: "onChange", // 입력 값이 변경될 때마다 유효성 검사
+ });
+
+ const checkPassword = (password: { password: string }) => {
+ if (!password) return;
+
+ mutate(password, {
+ onSuccess: () => {
+ setCheckKey(true);
+ },
+ });
+ };
+
+ const errorStyle = "text-sm text-red-500 font-semibold";
+ return (
+ (null); // 단일 ID로 변경
- const [comment, setComment] = useState('');
- const [updateToggle, setUpdateToggle] = useState<{ [key: number]: boolean }>({});
- const [updateComment, setUpdateComment] = useState<{ [key: number]: string }>({});
- const { data, isLoading, isError, error, isSuccess } = useGetComment(id);
- const { mutate: postCommentMutate } = usePostComment(id);
+ const [commentOptionVisible, setCommentOptionVisible] = useState<
+ number | null
+ >(null); // 단일 ID로 변경
+ const { register, handleSubmit, reset } = useForm();
+ const [updateToggle, setUpdateToggle] = useState<{ [key: number]: boolean }>(
+ {}
+ );
+ const [updateComment, setUpdateComment] = useState<{ [key: number]: string }>(
+ {}
+ );
+ const [page, setPage] = useState(1);
+ const [commentList, setCommentList] = useState([]);
+ const {
+ data,
+ isLoading: commentIsLoading,
+ refetch,
+ } = useGetComment(id, page);
+ const { mutate: postCommentMutate, isPending: PostCommentIsPending } =
+ usePostComment(id);
const { mutate: deleteCommentMutate } = useDelteMutation(id);
const { mutate: updateCommentMutate } = useUpdateComment(id);
const [score, setScore] = useState(0);
const [updateScore, setUpdateScore] = useState(0);
const menuRefs = useRef<(HTMLDivElement | null)[]>([]);
const buttonRefs = useRef<(HTMLButtonElement | null)[]>([]);
- const queryClient = useQueryClient();
+ const {
+ data: cacheData,
+ isLoading,
+ refetch: accessRefetch,
+ } = useAccessCheck();
- queryClient.invalidateQueries({ queryKey: ['accessCheck'] });
- const cacheData = queryClient.getQueryData(['accessCheck']);
+ const loadMoreComments = () => {
+ if (data?.totalPages === page) return;
+ setPage((prev) => prev + 1);
+ refetch();
+ };
+
+ useEffect(() => {
+ if (data) {
+ setCommentList((prev) => {
+ const newComments = data.content.filter(
+ (newComment: CommentResponse) =>
+ !prev.some(
+ (existingComment) => existingComment.id === newComment.id
+ )
+ );
+ return [...prev, ...newComments];
+ });
+ }
+ }, [data]);
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (commentOptionVisible !== null) {
const menuElement = menuRefs.current[commentOptionVisible];
const buttonElement = buttonRefs.current[commentOptionVisible];
- if (menuElement && !menuElement.contains(event.target as Node) && buttonElement && !buttonElement.contains(event.target as Node)) {
+ if (
+ menuElement &&
+ !menuElement.contains(event.target as Node) &&
+ buttonElement &&
+ !buttonElement.contains(event.target as Node)
+ ) {
setCommentOptionVisible(null);
}
}
};
- document.addEventListener('mousedown', handleClickOutside);
+ document.addEventListener("mousedown", handleClickOutside);
return () => {
- document.removeEventListener('mousedown', handleClickOutside);
+ document.removeEventListener("mousedown", handleClickOutside);
};
}, [commentOptionVisible]);
- const handleCommentPost = (e: React.FormEvent) => {
- e.preventDefault();
- if (!comment.trim()) {
- setComment('');
+ const handleCommentPost = (formData: FormData) => {
+ if (!formData.comment.trim()) {
+ reset();
return;
}
- queryClient.invalidateQueries({ queryKey: ['accessCheck'] });
- const cacheData = queryClient.getQueryData(['accessCheck']);
- if(!cacheData) {
+ accessRefetch();
+ if (!cacheData && !isLoading) {
Swal.fire({
- icon: 'error',
- title: '로그인 필요',
- text: '로그인이 필요한 서비스입니다.'
+ icon: "error",
+ title: "로그인 필요",
+ text: "로그인이 필요한 서비스입니다.",
});
return;
}
- postCommentMutate({ id, score, comment });
- setComment('');
- setScore(0);
+ postCommentMutate(
+ { id, score, comment: formData.comment },
+ {
+ onSuccess: () => {
+ reset();
+ setScore(0);
+ },
+ }
+ );
};
const toggleCommentOptions = (commentId: number) => {
@@ -81,15 +130,21 @@ const Comment = ({ id, loginNickname }: CommentProps) => {
};
const handleDeleteComment = (commentId: number) => {
- if(!cacheData) {
+ if (!cacheData && !isLoading) {
Swal.fire({
- icon: 'error',
- title: '로그인 필요',
- text: '로그인이 필요한 서비스입니다.'
+ icon: "error",
+ title: "로그인 필요",
+ text: "로그인이 필요한 서비스입니다.",
});
return;
}
- deleteCommentMutate(commentId)
+ deleteCommentMutate(commentId, {
+ onSuccess: () => {
+ setCommentList((prev) =>
+ prev.filter((comment) => comment.id !== commentId)
+ );
+ },
+ });
};
const handleUpdateComment = (commentId: number) => {
@@ -100,7 +155,10 @@ const Comment = ({ id, loginNickname }: CommentProps) => {
}));
setUpdateComment((prev) => ({
...prev,
- [commentId]: data?.content.find((comment: CommentResponse) => comment.id === commentId)?.comment || '',
+ [commentId]:
+ data?.content.find(
+ (comment: CommentResponse) => comment.id === commentId
+ )?.comment || "",
}));
};
@@ -111,30 +169,59 @@ const Comment = ({ id, loginNickname }: CommentProps) => {
}));
setUpdateComment((prev) => ({
...prev,
- [commentId]: '',
+ [commentId]: "",
}));
};
const handlePostUpdate = (commentId: number) => {
- if(!cacheData) {
+ if (!cacheData && !isLoading) {
Swal.fire({
- icon: 'error',
- title: '로그인 필요',
- text: '로그인이 필요한 서비스입니다.'
+ icon: "error",
+ title: "로그인 필요",
+ text: "로그인이 필요한 서비스입니다.",
});
return;
}
- const originalComment = data?.content.find((comment: CommentResponse) => comment.id === commentId);
+ const originalComment = data?.content.find(
+ (comment: CommentResponse) => comment.id === commentId
+ );
// 새 별점이 0이거나 원래 별점과 같다면, 원래 별점을 사용
- const finalScore = updateScore === 0 || updateScore === originalComment?.score ? originalComment?.score : updateScore;
+ const finalScore =
+ updateScore === 0 || updateScore === originalComment?.score
+ ? originalComment?.score
+ : updateScore;
- // 댓글 내용과 별점이 변경되지 않았으면 리턴
- if (originalComment?.comment === updateComment[commentId] && finalScore === originalComment?.score) {
+ // 댓글 내용과 별점 둘 다 변경되지 않았다면, return
+ if (
+ originalComment?.comment === updateComment[commentId] &&
+ finalScore === originalComment?.score
+ ) {
return;
}
- updateCommentMutate({ commentId, score: finalScore, comment: updateComment[commentId] });
+ updateCommentMutate(
+ {
+ commentId,
+ score: finalScore,
+ comment: updateComment[commentId],
+ },
+ {
+ onSuccess: () => {
+ setCommentList((prev) =>
+ prev.map((comment) =>
+ comment.id === commentId
+ ? {
+ ...comment,
+ score: finalScore,
+ comment: updateComment[commentId],
+ }
+ : comment
+ )
+ );
+ },
+ }
+ );
setCommentOptionVisible(null);
setUpdateScore(0);
setUpdateToggle((prev) => ({
@@ -143,58 +230,98 @@ const Comment = ({ id, loginNickname }: CommentProps) => {
}));
setUpdateComment((prev) => ({
...prev,
- [commentId]: '',
+ [commentId]: "",
}));
};
-
+
return (
-
-
-
-
- {titleCut()}
-
-
+
);
};
-export default CardPost;
\ No newline at end of file
+export default CardPost;
diff --git a/src/app/components/CardPosts.tsx b/src/app/components/CardPosts.tsx
index f51bdf9..3626843 100644
--- a/src/app/components/CardPosts.tsx
+++ b/src/app/components/CardPosts.tsx
@@ -1,4 +1,4 @@
-'use client';
+"use client";
import CardPost from "./CardPost";
import { Post } from "@/types/post";
@@ -9,44 +9,51 @@ import useSortPosts from "@/hooks/useSortPosts";
import { useQueryClient } from "@tanstack/react-query";
import LoadingSpinner from "./Loading";
import ErrorShow from "./Error";
-
import { useRouter, useSearchParams } from "next/navigation";
const CardPosts = () => {
- const router = useRouter();
- const searchParams = useSearchParams();
+ const router = useRouter();
+ const searchParams = useSearchParams();
- const initialPage = parseInt(searchParams.get('page') || '1', 10);
- const initialSortOption = searchParams.get('sort') || 'latest';
+ const initialPage = parseInt(searchParams.get("page") || "1", 10);
+ const initialSortOption = searchParams.get("sort") || "latest";
- const [currentPage, setCurrentPage] = useState{post?.member?.nickname}
{formatDate(post?.time?.createTime)}
@@ -32,22 +32,40 @@ const CardPost = ({ post }: CardPostProps): JSX.Element => {
+ {post?.image && (
+
+
-
- {isError && }
- {data?.content.map((post: Post) => (
-
+ <>
+
+
+
+
+ );
+};
+
+export default CheckPasswordModal;
diff --git a/src/app/components/Comment.tsx b/src/app/components/Comment.tsx
index 5128732..c172592 100644
--- a/src/app/components/Comment.tsx
+++ b/src/app/components/Comment.tsx
@@ -1,4 +1,4 @@
-'use client';
+"use client";
import { Textarea } from "@nextui-org/input";
import { useEffect, useRef, useState } from "react";
@@ -11,69 +11,118 @@ import { CommentResponse } from "@/types/comment";
import useDelteMutation from "@/hooks/useDeleteComment";
import useUpdateComment from "@/hooks/useUpdateComment";
import { Rate } from "antd";
-import { useQueryClient } from "@tanstack/react-query";
import Swal from "sweetalert2";
import formatDate from "@/util/formatDate";
+import { Button } from "@nextui-org/react";
+import { useForm } from "react-hook-form";
+import useAccessCheck from "@/hooks/TokenHooks/useAccessCheck";
type CommentProps = {
- id: number;
+ id: string;
loginNickname: string;
};
+interface FormData {
+ comment: string;
+}
+
const Comment = ({ id, loginNickname }: CommentProps) => {
- const [commentOptionVisible, setCommentOptionVisible] = useState
+
+
+
+
+ router.back()}
+ />
+
+
+ + 비밀번호 확인 +
+
- {data?.content.length ?