refactor: move login from function to middleware

app/api/config.ts

@@ -13,6 +13,7 @@ export const ENDPOINTS = {
     licensed: `${API_PREFIX}/release/streaming/platform`,
   },
   user: {
+    auth: `${API_PREFIX}/auth/signIn`,
     profile: `${API_PREFIX}/profile`,
     bookmark: `${API_PREFIX}/profile/list`,
     history: `${API_PREFIX}/history`,

app/api/profile/login/route.ts

@@ -1,14 +0,0 @@
-import { NextResponse, NextRequest } from "next/server";
-import { authorize } from "#/api/utils";
-import { API_URL } from "#/api/config";
-
-export async function POST(request: NextRequest) {
-  const response = await authorize(`${API_URL}/auth/signIn`, await request.json());
-  if (!response) {
-    return NextResponse.json({ message: "Server Error" }, { status: 500 });
-  }
-  if (!response.profile) {
-    return NextResponse.json({ message: "Profile not found" }, { status: 404 });
-  }
-  return NextResponse.json(response);
-}

app/api/utils.ts

@@ -4,7 +4,6 @@ export const HEADERS = {
   "Content-Type": "application/json; charset=UTF-8",
 };
 
-// Types for the result object with discriminated union
 type Success<T> = {
   data: T;
   error: null;
@@ -17,7 +16,6 @@ type Failure<E> = {
 
 type Result<T, E = Error> = Success<T> | Failure<E>;
 
-// Main wrapper function
 export async function tryCatch<T, E = Error>(
   promise: Promise<T>
 ): Promise<Result<T, E>> {
@@ -84,7 +82,8 @@ export const useSWRfetcher = async (url: string) => {
 
 export const fetchDataViaGet = async (
   url: string,
-  API_V2: string | boolean = false
+  API_V2: string | boolean = false,
+  addHeaders?: Record<string, any>
 ) => {
   if (API_V2) {
     HEADERS["API-Version"] = "v2";
@@ -92,7 +91,7 @@ export const fetchDataViaGet = async (
 
   const { data, error } = await tryCatchAPI(
     fetch(url, {
-      headers: HEADERS,
+      headers: { ...HEADERS, ...addHeaders },
     })
   );
 
@@ -103,54 +102,21 @@ export const fetchDataViaPost = async (
   url: string,
   body: string,
   API_V2: string | boolean = false,
-  contentType: string = ""
+  addHeaders?: Record<string, any>
 ) => {
   if (API_V2) {
     HEADERS["API-Version"] = "v2";
   }
-  if (contentType != "") {
-    HEADERS["Content-Type"] = contentType;
-  }
 
-  try {
-    const response = await fetch(url, {
+  const { data, error } = await tryCatchAPI(
+    fetch(url, {
       method: "POST",
-      headers: HEADERS,
       body: body,
-    });
-    if (response.status !== 200) {
-      return null;
-    }
-    const data = await response.json();
-    return data;
-  } catch (error) {
-    console.log(error);
-  }
-};
-
-export const authorize = async (
-  url: string,
-  data: { login: string; password: string }
-) => {
-  try {
-    const response = await fetch(
-      `${url}?login=${data.login}&password=${data.password}`,
-      {
-        method: "POST",
-        headers: {
-          "User-Agent": USER_AGENT,
-          Sign: "9aa5c7af74e8cd70c86f7f9587bde23d",
-          "Content-Type": "application/x-www-form-urlencoded",
-        },
-      }
+      headers: { ...HEADERS, ...addHeaders },
+    })
   );
-    if (response.status !== 200) {
-      throw new Error("Error authorizing user");
-    }
-    return await response.json();
-  } catch (error) {
-    return error;
-  }
+
+  return { data, error };
 };
 
 export function setJWT(user_id: number | string, jwt: string) {

app/pages/Login.tsx

@@ -1,8 +1,11 @@
 "use client";
 import { useState, useEffect } from "react";
 import { useUserStore } from "#/store/auth";
-import { setJWT } from "#/api/utils";
+import { setJWT, tryCatchAPI } from "#/api/utils";
 import { useRouter, useSearchParams } from "next/navigation";
+import { useThemeMode } from "flowbite-react";
+import { toast } from "react-toastify";
+import { ENDPOINTS } from "#/api/config";
 
 export function LoginPage() {
   const [login, setLogin] = useState("");
@@ -12,36 +15,77 @@ export function LoginPage() {
   const router = useRouter();
   const searchParams = useSearchParams();
   const redirect = searchParams.get("redirect") || null;
+  const theme = useThemeMode();
+  const [isSending, setIsSending] = useState(false);
 
-  function submit(e) {
+  async function submit(e) {
     e.preventDefault();
-    fetch("/api/profile/login", {
+    setIsSending(true);
+
+    const tid = toast.loading("Выполняем вход...", {
+      position: "bottom-center",
+      hideProgressBar: true,
+      closeOnClick: false,
+      pauseOnHover: false,
+      draggable: false,
+      theme: theme.mode == "light" ? "light" : "dark",
+    });
+
+    const { data, error } = await tryCatchAPI(
+      fetch(`${ENDPOINTS.user.auth}?login=${login}&password=${password}`, {
         method: "POST",
         headers: {
-        "Content-Type": "application/json",
+          Sign: "9aa5c7af74e8cd70c86f7f9587bde23d",
+          "Content-Type": "application/x-www-form-urlencoded",
         },
-      body: JSON.stringify({
-        login: login,
-        password: password,
-      }),
       })
-      .then((response) => {
-        if (response.ok) {
-          return response.json();
-        } else {
-          alert("Ошибка получения пользователя.");
+    );
+
+    if (error) {
+      let message = `Ошибка получения пользователя, code: ${error.code}`
+      if (error.code == 2) {
+        message = "Такого пользователя не существует"
       }
-      })
-      .then((data) => {
-        if (data.profileToken) {
+      if (error.code == 3) {
+        message = "Неправильно указан логин и/или пароль"
+      }
+      toast.update(tid, {
+        render: message,
+        type: "error",
+        autoClose: 2500,
+        isLoading: false,
+        closeOnClick: true,
+        draggable: true,
+      });
+      setIsSending(false);
+      return;
+    }
+
+    if (!data.profileToken) {
+      toast.update(tid, {
+        render: "Не удалось войти в аккаунт",
+        type: "error",
+        autoClose: 2500,
+        isLoading: false,
+        closeOnClick: true,
+        draggable: true,
+      });
+      setIsSending(false);
+      return;
+    }
+
     userStore.login(data.profile, data.profileToken.token);
     if (remember) {
       setJWT(data.profile.id, data.profileToken.token);
     }
-          router.push("/");
-        } else {
-          alert("Неверные данные.");
-        }
+
+    toast.update(tid, {
+      render: "Вход успешен!",
+      type: "success",
+      autoClose: 2500,
+      isLoading: false,
+      closeOnClick: true,
+      draggable: true,
     });
   }
 
@@ -53,7 +97,7 @@ export function LoginPage() {
   }, [userStore.user]);
 
   return (
-    <section className="bg-gray-50 dark:bg-gray-900">
+    <section>
       <div className="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
         <div className="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
           <div className="p-6 space-y-4 md:space-y-6 sm:p-8">

middleware.ts

@@ -49,26 +49,33 @@ export default async function middleware(
     const path = url.pathname.match(/\/api\/proxy\/(.*)/)?.[1] + url.search;
 
     const ReqContentTypeHeader = request.headers.get("Content-Type") || "";
+    const ReqSignHeader = request.headers.get("Sign") || null;
     let ResContentTypeHeader = "";
     let body = null;
 
     if (ReqContentTypeHeader.split(";")[0] == "multipart/form-data") {
       ResContentTypeHeader = ReqContentTypeHeader;
       body = await request.arrayBuffer();
+    } else if (ReqContentTypeHeader == "application/x-www-form-urlencoded") {
+      ResContentTypeHeader = ReqContentTypeHeader;
     } else {
       ResContentTypeHeader = "application/json; charset=UTF-8";
       body = JSON.stringify(await request.json());
     }
 
-    const data = await fetchDataViaPost(
+    let resHeaders = {};
+    resHeaders["Content-Type"] = ResContentTypeHeader;
+    ReqSignHeader && (resHeaders["Sign"] = ReqSignHeader);
+
+    const { data, error } = await fetchDataViaPost(
       `${API_URL}/${path}`,
       body,
       isApiV2,
-      ResContentTypeHeader
+      resHeaders
     );
 
-    if (!data) {
-      return new Response(JSON.stringify({ message: "Error Fetching Data" }), {
+    if (error) {
+      return new Response(JSON.stringify(error), {
         status: 500,
         headers: {
           "Content-Type": "application/json",