refactor: admin & announcement api

src/api/admin.js → src/api/admin.ts

@@ -1,12 +1,12 @@
 import { GET, PUT, POST, DELETE } from "../utils/axios";
 
-export const getPartyList = async (status) =>
+export const getPartyList = async (status: string) =>
   await GET(`/admin/party?status=${status}`, true);
 
-export const getPartyDetail = async (partyId) =>
+export const getPartyDetail = async (partyId: string) =>
   await GET(`/admin/party/${partyId}`, true);
 
-export const getPartyDriverReady = async (partyId, ready) =>
+export const getPartyDriverReady = async (partyId: string, ready: boolean) =>
   await GET(`/admin/party/driver-ready/${partyId}?ready=${ready}`, true);
 
 export const getUserListAdmin = async () => await GET("/admin/user/list", true);
@@ -16,80 +16,83 @@ export const getMonthlyIncome = async () =>
 
 export const getReportList = async () => await GET("/report", true);
 
-export const getReportDetail = async (reportId) =>
+export const getReportDetail = async (reportId: string) =>
   await GET(`/report/${reportId}`, true);
 
 export const getReportCompleteList = async () =>
   await GET("/report/complete", true);
 
-export const getReportCompleteDetail = async (reportId) =>
+export const getReportCompleteDetail = async (reportId: string) =>
   await GET(`/report/complete/${reportId}`, true);
 
-export const updateReportComplete = async (reportId) =>
+export const updateReportComplete = async (reportId: string) =>
   await PUT(`/report/${reportId}`, {}, true);
 
-export const postSuspension = async (userId, body) =>
+export const postSuspension = async (userId: number, body: any) =>
   await POST(`/suspension/${userId}`, body, true);
 
-export const deleteSuspensionUser = async (userId) =>
-  await DELETE(`/suspension/${userId}`, true);
-
-export const deleteSuspensionReport = async (reportId) =>
+export const deleteSuspensionReport = async (reportId: number) =>
   await DELETE(`/suspension/report/${reportId}`, true);
 
-export const getPaymentList = async (status) =>
+export const getPaymentList = async (status: string) =>
   await GET(`/admin/payment?status=${status}`, true);
 
-export const getIncomeList = async (month) =>
+export const getIncomeList = async (month: string) =>
   await GET(`/income/admin/monthly?month=${month}`, true);
 
-export const updateIncomeAmount = async (amount, incomeId) =>
+export const updateIncomeAmount = async (amount: string, incomeId: number) =>
   await PUT(`/income/admin/${incomeId}?amount=${amount}`, {}, true);
 
-export const updateCommissionPercent = async (partyCommissionPercent) =>
+export const updateCommissionPercent = async (partyCommissionPercent: number) =>
   await PUT(
     `/income/admin/commission-rate?partyCommissionPercent=${partyCommissionPercent}&penaltyCommissionPercent=10`,
     {},
     true
   );
 
-export const deleteIncome = async (incomeId) =>
+export const deleteIncome = async (incomeId: number) =>
   await DELETE(`/income/admin/${incomeId}`, true);
 
-export const getChatDetail = async (chatRoomId) =>
+export const getChatDetail = async (chatRoomId: number) =>
   await GET(`/chat/messages/${chatRoomId}`, true);
 
-export const driverPenaltyComplete = async (partyId) =>
+export const driverPenaltyComplete = async (partyId: number) =>
   await PUT(`/admin/payment/driver-penalty/complete/${partyId}`, {}, true);
 
-export const driverPenaltyBefore = async (partyId) =>
+export const driverPenaltyBefore = async (partyId: number) =>
   await PUT(
     `/admin/payment/driver-penalty/before-payment/${partyId}`,
     {},
     true
   );
 
-export const getDriverInfoDetail = async (driverId) =>
+export const getDriverInfoDetail = async (driverId: string) =>
   await GET(`/admin/driver/my/${driverId}`, true);
 
-export const putDriverInfoDetail = async (driverId, body) =>
+export const putDriverInfoDetail = async (driverId: string, body: any) =>
   await PUT(`/admin/driver/my/${driverId}`, body, true);
 
-export const getDriverCourseDetail = async (driverId, courseId) =>
-  await GET(`/admin/driver/course/${driverId}?courseId=${courseId}`, true);
+export const getDriverCourseDetail = async (
+  driverId: string,
+  courseId: string
+) => await GET(`/admin/driver/course/${driverId}?courseId=${courseId}`, true);
 
-export const postDriverNewCourse = async (driverId, body) =>
+export const postDriverNewCourse = async (driverId: string, body: any) =>
   await POST(`/admin/driver/course/${driverId}`, body, true);
 
-export const putDriverCourseDetail = async (driverId, courseId, body) =>
+export const putDriverCourseDetail = async (
+  driverId: string,
+  courseId: string,
+  body: any
+) =>
   await PUT(
     `/admin/driver/course/${driverId}?courseId=${courseId}`,
     body,
     true
   );
 
