679 lines
26 KiB
TypeScript
679 lines
26 KiB
TypeScript
import { Suspense, lazy, useEffect } from "react";
|
|
import { BrowserRouter as Router, Routes, Route, Navigate } from "react-router";
|
|
import { HelmetProvider } from "react-helmet-async";
|
|
import AppLayout from "./layout/AppLayout";
|
|
import { ScrollToTop } from "./components/common/ScrollToTop";
|
|
import ProtectedRoute from "./components/auth/ProtectedRoute";
|
|
import ModuleGuard from "./components/common/ModuleGuard";
|
|
import GlobalErrorDisplay from "./components/common/GlobalErrorDisplay";
|
|
import LoadingStateMonitor from "./components/common/LoadingStateMonitor";
|
|
import { useAuthStore } from "./store/authStore";
|
|
|
|
// Auth pages - loaded immediately (needed for login)
|
|
import SignIn from "./pages/AuthPages/SignIn";
|
|
import SignUp from "./pages/AuthPages/SignUp";
|
|
import NotFound from "./pages/OtherPage/NotFound";
|
|
|
|
// Lazy load all other pages - only loads when navigated to
|
|
const Home = lazy(() => import("./pages/Dashboard/Home"));
|
|
|
|
// Planner Module - Lazy loaded
|
|
const PlannerDashboard = lazy(() => import("./pages/Planner/Dashboard"));
|
|
const Keywords = lazy(() => import("./pages/Planner/Keywords"));
|
|
const Clusters = lazy(() => import("./pages/Planner/Clusters"));
|
|
const Ideas = lazy(() => import("./pages/Planner/Ideas"));
|
|
const KeywordOpportunities = lazy(() => import("./pages/Planner/KeywordOpportunities"));
|
|
|
|
// Writer Module - Lazy loaded
|
|
const WriterDashboard = lazy(() => import("./pages/Writer/Dashboard"));
|
|
const Tasks = lazy(() => import("./pages/Writer/Tasks"));
|
|
const Content = lazy(() => import("./pages/Writer/Content"));
|
|
const ContentView = lazy(() => import("./pages/Writer/ContentView"));
|
|
const Drafts = lazy(() => import("./pages/Writer/Drafts"));
|
|
const Images = lazy(() => import("./pages/Writer/Images"));
|
|
const Published = lazy(() => import("./pages/Writer/Published"));
|
|
|
|
// Linker Module - Lazy loaded
|
|
const LinkerDashboard = lazy(() => import("./pages/Linker/Dashboard"));
|
|
const LinkerContentList = lazy(() => import("./pages/Linker/ContentList"));
|
|
|
|
// Optimizer Module - Lazy loaded
|
|
const OptimizerDashboard = lazy(() => import("./pages/Optimizer/Dashboard"));
|
|
const OptimizerContentSelector = lazy(() => import("./pages/Optimizer/ContentSelector"));
|
|
const AnalysisPreview = lazy(() => import("./pages/Optimizer/AnalysisPreview"));
|
|
|
|
// Thinker Module - Lazy loaded
|
|
const ThinkerDashboard = lazy(() => import("./pages/Thinker/Dashboard"));
|
|
const Prompts = lazy(() => import("./pages/Thinker/Prompts"));
|
|
const AuthorProfiles = lazy(() => import("./pages/Thinker/AuthorProfiles"));
|
|
const ThinkerProfile = lazy(() => import("./pages/Thinker/Profile"));
|
|
const Strategies = lazy(() => import("./pages/Thinker/Strategies"));
|
|
const ImageTesting = lazy(() => import("./pages/Thinker/ImageTesting"));
|
|
|
|
// Billing Module - Lazy loaded
|
|
const Credits = lazy(() => import("./pages/Billing/Credits"));
|
|
const Transactions = lazy(() => import("./pages/Billing/Transactions"));
|
|
const Usage = lazy(() => import("./pages/Billing/Usage"));
|
|
|
|
// Reference Data - Lazy loaded
|
|
const SeedKeywords = lazy(() => import("./pages/Reference/SeedKeywords"));
|
|
const ReferenceIndustries = lazy(() => import("./pages/Reference/Industries"));
|
|
|
|
// Setup Pages - Lazy loaded
|
|
const IndustriesSectorsKeywords = lazy(() => import("./pages/Setup/IndustriesSectorsKeywords"));
|
|
|
|
// Other Pages - Lazy loaded
|
|
const AutomationDashboard = lazy(() => import("./pages/Automation/Dashboard"));
|
|
const AutomationRules = lazy(() => import("./pages/Automation/Rules"));
|
|
const AutomationTasks = lazy(() => import("./pages/Automation/Tasks"));
|
|
|
|
// Settings - Lazy loaded
|
|
const GeneralSettings = lazy(() => import("./pages/Settings/General"));
|
|
const Users = lazy(() => import("./pages/Settings/Users"));
|
|
const Subscriptions = lazy(() => import("./pages/Settings/Subscriptions"));
|
|
const SystemSettings = lazy(() => import("./pages/Settings/System"));
|
|
const AccountSettings = lazy(() => import("./pages/Settings/Account"));
|
|
const ModuleSettings = lazy(() => import("./pages/Settings/Modules"));
|
|
const AISettings = lazy(() => import("./pages/Settings/AI"));
|
|
const Plans = lazy(() => import("./pages/Settings/Plans"));
|
|
const Industries = lazy(() => import("./pages/Settings/Industries"));
|
|
const Status = lazy(() => import("./pages/Settings/Status"));
|
|
const ApiMonitor = lazy(() => import("./pages/Settings/ApiMonitor"));
|
|
const Integration = lazy(() => import("./pages/Settings/Integration"));
|
|
const Publishing = lazy(() => import("./pages/Settings/Publishing"));
|
|
const Sites = lazy(() => import("./pages/Settings/Sites"));
|
|
const ImportExport = lazy(() => import("./pages/Settings/ImportExport"));
|
|
|
|
// Sites - Lazy loaded
|
|
const SiteList = lazy(() => import("./pages/Sites/List"));
|
|
const SiteManage = lazy(() => import("./pages/Sites/Manage"));
|
|
const SiteDashboard = lazy(() => import("./pages/Sites/Dashboard"));
|
|
const SiteContent = lazy(() => import("./pages/Sites/Content"));
|
|
const SiteEditor = lazy(() => import("./pages/Sites/Editor"));
|
|
const PageManager = lazy(() => import("./pages/Sites/PageManager"));
|
|
const PostEditor = lazy(() => import("./pages/Sites/PostEditor"));
|
|
const SitePreview = lazy(() => import("./pages/Sites/Preview"));
|
|
const SiteSettings = lazy(() => import("./pages/Sites/Settings"));
|
|
const SyncDashboard = lazy(() => import("./pages/Sites/SyncDashboard"));
|
|
const DeploymentPanel = lazy(() => import("./pages/Sites/DeploymentPanel"));
|
|
|
|
|
|
// Help - Lazy loaded
|
|
const Help = lazy(() => import("./pages/Help/Help"));
|
|
const Docs = lazy(() => import("./pages/Help/Docs"));
|
|
const SystemTesting = lazy(() => import("./pages/Help/SystemTesting"));
|
|
const FunctionTesting = lazy(() => import("./pages/Help/FunctionTesting"));
|
|
|
|
// Components - Lazy loaded
|
|
const Components = lazy(() => import("./pages/Components"));
|
|
|
|
// UI Elements - Lazy loaded (rarely used)
|
|
const Alerts = lazy(() => import("./pages/Settings/UiElements/Alerts"));
|
|
const Avatars = lazy(() => import("./pages/Settings/UiElements/Avatars"));
|
|
const Badges = lazy(() => import("./pages/Settings/UiElements/Badges"));
|
|
const Breadcrumb = lazy(() => import("./pages/Settings/UiElements/Breadcrumb"));
|
|
const Buttons = lazy(() => import("./pages/Settings/UiElements/Buttons"));
|
|
const ButtonsGroup = lazy(() => import("./pages/Settings/UiElements/ButtonsGroup"));
|
|
const Cards = lazy(() => import("./pages/Settings/UiElements/Cards"));
|
|
const Carousel = lazy(() => import("./pages/Settings/UiElements/Carousel"));
|
|
const Dropdowns = lazy(() => import("./pages/Settings/UiElements/Dropdowns"));
|
|
const ImagesUI = lazy(() => import("./pages/Settings/UiElements/Images"));
|
|
const Links = lazy(() => import("./pages/Settings/UiElements/Links"));
|
|
const List = lazy(() => import("./pages/Settings/UiElements/List"));
|
|
const Modals = lazy(() => import("./pages/Settings/UiElements/Modals"));
|
|
const Notifications = lazy(() => import("./pages/Settings/UiElements/Notifications"));
|
|
const Pagination = lazy(() => import("./pages/Settings/UiElements/Pagination"));
|
|
const Popovers = lazy(() => import("./pages/Settings/UiElements/Popovers"));
|
|
const PricingTable = lazy(() => import("./pages/Settings/UiElements/PricingTable"));
|
|
const Progressbar = lazy(() => import("./pages/Settings/UiElements/Progressbar"));
|
|
const Ribbons = lazy(() => import("./pages/Settings/UiElements/Ribbons"));
|
|
const Spinners = lazy(() => import("./pages/Settings/UiElements/Spinners"));
|
|
const Tabs = lazy(() => import("./pages/Settings/UiElements/Tabs"));
|
|
const Tooltips = lazy(() => import("./pages/Settings/UiElements/Tooltips"));
|
|
const Videos = lazy(() => import("./pages/Settings/UiElements/Videos"));
|
|
|
|
export default function App() {
|
|
const isAuthenticated = useAuthStore((state) => state.isAuthenticated);
|
|
const refreshUser = useAuthStore((state) => state.refreshUser);
|
|
const logout = useAuthStore((state) => state.logout);
|
|
|
|
useEffect(() => {
|
|
if (!isAuthenticated) {
|
|
return;
|
|
}
|
|
|
|
refreshUser().catch((error) => {
|
|
console.warn('Session validation failed:', error);
|
|
logout();
|
|
});
|
|
}, [isAuthenticated, refreshUser, logout]);
|
|
|
|
return (
|
|
<>
|
|
<GlobalErrorDisplay />
|
|
<LoadingStateMonitor />
|
|
<Router>
|
|
<HelmetProvider>
|
|
<ScrollToTop />
|
|
<Routes>
|
|
{/* Auth Routes - Public */}
|
|
<Route path="/signin" element={<SignIn />} />
|
|
<Route path="/signup" element={<SignUp />} />
|
|
|
|
{/* Protected Routes - Require Authentication */}
|
|
<Route
|
|
element={
|
|
<ProtectedRoute>
|
|
<AppLayout />
|
|
</ProtectedRoute>
|
|
}
|
|
>
|
|
{/* Dashboard */}
|
|
<Route index path="/" element={
|
|
<Suspense fallback={null}>
|
|
<Home />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Planner Module - Redirect dashboard to keywords */}
|
|
<Route path="/planner" element={<Navigate to="/planner/keywords" replace />} />
|
|
<Route path="/planner/keywords" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="planner">
|
|
<Keywords />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/planner/clusters" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="planner">
|
|
<Clusters />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/planner/ideas" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="planner">
|
|
<Ideas />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Writer Module - Redirect dashboard to content */}
|
|
<Route path="/writer" element={<Navigate to="/writer/content" replace />} />
|
|
<Route path="/writer/tasks" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="writer">
|
|
<Tasks />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
{/* Writer Content Routes - Order matters: list route must come before detail route */}
|
|
<Route path="/writer/content" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="writer">
|
|
<Content />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
{/* Content detail view - matches /writer/content/:id (e.g., /writer/content/10) */}
|
|
<Route path="/writer/content/:id" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="writer">
|
|
<ContentView />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/writer/drafts" element={<Navigate to="/writer/content" replace />} />
|
|
<Route path="/writer/images" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="writer">
|
|
<Images />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/writer/published" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="writer">
|
|
<Published />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Linker Module - Redirect dashboard to content */}
|
|
<Route path="/linker" element={<Navigate to="/linker/content" replace />} />
|
|
<Route path="/linker/content" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="linker">
|
|
<LinkerContentList />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Optimizer Module - Redirect dashboard to content */}
|
|
<Route path="/optimizer" element={<Navigate to="/optimizer/content" replace />} />
|
|
<Route path="/optimizer/content" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="optimizer">
|
|
<OptimizerContentSelector />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/optimizer/analyze/:id" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="optimizer">
|
|
<AnalysisPreview />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Thinker Module */}
|
|
{/* Thinker Module - Redirect dashboard to prompts */}
|
|
<Route path="/thinker" element={<Navigate to="/thinker/prompts" replace />} />
|
|
<Route path="/thinker/prompts" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="thinker">
|
|
<Prompts />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/thinker/author-profiles" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="thinker">
|
|
<AuthorProfiles />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/thinker/profile" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="thinker">
|
|
<ThinkerProfile />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/thinker/strategies" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="thinker">
|
|
<Strategies />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/thinker/image-testing" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="thinker">
|
|
<ImageTesting />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Billing Module */}
|
|
<Route path="/billing/credits" element={
|
|
<Suspense fallback={null}>
|
|
<Credits />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/billing/transactions" element={
|
|
<Suspense fallback={null}>
|
|
<Transactions />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/billing/usage" element={
|
|
<Suspense fallback={null}>
|
|
<Usage />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Reference Data */}
|
|
<Route path="/reference/seed-keywords" element={
|
|
<Suspense fallback={null}>
|
|
<SeedKeywords />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/planner/keyword-opportunities" element={
|
|
<Suspense fallback={null}>
|
|
<KeywordOpportunities />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/reference/industries" element={
|
|
<Suspense fallback={null}>
|
|
<ReferenceIndustries />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Setup Pages */}
|
|
<Route path="/setup/industries-sectors-keywords" element={
|
|
<Suspense fallback={null}>
|
|
<IndustriesSectorsKeywords />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Automation Module - Redirect dashboard to rules */}
|
|
<Route path="/automation" element={<Navigate to="/automation/rules" replace />} />
|
|
<Route path="/automation/rules" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="automation">
|
|
<AutomationRules />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
<Route path="/automation/tasks" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleGuard module="automation">
|
|
<AutomationTasks />
|
|
</ModuleGuard>
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Settings */}
|
|
<Route path="/settings" element={
|
|
<Suspense fallback={null}>
|
|
<GeneralSettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/users" element={
|
|
<Suspense fallback={null}>
|
|
<Users />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/subscriptions" element={
|
|
<Suspense fallback={null}>
|
|
<Subscriptions />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/system" element={
|
|
<Suspense fallback={null}>
|
|
<SystemSettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/account" element={
|
|
<Suspense fallback={null}>
|
|
<AccountSettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/modules" element={
|
|
<Suspense fallback={null}>
|
|
<ModuleSettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/ai" element={
|
|
<Suspense fallback={null}>
|
|
<AISettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/plans" element={
|
|
<Suspense fallback={null}>
|
|
<Plans />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/industries" element={
|
|
<Suspense fallback={null}>
|
|
<Industries />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/status" element={
|
|
<Suspense fallback={null}>
|
|
<Status />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/api-monitor" element={
|
|
<Suspense fallback={null}>
|
|
<ApiMonitor />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/integration" element={
|
|
<Suspense fallback={null}>
|
|
<Integration />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/publishing" element={
|
|
<Suspense fallback={null}>
|
|
<Publishing />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/sites" element={
|
|
<Suspense fallback={null}>
|
|
<Sites />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/settings/import-export" element={
|
|
<Suspense fallback={null}>
|
|
<ImportExport />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Sites Management */}
|
|
<Route path="/sites" element={
|
|
<Suspense fallback={null}>
|
|
<SiteList />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/manage" element={
|
|
<Suspense fallback={null}>
|
|
<SiteManage />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id" element={
|
|
<Suspense fallback={null}>
|
|
<SiteDashboard />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/pages" element={
|
|
<Suspense fallback={null}>
|
|
<PageManager />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/pages/new" element={
|
|
<Suspense fallback={null}>
|
|
<PageManager />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/pages/:pageId/edit" element={
|
|
<Suspense fallback={null}>
|
|
<PageManager />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/content" element={
|
|
<Suspense fallback={null}>
|
|
<SiteContent />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/editor" element={
|
|
<Suspense fallback={null}>
|
|
<SiteEditor />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/preview" element={
|
|
<Suspense fallback={null}>
|
|
<SitePreview />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/settings" element={
|
|
<Suspense fallback={null}>
|
|
<SiteSettings />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/sync" element={
|
|
<Suspense fallback={null}>
|
|
<SyncDashboard />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/deploy" element={
|
|
<Suspense fallback={null}>
|
|
<DeploymentPanel />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/posts/:postId" element={
|
|
<Suspense fallback={null}>
|
|
<PostEditor />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/sites/:id/posts/:postId/edit" element={
|
|
<Suspense fallback={null}>
|
|
<PostEditor />
|
|
</Suspense>
|
|
} />
|
|
|
|
|
|
{/* Help */}
|
|
<Route path="/help" element={
|
|
<Suspense fallback={null}>
|
|
<Help />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/help/docs" element={
|
|
<Suspense fallback={null}>
|
|
<Docs />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/help/system-testing" element={
|
|
<Suspense fallback={null}>
|
|
<SystemTesting />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/help/function-testing" element={
|
|
<Suspense fallback={null}>
|
|
<FunctionTesting />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* UI Elements */}
|
|
<Route path="/ui-elements/alerts" element={
|
|
<Suspense fallback={null}>
|
|
<Alerts />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/avatars" element={
|
|
<Suspense fallback={null}>
|
|
<Avatars />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/badges" element={
|
|
<Suspense fallback={null}>
|
|
<Badges />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/breadcrumb" element={
|
|
<Suspense fallback={null}>
|
|
<Breadcrumb />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/buttons" element={
|
|
<Suspense fallback={null}>
|
|
<Buttons />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/buttons-group" element={
|
|
<Suspense fallback={null}>
|
|
<ButtonsGroup />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/cards" element={
|
|
<Suspense fallback={null}>
|
|
<Cards />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/carousel" element={
|
|
<Suspense fallback={null}>
|
|
<Carousel />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/dropdowns" element={
|
|
<Suspense fallback={null}>
|
|
<Dropdowns />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/images" element={
|
|
<Suspense fallback={null}>
|
|
<ImagesUI />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/links" element={
|
|
<Suspense fallback={null}>
|
|
<Links />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/list" element={
|
|
<Suspense fallback={null}>
|
|
<List />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/modals" element={
|
|
<Suspense fallback={null}>
|
|
<Modals />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/notifications" element={
|
|
<Suspense fallback={null}>
|
|
<Notifications />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/pagination" element={
|
|
<Suspense fallback={null}>
|
|
<Pagination />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/popovers" element={
|
|
<Suspense fallback={null}>
|
|
<Popovers />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/pricing-table" element={
|
|
<Suspense fallback={null}>
|
|
<PricingTable />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/progressbar" element={
|
|
<Suspense fallback={null}>
|
|
<Progressbar />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/ribbons" element={
|
|
<Suspense fallback={null}>
|
|
<Ribbons />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/spinners" element={
|
|
<Suspense fallback={null}>
|
|
<Spinners />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/tabs" element={
|
|
<Suspense fallback={null}>
|
|
<Tabs />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/tooltips" element={
|
|
<Suspense fallback={null}>
|
|
<Tooltips />
|
|
</Suspense>
|
|
} />
|
|
<Route path="/ui-elements/videos" element={
|
|
<Suspense fallback={null}>
|
|
<Videos />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Components (Showcase Page) */}
|
|
<Route path="/components" element={
|
|
<Suspense fallback={null}>
|
|
<Components />
|
|
</Suspense>
|
|
} />
|
|
|
|
{/* Redirect old notification route */}
|
|
<Route path="/notifications" element={
|
|
<Suspense fallback={null}>
|
|
<Notifications />
|
|
</Suspense>
|
|
} />
|
|
</Route>
|
|
|
|
{/* Fallback Route */}
|
|
<Route path="*" element={<NotFound />} />
|
|
</Routes>
|
|
</HelmetProvider>
|
|
</Router>
|
|
</>
|
|
);
|
|
}
|