[FEAT] 관리자가 아닐때 어드민 페이지 로그인 시도시 alert 창 띄우기

- 기존에 AxiosResponse로 감싸서 반환할시에, 받아온 data의 message를 읽어올 수 없었습니다.
- 따라서 response.dto라는 반환용 dto를 만들어서, 받아온 data를 감싸 반환하도록 수정하였습니다.

src/components/MagainzeList.tsx

@@ -16,7 +16,7 @@ const MagazineList = () => {
   const magazineList = useRecoilValue(magazineListState);
 
   useEffect(() => {
-    if (magazineListResult) {
+    if (magazineListResult?.data) {
       setMagazineList(magazineListResult.data);
     }
   }, [magazineListResult]);

src/lib/api/dto/response.dto.ts

@@ -0,0 +1,14 @@
+/**
+ * 반환용 DTO
+ */
+export class ResponseDto<T> {
+  message?: string;
+  success?: boolean;
+  data?: T;
+
+  constructor(data?: any) {
+    if (data.data) this.data = data.data;
+    if (data.message) this.message = data.message;
+    if (data.success) this.success = data.success;
+  }
+}

src/lib/hooks/useGetMagazineList.tsx

@@ -1,14 +1,30 @@
-import { AxiosResponse } from 'axios';
+import type { AxiosResponse } from 'axios';
 import useSWR from 'swr';
 
 import { gamGetFetcher } from '../axios';
 import { magazineListData } from '../../types/magazine';
+import { useEffect } from 'react';
+import { clearUserSession } from '../token';
+import { useNavigate } from 'react-router-dom';
+import { ResponseDto } from '../api/dto/response.dto';
 
 const useGetMagazineList = () => {
-  const { data, error } = useSWR<AxiosResponse<magazineListData[]>>(`/api/v1/admin/magazine/list`, gamGetFetcher, {
+  const navigate = useNavigate();
+  const { data, error } = useSWR<ResponseDto<magazineListData[]>>(`/api/v1/admin/magazine/list`, gamGetFetcher, {
     errorRetryCount: 3,
   });
 
+  /**
+   * 관리자 권한이 없으면 alert창 띄우고 로그인 화면으로 돌아감
+   */
+  useEffect(() => {
+    if (data?.message === '관리자 권한이 없습니다.') {
+      window.alert(data.message);
+      clearUserSession();
+      navigate('/');
+    }
+  }, [data, error]);
+
   return {
     magazineListResult: data,
     isLoading: !data && !error,