-export const deleteDriverCourse = async (driverId, courseId) =>
+export const deleteDriverCourse = async (driverId: string, courseId: string) =>
   await DELETE(`/admin/driver/course/${driverId}?courseId=${courseId}`, true);
 
-export const postApplyDriver = async (userId, region) =>
+export const postApplyDriver = async (userId: number, region: string[]) =>
   await POST(`/admin/driver/apply/${userId}?region=${region}`, {}, true);

src/api/announcement.js → src/api/announcement.ts

@@ -1,16 +1,16 @@
 import { GET, PUT, POST, DELETE } from "../utils/axios";
 
-export const getAnnouncementList = async (type, page) =>
+export const getAnnouncementList = async (type: string, page: number) =>
   await GET(`/announcement?type=${type}&page=${page}&size=10`, true);
 
-export const getAnnouncementDetail = async (announcementId) =>
+export const getAnnouncementDetail = async (announcementId: string) =>
   await GET(`/announcement/${announcementId}`, true);
 
-export const postAnnouncement = async (body) =>
+export const postAnnouncement = async (body: any) =>
   await POST("/announcement", body, true);
 
-export const updateAnnouncement = async (announcementId, body) =>
+export const updateAnnouncement = async (announcementId: string, body: any) =>
   await PUT(`/announcement/${announcementId}`, body, true);
 
-export const deleteAnnouncement = async (announcementId) =>
+export const deleteAnnouncement = async (announcementId: string) =>
   await DELETE(`/announcement/${announcementId}`, true);

src/components/ProfileModal/ButtonBox/AdminButtonList/SuspensionModal/index.tsx

