This commit is contained in:
Estifo77
2026-07-29 11:28:55 +03:00
parent 8118b646bd
commit 56bf81e4ad
5 changed files with 258 additions and 795 deletions

View File

@@ -0,0 +1,156 @@
import { useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import {
Alert,
Badge,
Button,
Divider,
Group,
Paper,
SimpleGrid,
Stack,
Stepper,
Text,
ThemeIcon,
Title,
} from '@mantine/core';
import {
IconAlertTriangle,
IconArrowLeft,
IconCircleCheck,
IconClock,
IconDownload,
IconInfoCircle,
IconShip,
} from '@tabler/icons-react';
import { notify } from '@ema-platform/ui';
import { MOCK_REGISTRATIONS, recordDownload, STATUS_COLOR } from '../mock';
// ponytail: placeholder PDF blob; wire real cert endpoint when backend lands.
const BLANK_PDF = 'data:application/pdf;base64,JVBERi0xLjQKJcfsj6IKMSAwIG9iago8PC9UeXBlL0NhdGFsb2cvUGFnZXMgMiAwIFI+PgplbmRvYmoKMiAwIG9iago8PC9UeXBlL1BhZ2VzL0tpZHNbMyAwIFJdL0NvdW50IDE+PgplbmRvYmoKMyAwIG9iago8PC9UeXBlL1BhZ2UvUGFyZW50IDIgMCBSL01lZGlhQm94WzAgMCA2MTIgNzkyXT4+CmVuZG9iagp4cmVmCjAgNAowMDAwMDAwMDAwIDY1NTM1IGYgCjAwMDAwMDAwMDkgMDAwMDAgbiAKMDAwMDAwMDA1OCAwMDAwMCBuIAowMDAwMDAwMTE1IDAwMDAwIG4gCnRyYWlsZXIKPDwvU2l6ZSA0L1Jvb3QgMSAwIFI+PgpzdGFydHhyZWYKMjE3CiUlRU9G';
function downloadCertificate(filename: string) {
const a = document.createElement('a');
a.href = BLANK_PDF;
a.download = filename;
a.click();
}
export function VesselRegistrationStatusPage() {
const navigate = useNavigate();
const { id } = useParams();
const [reg] = useState(() => MOCK_REGISTRATIONS.find((r) => r.id === id) ?? null);
const [, forceUpdate] = useState(0);
if (!reg) {
return (
<Stack gap="md">
<Button variant="subtle" leftSection={<IconArrowLeft size={14} />} onClick={() => navigate('/vessel-registrations')}>Back</Button>
<Alert variant="light" color="red" icon={<IconInfoCircle size={15} />}>Registration not found.</Alert>
</Stack>
);
}
const activeStep = reg.timeline.filter((t) => t.done).length - 1;
const needsCorrection = reg.status === 'Correction Required' || reg.status === 'Rejected';
const handleDownload = (certName: string, certNumber: string) => {
downloadCertificate(`${certName.replace(/\s+/g, '-')}-${certNumber}.pdf`);
recordDownload(reg.id, certName);
forceUpdate((n) => n + 1);
notify.success(`${certName} downloaded.`);
};
return (
<Stack gap="md">
<Group gap="sm">
<Button variant="subtle" leftSection={<IconArrowLeft size={14} />} onClick={() => navigate('/vessel-registrations')}>Back</Button>
<div>
<Title order={3}>{reg.vesselName}</Title>
<Text fz="sm" c="dimmed">{reg.id} {reg.category}</Text>
</div>
</Group>
<Paper withBorder radius="lg" p="xl">
<Group justify="space-between" mb="md" wrap="wrap" gap="sm">
<Group gap="sm">
<ThemeIcon size={36} radius="md" color="blue" variant="light"><IconShip size={18} /></ThemeIcon>
<div>
<Text fw={700} fz="sm">Registration Status</Text>
<Text fz="xs" c="dimmed">Submitted {reg.submitted}</Text>
</div>
</Group>
<Badge color={STATUS_COLOR[reg.status]} variant="light" size="lg">{reg.status}</Badge>
</Group>
{reg.renewal && reg.renewal !== 'OK' && (
<Alert
variant="light"
color={reg.renewal === 'Overdue' ? 'red' : 'orange'}
icon={<IconAlertTriangle size={15} />}
mb="md"
p="sm"
>
<Text fz="sm">
Registration {reg.renewal === 'Overdue' ? 'is overdue for renewal' : 'is due for renewal soon'}
{reg.expiryDate ? ` — expires ${reg.expiryDate}` : ''}.
</Text>
</Alert>
)}
{reg.remarks && (
<Alert variant="light" color={needsCorrection ? 'orange' : 'blue'} icon={<IconInfoCircle size={15} />} mb="md" p="sm">
<Text fz="sm" fw={600} mb={2}>Officer Remarks</Text>
<Text fz="sm">{reg.remarks}</Text>
</Alert>
)}
<Stepper active={activeStep} size="sm" color="teal">
{reg.timeline.map((step, i) => (
<Stepper.Step
key={i}
label={step.event}
description={step.date ?? 'Pending'}
icon={step.done ? <IconCircleCheck size={16} /> : <IconClock size={16} />}
/>
))}
</Stepper>
{needsCorrection && (
<Group justify="flex-end" mt="md">
<Button color="orange" onClick={() => navigate('/vessel-registrations/apply')}>Resubmit Application</Button>
</Group>
)}
</Paper>
{reg.status === 'Approved' && reg.certificates && (
<Paper withBorder radius="lg" p="xl">
<Text fw={700} mb="md">Certificates</Text>
<Stack gap="sm">
{reg.certificates.map((cert) => (
<div key={cert.name}>
<Group justify="space-between" wrap="wrap" gap="sm">
<div>
<Text fw={600} fz="sm">{cert.name}</Text>
<Text fz="xs" c="dimmed">Certificate No. {cert.number} Issued {cert.issueDate}</Text>
{cert.downloads > 0 && (
<Text fz="xs" c="dimmed">Downloaded {cert.downloads} time{cert.downloads === 1 ? '' : 's'}</Text>
)}
</div>
<Button
size="xs"
leftSection={<IconDownload size={14} />}
onClick={() => handleDownload(cert.name, cert.number)}
>
Download
</Button>
</Group>
<Divider mt="sm" />
</div>
))}
</Stack>
</Paper>
)}
</Stack>
);
}

View File

@@ -1,105 +1,83 @@
import { createBrowserRouter, Navigate } from "react-router-dom";
import { I18nextProvider } from "react-i18next";
import { i18n } from "./i18n/config";
import { PortalLayout } from "./layouts/PortalLayout";
import { ProtectedRoute } from "./components/ProtectedRoute";
import { ProfileGuard } from "./components/ProfileGuard";
import { createBrowserRouter, Navigate } from 'react-router-dom';
import { I18nextProvider } from 'react-i18next';
import { i18n } from './i18n/config';
import { PortalLayout } from './layouts/PortalLayout';
import { ProtectedRoute } from './components/ProtectedRoute';
import { ProfileGuard } from './components/ProfileGuard';
// Auth (standalone pages, no portal chrome)
import {
LoginPage,
SignupPage,
OTPVerificationPage,
ForgotPasswordPage,
} from "@ema-platform/auth";
import { LoginPage, SignupPage, OTPVerificationPage, ForgotPasswordPage } from '@ema-platform/auth';
// Profile setup
import { ProfileSetupPage } from "./features/profile-setup/pages/ProfileSetupPage";
import { ProfileSetupPage } from './features/profile-setup/pages/ProfileSetupPage';
// Portal feature pages
import { DashboardPage } from "./features/dashboard/pages/DashboardPage";
import { ProfilePage } from "./features/profile/pages/ProfilePage";
import { SupportPage } from "./features/support/pages/SupportPage";
import { SeafarerRegistrationPage } from "./features/seafarer/pages/SeafarerRegistrationPage";
import { SeafarerRegistryPage } from "./features/seafarer/pages/SeafarerRegistryPage";
import { SeafarerProfilePage } from "./features/seafarer/pages/SeafarerProfilePage";
import { DashboardPage } from './features/dashboard/pages/DashboardPage';
import { ProfilePage } from './features/profile/pages/ProfilePage';
import { SupportPage } from './features/support/pages/SupportPage';
import { SeafarerRegistrationPage } from './features/seafarer/pages/SeafarerRegistrationPage';
import { SeafarerRegistryPage } from './features/seafarer/pages/SeafarerRegistryPage';
import { SeafarerProfilePage } from './features/seafarer/pages/SeafarerProfilePage';
// Phase 1 pages
import { DocumentVaultPage } from "./features/documents/pages/DocumentVaultPage";
import { SeamanBookPage } from "./features/seaman-book/pages/SeamanBookPage";
import { SeamanBookApplicationPage } from "./features/seaman-book/pages/SeamanBookApplicationPage";
import { NotificationsPage } from "./features/notifications/pages/NotificationsPage";
import { DocumentVaultPage } from './features/documents/pages/DocumentVaultPage';
import { SeamanBookPage } from './features/seaman-book/pages/SeamanBookPage';
import { SeamanBookApplicationPage } from './features/seaman-book/pages/SeamanBookApplicationPage';
import { NotificationsPage } from './features/notifications/pages/NotificationsPage';
// Phase 2 — CoC / CoP
import { CertificatesPage } from "./features/certificates/pages/CertificatesPage";
import { CoCApplicationPage } from "./features/certificates/pages/CoCApplicationPage";
import { CertificatesPage } from './features/certificates/pages/CertificatesPage';
import { CoCApplicationPage } from './features/certificates/pages/CoCApplicationPage';
// Phase 3 — Endorsement
import { EndorsementPage } from "./features/endorsement/pages/EndorsementPage";
import { VesselRegistrationPage } from "./features/vessel-registration/pages/VesselRegistrationPage";
import { VesselRegistrationApplicationPage } from "./features/vessel-registration/pages/VesselRegistrationApplicationPage";
import { OwnershipTransferPage } from "./features/vessel-registration/pages/OwnershipTransferPage";
import { VesselRegistrationDashboardPage } from "./features/vessel-registration-dashboard/pages/VesselRegistrationDashboardPage";
import { VesselOwnerLayout } from "./layouts/VesselOwnerLayout";
import { VesselOwnerLoginPage } from "./features/vessel-owner/pages/VesselOwnerLoginPage";
import { VesselOwnerRegisterPage } from "./features/vessel-owner/pages/VesselOwnerRegisterPage";
import { VesselOwnerDashboardPage } from "./features/vessel-owner/pages/VesselOwnerDashboardPage";
import { LogisticsDashboardPage } from "./features/logistics-dashboard/pages/LogisticsDashboardPage";
import { FreightForwarderLicensePage } from "./features/freight-forwarder-license/pages/FreightForwarderLicensePage";
import { FreightForwarderLicenseApplicationPage } from "./features/freight-forwarder-license/pages/FreightForwarderLicenseApplicationPage";
import { FreightForwarderLicenseRenewalPage } from "./features/freight-forwarder-license/pages/FreightForwarderLicenseRenewalPage";
import { ShippingAgentLicensePage } from "./features/shipping-agent-license/pages/ShippingAgentLicensePage";
import { ShippingAgentLicenseApplicationPage } from "./features/shipping-agent-license/pages/ShippingAgentLicenseApplicationPage";
import { ShippingAgentLicenseRenewalPage } from "./features/shipping-agent-license/pages/ShippingAgentLicenseRenewalPage";
import { CombinedLicensePage } from "./features/combined-license/pages/CombinedLicensePage";
import { CombinedLicenseApplicationPage } from "./features/combined-license/pages/CombinedLicenseApplicationPage";
import { CombinedLicenseRenewalPage } from "./features/combined-license/pages/CombinedLicenseRenewalPage";
import { JointInvestmentLicensePage } from "./features/joint-investment-license/pages/JointInvestmentLicensePage";
import { JointInvestmentLicenseApplicationPage } from "./features/joint-investment-license/pages/JointInvestmentLicenseApplicationPage";
import { JointInvestmentLicenseRenewalPage } from "./features/joint-investment-license/pages/JointInvestmentLicenseRenewalPage";
import { MtoLicensePage } from "./features/mto-license/pages/MtoLicensePage";
import { MtoLicenseApplicationPage } from "./features/mto-license/pages/MtoLicenseApplicationPage";
import { MtoLicenseRenewalPage } from "./features/mto-license/pages/MtoLicenseRenewalPage";
import { WaiverPage } from "./features/waiver/pages/WaiverPage";
import { WaiverApplicationPage } from "./features/waiver/pages/WaiverApplicationPage";
import { EndorsementPage } from './features/endorsement/pages/EndorsementPage';
import { VesselRegistrationPage } from './features/vessel-registration/pages/VesselRegistrationPage';
import { VesselRegistrationApplicationPage } from './features/vessel-registration/pages/VesselRegistrationApplicationPage';
import { OwnershipTransferPage } from './features/vessel-registration/pages/OwnershipTransferPage';
import { VesselRegistrationDashboardPage } from './features/vessel-registration-dashboard/pages/VesselRegistrationDashboardPage';
import { VesselOwnerLayout } from './layouts/VesselOwnerLayout';
import { VesselOwnerLoginPage } from './features/vessel-owner/pages/VesselOwnerLoginPage';
import { VesselOwnerRegisterPage } from './features/vessel-owner/pages/VesselOwnerRegisterPage';
import { VesselOwnerDashboardPage } from './features/vessel-owner/pages/VesselOwnerDashboardPage';
import { LogisticsDashboardPage } from './features/logistics-dashboard/pages/LogisticsDashboardPage';
import { FreightForwarderLicensePage } from './features/freight-forwarder-license/pages/FreightForwarderLicensePage';
import { FreightForwarderLicenseApplicationPage } from './features/freight-forwarder-license/pages/FreightForwarderLicenseApplicationPage';
import { FreightForwarderLicenseRenewalPage } from './features/freight-forwarder-license/pages/FreightForwarderLicenseRenewalPage';
import { ShippingAgentLicensePage } from './features/shipping-agent-license/pages/ShippingAgentLicensePage';
import { ShippingAgentLicenseApplicationPage } from './features/shipping-agent-license/pages/ShippingAgentLicenseApplicationPage';
import { ShippingAgentLicenseRenewalPage } from './features/shipping-agent-license/pages/ShippingAgentLicenseRenewalPage';
import { CombinedLicensePage } from './features/combined-license/pages/CombinedLicensePage';
import { CombinedLicenseApplicationPage } from './features/combined-license/pages/CombinedLicenseApplicationPage';
import { CombinedLicenseRenewalPage } from './features/combined-license/pages/CombinedLicenseRenewalPage';
import { JointInvestmentLicensePage } from './features/joint-investment-license/pages/JointInvestmentLicensePage';
import { JointInvestmentLicenseApplicationPage } from './features/joint-investment-license/pages/JointInvestmentLicenseApplicationPage';
import { JointInvestmentLicenseRenewalPage } from './features/joint-investment-license/pages/JointInvestmentLicenseRenewalPage';
import { MtoLicensePage } from './features/mto-license/pages/MtoLicensePage';
import { MtoLicenseApplicationPage } from './features/mto-license/pages/MtoLicenseApplicationPage';
import { MtoLicenseRenewalPage } from './features/mto-license/pages/MtoLicenseRenewalPage';
import { WaiverPage } from './features/waiver/pages/WaiverPage';
import { WaiverApplicationPage } from './features/waiver/pages/WaiverApplicationPage';
// Vessel Ownership Transfer
import { VesselTransferPage } from "./features/vessel-transfer/pages/VesselTransferPage";
import { VesselTransferApplicationPage } from "./features/vessel-transfer/pages/VesselTransferApplicationPage";
// Vessel Registration
import { VesselRegistrationStatusPage } from "./features/vessel-registration/pages/VesselRegistrationStatusPage";
import { VesselRegistrationStatusPage } from './features/vessel-registration/pages/VesselRegistrationStatusPage';
export const router = createBrowserRouter([
// Public auth pages
{ path: "/login", element: <LoginPage /> },
{ path: "/signup", element: <SignupPage /> },
{ path: '/login', element: <LoginPage /> },
{ path: '/signup', element: <SignupPage /> },
// Protected auth pages
{
element: (
<ProtectedRoute>
<OTPVerificationPage />
</ProtectedRoute>
),
path: "/otp-verify",
element: <ProtectedRoute><OTPVerificationPage /></ProtectedRoute>,
path: '/otp-verify',
},
{
element: (
<ProtectedRoute>
<ForgotPasswordPage />
</ProtectedRoute>
),
path: "/forgot-password",
element: <ProtectedRoute><ForgotPasswordPage /></ProtectedRoute>,
path: '/forgot-password',
},
{
element: (
<ProtectedRoute>
<ProfileSetupPage />
</ProtectedRoute>
),
path: "/profile-setup",
element: <ProtectedRoute><ProfileSetupPage /></ProtectedRoute>,
path: '/profile-setup',
},
// Portal — protected
@@ -114,117 +92,63 @@ export const router = createBrowserRouter([
</ProtectedRoute>
),
children: [
{ path: "/", element: <Navigate to="/dashboard" replace /> },
{ path: "/dashboard", element: <DashboardPage /> },
{ path: '/', element: <Navigate to="/dashboard" replace /> },
{ path: '/dashboard', element: <DashboardPage /> },
// Seafarer
{ path: "/seafarer-registration", element: <SeafarerRegistrationPage /> },
{ path: "/seafarer-registry", element: <SeafarerRegistryPage /> },
{ path: "/seafarer-registry/:id", element: <SeafarerProfilePage /> },
{ path: '/seafarer-registration', element: <SeafarerRegistrationPage /> },
{ path: '/seafarer-registry', element: <SeafarerRegistryPage /> },
{ path: '/seafarer-registry/:id', element: <SeafarerProfilePage /> },
// Phase 1
{ path: "/documents", element: <DocumentVaultPage /> },
{ path: "/seaman-book", element: <SeamanBookPage /> },
{ path: "/seaman-book/apply", element: <SeamanBookApplicationPage /> },
{ path: "/notifications", element: <NotificationsPage /> },
{ path: '/documents', element: <DocumentVaultPage /> },
{ path: '/seaman-book', element: <SeamanBookPage /> },
{ path: '/seaman-book/apply', element: <SeamanBookApplicationPage /> },
{ path: '/notifications', element: <NotificationsPage /> },
// Phase 2 — CoC / CoP
{ path: "/certificates", element: <CertificatesPage /> },
{ path: "/certificates/apply", element: <CoCApplicationPage /> },
{ path: '/certificates', element: <CertificatesPage /> },
{ path: '/certificates/apply', element: <CoCApplicationPage /> },
// Phase 3 — Endorsement
{ path: "/endorsements", element: <EndorsementPage /> },
{
path: "/vessel-registration-dashboard",
element: <VesselRegistrationDashboardPage />,
},
{ path: "/vessel-registration", element: <VesselRegistrationPage /> },
{
path: "/vessel-registration/apply",
element: <VesselRegistrationApplicationPage />,
},
{
path: "/vessel-registration/transfer",
element: <OwnershipTransferPage />,
},
{ path: "/logistics-dashboard", element: <LogisticsDashboardPage /> },
{
path: "/freight-forwarder-license",
element: <FreightForwarderLicensePage />,
},
{
path: "/freight-forwarder-license/apply",
element: <FreightForwarderLicenseApplicationPage />,
},
{
path: "/freight-forwarder-license/:id/renew",
element: <FreightForwarderLicenseRenewalPage />,
},
{
path: "/shipping-agent-license",
element: <ShippingAgentLicensePage />,
},
{
path: "/shipping-agent-license/apply",
element: <ShippingAgentLicenseApplicationPage />,
},
{
path: "/shipping-agent-license/:id/renew",
element: <ShippingAgentLicenseRenewalPage />,
},
{ path: "/combined-license", element: <CombinedLicensePage /> },
{
path: "/combined-license/apply",
element: <CombinedLicenseApplicationPage />,
},
{
path: "/combined-license/:id/renew",
element: <CombinedLicenseRenewalPage />,
},
{
path: "/joint-investment-license",
element: <JointInvestmentLicensePage />,
},
{
path: "/joint-investment-license/apply",
element: <JointInvestmentLicenseApplicationPage />,
},
{
path: "/joint-investment-license/:id/renew",
element: <JointInvestmentLicenseRenewalPage />,
},
{ path: "/mto-license", element: <MtoLicensePage /> },
{ path: "/mto-license/apply", element: <MtoLicenseApplicationPage /> },
{ path: "/mto-license/:id/renew", element: <MtoLicenseRenewalPage /> },
{ path: "/waiver", element: <WaiverPage /> },
{ path: "/waiver/apply", element: <WaiverApplicationPage /> },
{ path: '/endorsements', element: <EndorsementPage /> },
{ path: '/vessel-registration-dashboard', element: <VesselRegistrationDashboardPage /> },
{ path: '/vessel-registration', element: <VesselRegistrationPage /> },
{ path: '/vessel-registration/apply', element: <VesselRegistrationApplicationPage /> },
{ path: '/vessel-registration/transfer', element: <OwnershipTransferPage /> },
{ path: '/logistics-dashboard', element: <LogisticsDashboardPage /> },
{ path: '/freight-forwarder-license', element: <FreightForwarderLicensePage /> },
{ path: '/freight-forwarder-license/apply', element: <FreightForwarderLicenseApplicationPage /> },
{ path: '/freight-forwarder-license/:id/renew', element: <FreightForwarderLicenseRenewalPage /> },
{ path: '/shipping-agent-license', element: <ShippingAgentLicensePage /> },
{ path: '/shipping-agent-license/apply', element: <ShippingAgentLicenseApplicationPage /> },
{ path: '/shipping-agent-license/:id/renew', element: <ShippingAgentLicenseRenewalPage /> },
{ path: '/combined-license', element: <CombinedLicensePage /> },
{ path: '/combined-license/apply', element: <CombinedLicenseApplicationPage /> },
{ path: '/combined-license/:id/renew', element: <CombinedLicenseRenewalPage /> },
{ path: '/joint-investment-license', element: <JointInvestmentLicensePage /> },
{ path: '/joint-investment-license/apply', element: <JointInvestmentLicenseApplicationPage /> },
{ path: '/joint-investment-license/:id/renew', element: <JointInvestmentLicenseRenewalPage /> },
{ path: '/mto-license', element: <MtoLicensePage /> },
{ path: '/mto-license/apply', element: <MtoLicenseApplicationPage /> },
{ path: '/mto-license/:id/renew', element: <MtoLicenseRenewalPage /> },
{ path: '/waiver', element: <WaiverPage /> },
{ path: '/waiver/apply', element: <WaiverApplicationPage /> },
// Vessel Registration
{ path: "/vessel-registrations", element: <VesselRegistrationPage /> },
{
path: "/vessel-registrations/apply",
element: <VesselRegistrationApplicationPage />,
},
{
path: "/vessel-registrations/:id",
element: <VesselRegistrationStatusPage />,
},
{ path: '/vessel-registrations', element: <VesselRegistrationPage /> },
{ path: '/vessel-registrations/apply', element: <VesselRegistrationApplicationPage /> },
{ path: '/vessel-registrations/:id', element: <VesselRegistrationStatusPage /> },
// Vessel Ownership Transfer
{ path: "/vessel-transfers", element: <VesselTransferPage /> },
{
path: "/vessel-transfers/apply",
element: <VesselTransferApplicationPage />,
},
// General
{ path: "/profile", element: <ProfilePage /> },
{ path: "/support", element: <SupportPage /> },
{ path: '/profile', element: <ProfilePage /> },
{ path: '/support', element: <SupportPage /> },
],
},
{ path: "/vessel-owner/login", element: <VesselOwnerLoginPage /> },
{ path: "/vessel-owner/register", element: <VesselOwnerRegisterPage /> },
{ path: '/vessel-owner/login', element: <VesselOwnerLoginPage /> },
{ path: '/vessel-owner/register', element: <VesselOwnerRegisterPage /> },
{
element: (
<ProtectedRoute>
@@ -234,24 +158,12 @@ export const router = createBrowserRouter([
</ProtectedRoute>
),
children: [
{
path: "/vessel-owner/dashboard",
element: <VesselOwnerDashboardPage />,
},
{
path: "/vessel-owner/registration",
element: <VesselRegistrationPage />,
},
{
path: "/vessel-owner/registration/apply",
element: <VesselRegistrationApplicationPage />,
},
{
path: "/vessel-owner/registration/transfer",
element: <OwnershipTransferPage />,
},
{ path: '/vessel-owner/dashboard', element: <VesselOwnerDashboardPage /> },
{ path: '/vessel-owner/registration', element: <VesselRegistrationPage /> },
{ path: '/vessel-owner/registration/apply', element: <VesselRegistrationApplicationPage /> },
{ path: '/vessel-owner/registration/transfer', element: <OwnershipTransferPage /> },
],
},
{ path: "*", element: <Navigate to="/" replace /> },
{ path: '*', element: <Navigate to="/" replace /> },
]);