From 66ae32925897d9290b7bef520b9a1aea6d488c78 Mon Sep 17 00:00:00 2001
From: JRJR519 <102293576+Jeong-Rae@users.noreply.github.com>
Date: Sun, 5 May 2024 02:34:29 +0900
Subject: [PATCH] Feat/admin (#139)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: textarea 추가

Signed-off-by: Jeong-Rae <kkwjdfo@gmail.com>

* feat: stage, question 컨테이너 추가 삭제 구현

Signed-off-by: Jeong-Rae <kkwjdfo@gmail.com>

* feat: 미들웨어 코드 수정

Signed-off-by: Jeong-Rae <kkwjdfo@gmail.com>

* feat: 관리자 페이지 방어기능 추가

Signed-off-by: Jeong-Rae <kkwjdfo@gmail.com>

---------

Signed-off-by: Jeong-Rae <kkwjdfo@gmail.com>
---
 src/components/uploadStage/Button.tsx      |   2 +-
 src/components/uploadStage/Textarea.tsx    |   2 +-
 src/middleware.ts                          | 112 ++++++++++++++-------
 src/types/basicResponseDto.ts              |   5 +
 src/utils/protection/protectAdminAccess.ts |  23 +++++
 5 files changed, 106 insertions(+), 38 deletions(-)
 create mode 100644 src/types/basicResponseDto.ts
 create mode 100644 src/utils/protection/protectAdminAccess.ts

diff --git a/src/components/uploadStage/Button.tsx b/src/components/uploadStage/Button.tsx
index cb7e427..0e55257 100644
--- a/src/components/uploadStage/Button.tsx
+++ b/src/components/uploadStage/Button.tsx
@@ -22,7 +22,7 @@ const Button: React.FC<ButtonProps> = ({id, labelText, onClick, className = "",
             <button
                 id={id}
                 onClick={onClick}
-                className={`block min-h-4 p-2 text-sm font-medium text-white bg-blue-500 rounded-lg border border-blue-500 hover:bg-blue-600 focus:outline-2 focus:outline-blue-600 ${className}`}
+                className={`block w-full min-h-4 p-2 text-sm text-white bg-blue-500 rounded-lg border border-blue-500 hover:bg-blue-600 focus:outline-2 focus:outline-blue-600 ${className}`}
                 disabled={disabled}
             >
                 {labelText}
diff --git a/src/components/uploadStage/Textarea.tsx b/src/components/uploadStage/Textarea.tsx
index 64d7f3e..114ed24 100644
--- a/src/components/uploadStage/Textarea.tsx
+++ b/src/components/uploadStage/Textarea.tsx
@@ -19,7 +19,7 @@ const Textarea: React.FC<TextAreaProps> = ({labelText, message, onChange, placeh
 }) => {
     return (
         <div className="w-4/5 m-4 space-y-2 flex flex-1 flex-col">
-            <label htmlFor="message" className="block ml-1 text-sm font-medium text-gray-900">
+            <label htmlFor="message" className="block ml-1 text-sm font-bold text-gray-900">
                 {labelText}
             </label>
             <textarea
diff --git a/src/middleware.ts b/src/middleware.ts
index 48f3d09..fea0ae1 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -4,9 +4,13 @@ import {
 } from "next/dist/compiled/@edge-runtime/cookies";
 import { NextResponse } from 'next/server'
 import type { NextRequest } from 'next/server'
+import {notFound} from "next/navigation";
+
+import {isAdmin} from "@/utils/protection/protectAdminAccess";
 
 const url = process.env.NEXT_PUBLIC_BASE_API;
-const protectedPaths = ["/problem", "/challengelist"];
+const playerAccessiblePaths = ["/problem", "/challengelist"];
+const adminAccessiblePaths = ["/admin"];
 
 const ReAccessToken = async (refreshToken: string) => {
   try {
@@ -28,41 +32,24 @@ const ReAccessToken = async (refreshToken: string) => {
   }
 }
 
-
-export async function middleware(request: NextRequest) {
-  const { nextUrl, cookies } = request;
-  const { pathname, host } = nextUrl;
-  const accessToken = cookies.get("POL_ACCESS_TOKEN");
-  const refreshToken = cookies.get("POL_REFRESH_TOKEN");
-  if (accessToken === undefined && refreshToken !== undefined) {
-    if (!accessToken) {
-      const token = await ReAccessToken(refreshToken.value)
-      if (token) {
-        const now = new Date();
-        const time = now.getTime();
-        const response = NextResponse.redirect(request.url);
-        response.cookies.set({
-          name: "POL_ACCESS_TOKEN",
-          value: token,
-          domain: "",
-          expires: time + 1000 * 60 * 60
-        });
-        applySetCookie(request, response);
-        return response;
-      }
-    }
-  }
-  if (protectedPaths.some(path => pathname.startsWith(path)) && accessToken === undefined) {
-    const loginUrl = new URL('/login', request.url);
-    loginUrl.searchParams.set('redirect', pathname);
-    return NextResponse.redirect(loginUrl);
+async function refreshAccessToken(request: NextRequest, refreshToken: string): Promise<NextResponse | null> {
+  const token = await ReAccessToken(refreshToken);
+  if (token) {
+    const now = new Date();
+    const time = now.getTime();
+    const response = NextResponse.redirect(request.url);
+    response.cookies.set({
+      name: "POL_ACCESS_TOKEN",
+      value: token,
+      domain: "",
+      expires: time + 1000 * 60 * 60
+    });
+    applySetCookie(request, response);
+    return response;
   }
+  return null;
 }
 
-export const config = {
-  matcher: '/:path*',
-};
-
 function applySetCookie(req: NextRequest, res: NextResponse): void {
   const resCookies = new ResponseCookies(res.headers);
   const newReqHeaders = new Headers(req.headers);
@@ -74,10 +61,63 @@ function applySetCookie(req: NextRequest, res: NextResponse): void {
     request: { headers: newReqHeaders },
   }).headers.forEach((value, key) => {
     if (
-      key === "x-middleware-override-headers" ||
-      key.startsWith("x-middleware-request-")
+        key === "x-middleware-override-headers" ||
+        key.startsWith("x-middleware-request-")
     ) {
       res.headers.set(key, value);
     }
   });
-}
\ No newline at end of file
+}
+
+const isPlayerAccessiblePath = (pathname: string): boolean => {
+  return playerAccessiblePaths.some(path => pathname.startsWith(path));
+}
+
+const redirectToLogin = (request: NextRequest, pathname: string): NextResponse => {
+  const loginUrl = new URL('/login', request.url);
+  loginUrl.searchParams.set('redirect', pathname);
+  return NextResponse.redirect(loginUrl);
+}
+
+const isAdminAccessiblePath = (pathname: string): boolean => {
+  return adminAccessiblePaths.some(path => pathname.startsWith(path));
+}
+
+const redirectToNotFound = (request: NextRequest): NextResponse => {
+  const url = new URL('/not-found', request.url);
+  return NextResponse.rewrite(url);
+}
+
+export async function middleware(request: NextRequest) {
+  const { nextUrl, cookies } = request;
+  const { pathname, host } = nextUrl;
+  const accessToken = cookies.get("POL_ACCESS_TOKEN");
+  const refreshToken = cookies.get("POL_REFRESH_TOKEN");
+
+  if (!accessToken && refreshToken) {
+    const response = await refreshAccessToken(request, refreshToken.value);
+    if (response) {
+      return response;
+    }
+  }
+
+  if (isPlayerAccessiblePath(pathname) && !accessToken) {
+    return redirectToLogin(request, pathname);
+  }
+
+  if (isAdminAccessiblePath(pathname)) {
+    if (!accessToken) {
+      return redirectToLogin(request, pathname);
+    }
+    const isAdminPlayer = await isAdmin(accessToken.value);
+    if (!isAdminPlayer) {
+      return redirectToNotFound(request);
+    }
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: '/:path*',
+};
\ No newline at end of file
diff --git a/src/types/basicResponseDto.ts b/src/types/basicResponseDto.ts
new file mode 100644
index 0000000..e632bf0
--- /dev/null
+++ b/src/types/basicResponseDto.ts
@@ -0,0 +1,5 @@
+export interface BasicResponseDto {
+    "response": string
+    "error": string,
+    "detail": string
+}
\ No newline at end of file
diff --git a/src/utils/protection/protectAdminAccess.ts b/src/utils/protection/protectAdminAccess.ts
new file mode 100644
index 0000000..382ac27
--- /dev/null
+++ b/src/utils/protection/protectAdminAccess.ts
@@ -0,0 +1,23 @@
+import {BasicResponseDto} from "@/types/basicResponseDto";
+
+const url = process.env.NEXT_PUBLIC_BASE_API;
+export const isAdmin = async (accessToken: string) => {
+    try {
+        const response = await fetch(`${url}/api/players/me/admin`, {
+            credentials: "include",
+            headers: {
+                Authorization: `Bearer ${accessToken}`,
+            },
+        });
+
+        if (!response.ok) {
+            return false;
+        }
+
+        const body: BasicResponseDto = await response.json();
+
+        return body.response === "true";
+    } catch (error) {
+        console.log(error);
+    }
+}