Implement URL redirect for PUI (#6872)

* Implement URL redirect for PUI

- Return from login page to redirect URL
- Return from auth check to redirect URL

* fix PUI test assumption

---------

Co-authored-by: Matthias Mair <code@mjmair.com>

src/frontend/src/components/forms/AuthenticationForm.tsx

@@ -15,7 +15,7 @@ import { useDisclosure } from '@mantine/hooks';
 import { notifications } from '@mantine/notifications';
 import { IconCheck } from '@tabler/icons-react';
 import { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
 
 import { api } from '../../App';
 import { ApiEndpoints } from '../../enums/ApiEndpoints';
@@ -32,6 +32,7 @@ export function AuthenticationForm() {
   const [classicLoginMode, setMode] = useDisclosure(true);
   const [auth_settings] = useServerApiState((state) => [state.auth_settings]);
   const navigate = useNavigate();
+  const location = useLocation();
 
   const [isLoggingIn, setIsLoggingIn] = useState<boolean>(false);
 
@@ -52,7 +53,7 @@ export function AuthenticationForm() {
             color: 'green',
             icon: <IconCheck size="1rem" />
           });
-          navigate('/home');
+          navigate(location?.state?.redirectFrom ?? '/home');
         } else {
           notifications.show({
             title: t`Login failed`,

src/frontend/src/components/nav/Layout.tsx

@@ -1,5 +1,5 @@
 import { Container, Flex, Space } from '@mantine/core';
-import { Navigate, Outlet } from 'react-router-dom';
+import { Navigate, Outlet, useLocation, useNavigate } from 'react-router-dom';
 
 import { InvenTreeStyle } from '../../globalStyle';
 import { useSessionState } from '../../states/SessionState';
@@ -9,8 +9,12 @@ import { Header } from './Header';
 export const ProtectedRoute = ({ children }: { children: JSX.Element }) => {
   const [token] = useSessionState((state) => [state.token]);
 
+  const location = useLocation();
+
   if (!token) {
-    return <Navigate to="/logged-in" replace />;
+    return (
+      <Navigate to="/logged-in" state={{ redirectFrom: location.pathname }} />
+    );
   }
 
   return children;

src/frontend/src/functions/auth.tsx

@@ -150,7 +150,9 @@ export function checkLoginState(
   // Callback function when login fails
   const loginFailure = () => {
     useSessionState.getState().clearToken();
-    if (!no_redirect) navigate('/login');
+    if (!no_redirect) {
+      navigate('/login', { state: { redirectFrom: redirect } });
+    }
   };
 
   if (useSessionState.getState().hasToken()) {

src/frontend/src/pages/Auth/Logged-In.tsx

@@ -1,15 +1,16 @@
 import { Trans } from '@lingui/macro';
 import { Card, Container, Group, Loader, Stack, Text } from '@mantine/core';
 import { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
 
 import { checkLoginState } from '../../functions/auth';
 
 export default function Logged_In() {
   const navigate = useNavigate();
+  const location = useLocation();
 
   useEffect(() => {
-    checkLoginState(navigate);
+    checkLoginState(navigate, location?.state?.redirectFrom);
   }, []);
 
   return (

src/frontend/src/pages/Auth/Login.tsx

@@ -2,7 +2,7 @@ import { Trans, t } from '@lingui/macro';
 import { Center, Container, Paper, Text } from '@mantine/core';
 import { useDisclosure, useToggle } from '@mantine/hooks';
 import { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
 
 import { setApiDefaults } from '../../App';
 import { AuthFormOptions } from '../../components/forms/AuthFormOptions';
@@ -32,6 +32,7 @@ export default function Login() {
   const [hostEdit, setHostEdit] = useToggle([false, true] as const);
   const [loginMode, setMode] = useDisclosure(true);
   const navigate = useNavigate();
+  const location = useLocation();
 
   // Data manipulation functions
   function ChangeHost(newHost: string): void {
@@ -46,8 +47,7 @@ export default function Login() {
       ChangeHost(defaultHostKey);
     }
 
-    // check if user is logged in in PUI
+    checkLoginState(navigate, location?.state?.redirectFrom, true);
-    checkLoginState(navigate, undefined, true);
   }, []);
 
   // Fetch server data on mount if no server data is present

src/frontend/tests/ui_plattform.spec.ts

@@ -7,7 +7,7 @@ test('Basic Platform UI test', async ({ page }) => {
   await page.getByLabel('username').fill('allaccess');
   await page.getByLabel('password').fill('nolimits');
   await page.getByRole('button', { name: 'Log in' }).click();
-  await page.waitForURL('**/platform/home');
+  await page.waitForURL('**/platform');
   await page.goto('./platform/');
 
   await expect(page).toHaveTitle('InvenTree Demo Server');