@@ -35,6 +35,7 @@ function SuspensionModal({
   const closeModal = useCallback(() => setShowModal(false), []);
 
   const postSuspensionFunc = useCallback(async () => {
+    if (!userId) return;
     if (!durationInput) return alert("제재 일 수를 입력해주세요.");
     if (!content) return alert("제재 사유를 입력해주세요.");
 

src/pages/AdminPage/CustomerService/Help/EditForm/index.tsx

@@ -38,7 +38,11 @@ function EditForm({
 }: Props) {
   const navigation = useNavigate();
   const textareaRef = useRef<HTMLTextAreaElement | null>(null);
-  const [images, setImages] = useState([undefined, undefined, undefined]);
+  const [images, setImages] = useState<(string | File | undefined)[]>([
+    undefined,
+    undefined,
+    undefined,
+  ]);
   const [title, setTitle] = useState("");
   const [content, setContent] = useState("");
   const [loading, setLoading] = useState(false);
@@ -47,6 +51,7 @@ function EditForm({
     async (event: FormEvent<HTMLFormElement>) => {
       event.preventDefault();
       if (loading) return;
+      if (!announcementId) return;
 
       try {
         setLoading(true);
@@ -100,6 +105,7 @@ function EditForm({
   );
 
   const getAnnouncementDetailFunc = useCallback(async () => {
+    if (!announcementId) return;
     try {
       const { payload } = await getAnnouncementDetail(announcementId);
       setImages(payload.images);

src/pages/AdminPage/CustomerService/Help/NoticeDetail/NoticeButton/index.tsx

@@ -20,8 +20,9 @@ function NoticeButton({
   const navigation = useNavigate();
 
   const deleteAnnouncementFunc = useCallback(async () => {
+    if (!announcementId) return;
     try {
-      await deleteAnnouncement(announcementId);
+      await deleteAnnouncement(announcementId.toString());
       setMessage("공지사항이 삭제되었습니다.");
       navigation(-1);
     } catch (e) {

src/pages/AdminPage/CustomerService/Help/NoticeDetail/index.tsx

@@ -38,8 +38,9 @@ function NoticeDetail({
   });
 
   const getAnnouncementDetailFunc = useCallback(async () => {
+    if (!announcementId) return;
     try {
-      const result = await getAnnouncementDetail(announcementId);
+      const result = await getAnnouncementDetail(announcementId.toString());
       setNotice(result.payload);
       if (result.statusCode === 404) {
         alert("이미 삭제된 공지사항 입니다.");

src/pages/AdminPage/CustomerService/Report/ReportContent/index.tsx

@@ -56,6 +56,7 @@ function ReportContent({ setCurrent }: Props) {
   });
 
   const getReportDetailFunc = useCallback(async () => {
+    if (!reportId) return;
     try {
       const result =
         status === "WAITING"
@@ -76,6 +77,7 @@ function ReportContent({ setCurrent }: Props) {
   }, [status, reportId]);
 
   const updateReportCompleteFunc = useCallback(async () => {
+    if (!reportId) return;
     try {
       await updateReportComplete(reportId);
       setCurrent(1);

src/pages/AdminPage/Management/Party/PartyDetail/MallangReady/index.tsx

@@ -22,6 +22,7 @@ function MallangReady({
   const [ready, setReady] = useState(false);
 
   const readyClickHandler = useCallback(async () => {
+    if (!partyId) return;
     try {
       await getPartyDriverReady(partyId, !ready);
       setReady(!ready);

src/pages/AdminPage/Management/Party/PartyDetail/index.tsx

@@ -25,6 +25,7 @@ function PartyDetail({ partyId }: Props) {
   const [partyData, setPartyData] = useState<Party>();
 
   const getPartyDetailFunc = useCallback(async () => {
+    if (!partyId) return;
     try {
       const result = await getPartyDetail(partyId);
       setPartyData(result.payload);

src/pages/AdminPage/Payment/MallangTalkModal/index.tsx

@@ -34,6 +34,7 @@ function MallangTalkModal({ showModal, setShowModal, mallangTalkInfo }: Props) {
   const [showProfileModal, setShowProfileModal] = useState(false);
 
   const getChatDetailFunc = useCallback(async () => {
+    if (!roomId) return;
     try {
       const result = await getChatDetail(roomId);
       setMessages(result.payload);

src/pages/AdminPage/User/DriverInfo/DriverCourse/DeleteButton/index.tsx

@@ -11,6 +11,7 @@ function DeleteButton() {
   const courseId = searchParams.get("courseId");
 
   const deleteHandler = useCallback(async () => {
+    if (!driverId || !courseId) return;
     try {
       await deleteDriverCourse(driverId, courseId);
       alert("파티 코스가 삭제되었습니다.");

src/pages/AdminPage/User/DriverInfo/DriverCourse/index.tsx

@@ -28,7 +28,7 @@ interface Destination {
   lat: number;
   lon: number;
   name: string;
-  image: string | File;
+  image?: string | File;
 }
 
 function DriverCourse() {
@@ -53,6 +53,8 @@ function DriverCourse() {
   const courseId = searchParams.get("courseId");
 
   const saveCourse = useCallback(async () => {
+    if (!driverId || !courseId) return;
+
     const destinationImages = destinations.reduce(
       (acc: (string | File)[], cur: Destination) => {
         if (typeof cur.image === "string") {
@@ -151,6 +153,7 @@ function DriverCourse() {
   ]);
 
   const getDriverCourseInfo = useCallback(async () => {
+    if (!driverId || !courseId) return;
     try {
       const driverResult = await getDriverInfoDetail(driverId);
       setCapacity(driverResult.payload.vehicleCapacity);
@@ -218,7 +221,7 @@ function DriverCourse() {
   return (
     <div className="text-base text-black font-medium">
       <PageContainer>
-        <Title courseId={courseId} />
+        <Title courseId={courseId || "0"} />
         <CourseImage images={images} setImages={setImages} />
         <CourseInfo title="여행 기간" content="1일" />
         <CourseInfo title="최대 정원" content={`${capacity}명`} />
@@ -260,7 +263,7 @@ function DriverCourse() {
           setRegion={setRegion}
         />
         <SaveButton
-          courseId={courseId}
+          courseId={courseId || "0"}
           saveHandler={() => setShowCheckModal(true)}
         />
         <DeleteButton />

src/pages/AdminPage/User/DriverInfo/DriverDetail/index.tsx

@@ -87,6 +87,7 @@ function DriverDetail() {
   );
 
   const modifyProfileHandler = useCallback(async () => {
+    if (!driverId) return;
     if (!modifyMode) return setModifyMode(true);
 
     const profileImageURL = newProfileImage
@@ -134,6 +135,7 @@ function DriverDetail() {
   }, [modifyMode, newProfileImage, driverInfo, newVehicleImages, driverId]);
 
   const getDriverInfoDetailFunc = useCallback(async () => {
+    if (!driverId) return;
     try {
       const result = await getDriverInfoDetail(driverId);
       setDriverInfo(result.payload);
@@ -146,6 +148,8 @@ function DriverDetail() {
   }, [driverId]);
 
   const autoSaveHandler = useCallback(async () => {
+    if (!driverId) return;
+
     const profileImageURL = newProfileImage
       ? await uploadImage(newProfileImage)
       : driverInfo.profileImg;

src/pages/DriverCoursePage/CourseDnD/index.tsx

@@ -6,12 +6,16 @@ import deleteIcon from "../../../assets/svg/x-modal-icon.svg";
 import TimeModal from "./TimeModal";
 import clsx from "clsx";
 
+interface DestinationImage extends Destination {
+  image?: string | File;
+}
+
 interface Props {
   name: string;
   setName: Dispatch<SetStateAction<string>>;
   hours: number;
-  destinations: Destination[];
-  setDestinations: Dispatch<SetStateAction<Destination[]>>;
+  destinations: DestinationImage[];
+  setDestinations: Dispatch<SetStateAction<DestinationImage[]>>;
   startTime: string;
   endTime: string;
   setStartTime: Dispatch<SetStateAction<string>>;

src/pages/HelpPage/ArticleItem/index.tsx

@@ -17,6 +17,7 @@ function ArticleItem() {
   });
 
   const getAnnouncementDetailFunc = useCallback(async () => {
+    if (!id) return;
     try {
       const result = await getAnnouncementDetail(id);
       setNotice(result.payload);