api refactoring

interface/src/components/layout/Layout.tsx

@@ -4,8 +4,7 @@ import { useLocation } from 'react-router-dom';
 
 import { Box, Toolbar } from '@mui/material';
 
-import { PROJECT_NAME } from 'api/env';
-
+import { PROJECT_NAME } from 'env';
 import type { RequiredChildrenProps } from 'utils';
 
 import LayoutAppBar from './LayoutAppBar';

interface/src/components/layout/LayoutDrawer.tsx

@@ -1,6 +1,6 @@
 import { Box, Divider, Drawer, Toolbar, Typography, styled } from '@mui/material';
 
-import { PROJECT_NAME } from 'api/env';
+import { PROJECT_NAME } from 'env';
 
 import { DRAWER_WIDTH } from './Layout';
 import LayoutMenu from './LayoutMenu';

interface/src/components/routing/RequireAuthenticated.tsx

@@ -2,8 +2,7 @@ import { useContext, useEffect } from 'react';
 import type { FC } from 'react';
 import { Navigate, useLocation } from 'react-router-dom';
 
-import { storeLoginRedirect } from 'api/authentication';
-
+import { storeLoginRedirect } from 'components/routing/authentication';
 import type { AuthenticatedContextValue } from 'contexts/authentication/context';
 import {
   AuthenticatedContext,

interface/src/components/routing/RequireUnauthenticated.tsx

@@ -2,8 +2,7 @@ import { useContext } from 'react';
 import type { FC } from 'react';
 import { Navigate } from 'react-router-dom';
 
-import * as AuthenticationApi from 'api/authentication';
-
+import { fetchLoginRedirect } from 'components/routing/authentication';
 import { AuthenticationContext } from 'contexts/authentication';
 import type { RequiredChildrenProps } from 'utils';
 
@@ -11,7 +10,7 @@ const RequireUnauthenticated: FC<RequiredChildrenProps> = ({ children }) => {
   const authenticationContext = useContext(AuthenticationContext);
 
   return authenticationContext.me ? (
-    <Navigate to={AuthenticationApi.fetchLoginRedirect()} />
+    <Navigate to={fetchLoginRedirect()} />
   ) : (
     <>{children}</>
   );

interface/src/components/routing/authentication.ts

@@ -0,0 +1,54 @@
+import type { Path } from 'react-router-dom';
+
+import type * as H from 'history';
+import { jwtDecode } from 'jwt-decode';
+import type { Me, SignInRequest, SignInResponse } from 'types';
+
+import { ACCESS_TOKEN, alovaInstance } from '../../api/endpoints';
+
+export const SIGN_IN_PATHNAME = 'loginPathname';
+export const SIGN_IN_SEARCH = 'loginSearch';
+
+export const verifyAuthorization = () =>
+  alovaInstance.Get('/rest/verifyAuthorization');
+export const signIn = (request: SignInRequest) =>
+  alovaInstance.Post<SignInResponse>('/rest/signIn', request);
+
+export function getStorage() {
+  return localStorage || sessionStorage;
+}
+
+export function storeLoginRedirect(location?: H.Location) {
+  if (location) {
+    getStorage().setItem(SIGN_IN_PATHNAME, location.pathname);
+    getStorage().setItem(SIGN_IN_SEARCH, location.search);
+  }
+}
+
+export function clearLoginRedirect() {
+  getStorage().removeItem(SIGN_IN_PATHNAME);
+  getStorage().removeItem(SIGN_IN_SEARCH);
+}
+
+export function fetchLoginRedirect(): Partial<Path> {
+  const signInPathname = getStorage().getItem(SIGN_IN_PATHNAME);
+  const signInSearch = getStorage().getItem(SIGN_IN_SEARCH);
+  clearLoginRedirect();
+  return {
+    pathname: signInPathname || `/devices`,
+    search: (signInPathname && signInSearch) || undefined
+  };
+}
+
+export const clearAccessToken = () => localStorage.removeItem(ACCESS_TOKEN);
+export const decodeMeJWT = (accessToken: string): Me => jwtDecode(accessToken);
+
+export function addAccessTokenParameter(url: string) {
+  const accessToken = getStorage().getItem(ACCESS_TOKEN);
+  if (!accessToken) {
+    return url;
+  }
+  const parsedUrl = new URL(url);
+  parsedUrl.searchParams.set(ACCESS_TOKEN, accessToken);
+  return parsedUrl.toString();
+}