diff --git a/src/app/(route)/(main)/_components/home/home.tsx b/src/app/(route)/(main)/_components/home/home.tsx index 3418b4d..1f4ea4c 100644 --- a/src/app/(route)/(main)/_components/home/home.tsx +++ b/src/app/(route)/(main)/_components/home/home.tsx @@ -13,7 +13,7 @@ export default function Home() { const { data: rank } = useMyRankingQuery(); const { data: myTrashcan, status: trashcanStatus } = - useMyTrashcanQuery("SUGGESTION"); + useMyTrashcanQuery("REGISTRATION"); return (
diff --git a/src/app/(route)/(main)/_components/notice/notice.tsx b/src/app/(route)/(main)/_components/notice/notice.tsx index 067e71c..32f7abd 100644 --- a/src/app/(route)/(main)/_components/notice/notice.tsx +++ b/src/app/(route)/(main)/_components/notice/notice.tsx @@ -10,10 +10,10 @@ import { useState } from "react"; export default function Notice() { const [selectedNoticeType, setSelectedNoticeType] = - useState("all"); + useState("ALL"); const [isModalOpen, setIsModalOpen] = useState(false); - const [page, setPage] = useState(1); - const { data: noticeData } = useNoticeQuery(page); + const [page, setPage] = useState(0); + const { data: noticeData } = useNoticeQuery(page, selectedNoticeType); const [selectedNotice, setSelectedNotice] = useState( null, ); @@ -48,7 +48,7 @@ export default function Notice() { type="button" onClick={() => setSelectedNoticeType( - type[0] as "all" | "updated" | "event" | "general", + type[0] as "ALL" | "UPDATED" | "EVENT" | "GENERAL", ) } className={`${selectedNoticeType === type[0] ? "text-light-green border-b-4 border-light-green font-bold" : "border-b-2 py-2"}`} @@ -64,7 +64,7 @@ export default function Notice() { new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(), ) .filter((item) => - selectedNoticeType === "all" + selectedNoticeType === "ALL" ? true : item.state === NoticeTypeDict[selectedNoticeType], ) @@ -94,7 +94,7 @@ export default function Notice() { .fill(0) .map((_, index) => ( // eslint-disable-next-line react/no-array-index-key - ))} diff --git a/src/app/(route)/(main)/_components/registertrashcan/registertrashcan.tsx b/src/app/(route)/(main)/_components/registertrashcan/registertrashcan.tsx index 01d61a8..fcc693f 100644 --- a/src/app/(route)/(main)/_components/registertrashcan/registertrashcan.tsx +++ b/src/app/(route)/(main)/_components/registertrashcan/registertrashcan.tsx @@ -94,7 +94,7 @@ export default function RegisterTrashCan() { formData.append("longitude", selectedCoordinate?.x.toString()); fetch( - `${APIURL}/api/trashcan/${selectedMethod === "new" ? "registrations" : "suggestions"}`, + `${APIURL}/api/trashcans/${selectedMethod === "new" ? "registrations" : "suggestions"}`, { method: "POST", headers: { @@ -103,9 +103,11 @@ export default function RegisterTrashCan() { body: formData, }, ) - .then((res) => { + .then(async (res) => { + console.log(await res.json()); if (res.ok) { alert("성공적으로 등록되었습니다."); + window.location.reload(); } else { alert("등록에 실패했습니다."); } diff --git a/src/app/(route)/admin/map/[...status]/page.tsx b/src/app/(route)/admin/map/[...status]/page.tsx index 0ac9ed4..620bd0f 100644 --- a/src/app/(route)/admin/map/[...status]/page.tsx +++ b/src/app/(route)/admin/map/[...status]/page.tsx @@ -34,15 +34,19 @@ function RegisterationPage({ params }: { params: { status: string } }) { needRefresh, reFresh, markerRef, - } = useDrawMarker(params.status[0] as TrashCanStatus); + setNeedRefresh: setNeedRefreshMarker, + } = useDrawMarker(params.status[0].toUpperCase() as TrashCanStatus); useEffect(() => { setNeedRefresh(needRefresh); }, [needRefresh]); useEffect(() => { - setRefreshCallback(() => reFresh); - }, [reFresh]); + setRefreshCallback(() => () => { + setNeedRefreshMarker(false); + reFresh(); + }); + }, [reFresh, setNeedRefreshMarker]); return (
diff --git a/src/app/(route)/admin/map/layout.tsx b/src/app/(route)/admin/map/layout.tsx index 644622f..887fa55 100644 --- a/src/app/(route)/admin/map/layout.tsx +++ b/src/app/(route)/admin/map/layout.tsx @@ -33,7 +33,7 @@ export default function MapLayout({ children }: { children: React.ReactNode }) { location.longitude, ), ); - refreshCallback(); + refreshCallback?.(); }} logo="/svg/searchicon.svg" keywordSearchMethod={keywordSearch} @@ -46,7 +46,7 @@ export default function MapLayout({ children }: { children: React.ReactNode }) { type="button" onClick={() => { setNeedRefresh(false); - refreshCallback(); + refreshCallback?.(); }} > 새로 고침 diff --git a/src/app/(route)/admin/notice/page.tsx b/src/app/(route)/admin/notice/page.tsx index 934e438..b60477f 100644 --- a/src/app/(route)/admin/notice/page.tsx +++ b/src/app/(route)/admin/notice/page.tsx @@ -14,19 +14,19 @@ import { useRef, useState } from "react"; const buttonProps: ButtonProps[] = [ { content: "전체", - type: "all", + type: "ALL", }, { content: "업데이트", - type: "updated", + type: "UPDATED", }, { content: "이벤트", - type: "event", + type: "EVENT", }, { content: "일반", - type: "general", + type: "GENERAL", }, ]; @@ -38,10 +38,10 @@ const defaultRef = { }; export default function NoticePage() { - const [page, setPage] = useState(1); - const { data: noticeData } = useNoticeQuery(page); + const [page, setPage] = useState(0); const [selectedNoticeType, setSelectedNoticeType] = - useState("all"); + useState("ALL"); + const { data: noticeData } = useNoticeQuery(page, selectedNoticeType); const selectedNoticeRef = useRef(defaultRef); const [selectedNoticeId] = useState(""); const [selectedNoticeRefType, setSelectedNoticeRefType] = @@ -94,7 +94,7 @@ export default function NoticePage() {
state:
- {["업데이트", "이벤트", "일반"].map((type) => ( + {["UPDATED", "EVENT", "GENERAL"].map((type) => (
+ )} +

쓰레기통 관리

+
-
+
{data && - data?.reportResponses && - data?.reportResponses.map((trashcan: any) => ( + data?.trashcanListResponses && + data?.trashcanListResponses.map((trashcan: TrashCanInfo) => ( ))}
- {Array(data?.totalPages) - .fill(0) - .map((_, index) => ( + {page > 9 && ( + + )} + {getPageArray().map((index) => ( + + ))} + {data?.totalPages && + Math.floor(data.totalPages / 10) !== Math.floor(page / 10) && ( - ))} + )}
+ { + const num = Number(e.currentTarget.value); + if (!data?.totalPages) return; + if (e.key === "Enter" && num >= 0 && num <= data.totalPages) { + setPage(num - 1); + } + }} + />
); } diff --git a/src/app/api/auth/[...nextauth]/authoption.ts b/src/app/api/auth/[...nextauth]/authoption.ts index b42e787..18f35d1 100644 --- a/src/app/api/auth/[...nextauth]/authoption.ts +++ b/src/app/api/auth/[...nextauth]/authoption.ts @@ -49,7 +49,6 @@ export const authOptions: AuthOptions = { }); const result = await res.json(); - if (res.ok && result) { await setRefreshTokenCookie(res); return result; @@ -85,6 +84,7 @@ export const authOptions: AuthOptions = { if (res.ok) { await setRefreshTokenCookie(res); const data = await res.json(); + if (data) { user.accessToken = data.accessToken; user.jwtExpiredTime = data.jwtExpiredTime; diff --git a/src/app/api/auth/[...nextauth]/setrtcookie.ts b/src/app/api/auth/[...nextauth]/setrtcookie.ts index 47a62db..2a868e0 100644 --- a/src/app/api/auth/[...nextauth]/setrtcookie.ts +++ b/src/app/api/auth/[...nextauth]/setrtcookie.ts @@ -2,7 +2,7 @@ import { cookies } from "next/headers"; const setRefreshTokenCookie = async (res: Response) => { const resCookie = res.headers.getSetCookie(); - console.log(resCookie); + if (!resCookie || !resCookie.length) return; const cookie = resCookie[0] .split(";") @@ -11,6 +11,7 @@ const setRefreshTokenCookie = async (res: Response) => { acc[key.trim()] = value; return acc; }, {} as any); + if (cookies().has("RefreshToken")) cookies().delete("RefreshToken"); cookies().set("RefreshToken", cookie.RefreshToken, { secure: true }); }; diff --git a/src/hooks/mutation/usenoticemutation.ts b/src/hooks/mutation/usenoticemutation.ts index 361701b..4ec096f 100644 --- a/src/hooks/mutation/usenoticemutation.ts +++ b/src/hooks/mutation/usenoticemutation.ts @@ -14,10 +14,11 @@ const useNoticeMutation = ({ return useMutation({ mutationFn: async (input: NoticeResponse) => { + const fetchMethod = id ? "PATCH" : method; const res = await fetch( - `${APIURL}/api/notification${id ? `/${id}` : "/"}`, + `${APIURL}/api/notification${id ? `/${id}` : ""}`, { - method: id ? "PATCH" : method, + method: fetchMethod, headers: { "Content-Type": "application/json", Authorization: `Bearer ${session.data?.accessToken}`, @@ -26,7 +27,7 @@ const useNoticeMutation = ({ }, ); const data = await res.json(); - console.log(data); + if (!res.ok) throw new Error(data.error); return data; }, diff --git a/src/hooks/query/query.ts b/src/hooks/query/query.ts index 8018dca..a7d15db 100644 --- a/src/hooks/query/query.ts +++ b/src/hooks/query/query.ts @@ -6,17 +6,26 @@ import { import { APIURL } from "@/util/const"; import { getSession } from "next-auth/react"; +type NoticeType = "ALL" | "UPDATED" | "EVENT" | "GENERAL"; + interface MyTrashcanResponse { totalPages: number; trashcansResponses: TrashCanInfo[]; } export const queryInfo = { - notice: (page: number) => ({ - queryKey: ["notice", page], + notice: (page: number, notificationType: NoticeType) => ({ + queryKey: ["notice", page, notificationType], queryFn: async () => { - const res = await fetch(`${APIURL}/api/notification?page=${page}`); - if (!res.ok) return []; + const res = await fetch( + `${APIURL}/api/notification?page=${page}¬ificationType=${notificationType}`, + ); + + if (!res.ok) + return { + notificationInfoList: [], + totalPage: 0, + }; const data = await res.json(); return data; }, @@ -41,27 +50,19 @@ export const queryInfo = { info?.latitude ?? 0, info?.longitude ?? 0, info?.radius ?? 0, - info?.status ?? "added", + info?.status ?? "ADDED", info?.trashcanId ?? "", ], queryFn: async () => { if (!info) return []; - const { - latitude: lat, - longitude: lng, - radius, - status, - trashcanId: id, - } = info; + const { latitude: lat, longitude: lng, radius, status } = info; - const reqURL = id - ? `${APIURL}/api/trashcans/locations/details/${id}` - : `${APIURL}/api/trashcans/locations?${new URLSearchParams({ - latitude: lat.toString(), - longitude: lng.toString(), - radius: radius.toString(), - status: status ?? "added", - }).toString()}`; + const reqURL = `${APIURL}/api/trashcans/locations?${new URLSearchParams({ + latitude: lat.toString(), + longitude: lng.toString(), + radius: radius.toString(), + status: status ?? "ADDED", + }).toString()}`; const res = await fetch(reqURL, { method: "GET", @@ -70,12 +71,37 @@ export const queryInfo = { "Access-Control-Allow-Origin": "*", }, }); + if (!res.ok) return []; const data = await res.json(); return data; }, }), + trashcaninfobyid: (trashcanId: string) => ({ + queryKey: ["trashcaninfobyid", trashcanId], + queryFn: async () => { + if (!trashcanId) + return { + trashcanId: "", + status: "ADDED", + latitude: 0, + longitude: 0, + address: "", + addressDetail: "", + distance: 0, + }; + const res = await fetch( + `${APIURL}/api/trashcans/locations/details/${trashcanId}`, + ); + const data = await res.json(); + return data; + }, + onError: (e: any) => { + alert(e); + }, + }), + myranking: { queryKey: ["rank"], queryFn: async () => { @@ -118,7 +144,7 @@ export const queryInfo = { queryFn: async () => { const session = await getSession(); const response = await fetch( - `${APIURL}/api/admin/trashcans?page=${page}&status=${status}${sort?.length ? `&sort=${sort}` : ``}`, + `${APIURL}/api/admin/trashcans?size=10&page=${page}&status=${status}${sort?.length ? `&sort=${sort}` : ``}`, { headers: { Authorization: `Bearer ${session?.accessToken}`, @@ -179,7 +205,6 @@ export const infiniteQueryInfo = { ); const data = await res.json(); - if (data?.message) return { totalPages: 0, diff --git a/src/hooks/query/usenoticequery.ts b/src/hooks/query/usenoticequery.ts index c4e1ed8..be5e12c 100644 --- a/src/hooks/query/usenoticequery.ts +++ b/src/hooks/query/usenoticequery.ts @@ -2,10 +2,10 @@ import { useQuery } from "@tanstack/react-query"; import { queryInfo } from "./query"; export const NoticeTypeDict = { - all: "전체", - updated: "업데이트", - general: "일반", - event: "이벤트", + ALL: "전체", + UPDATED: "업데이트", + GENERAL: "일반", + EVENT: "이벤트", }; export type NoticeType = keyof typeof NoticeTypeDict; @@ -21,8 +21,8 @@ export interface NoticePageResponse { totalPage: number; } -const useNoticeQuery = (page: number) => { - return useQuery(queryInfo.notice(page)); +const useNoticeQuery = (page: number, notificationType: NoticeType) => { + return useQuery(queryInfo.notice(page, notificationType)); }; export default useNoticeQuery; diff --git a/src/hooks/query/usetrashcaninfobyid.ts b/src/hooks/query/usetrashcaninfobyid.ts new file mode 100644 index 0000000..8132247 --- /dev/null +++ b/src/hooks/query/usetrashcaninfobyid.ts @@ -0,0 +1,7 @@ +import { useQuery } from "@tanstack/react-query"; +import { TrashCanInfo } from "@/types/trashinfo"; +import { queryInfo } from "./query"; + +export default function useTrashcanInfoByIdQuery(id: string) { + return useQuery(queryInfo.trashcaninfobyid(id)); +}