feat(routes): implement lazy loading and suspense fallback for route components

- Refactored account setup, admin center, reporting, and settings routes to utilize React's lazy loading for improved performance.
- Wrapped route components in Suspense with a fallback UI to enhance user experience during loading states.
- Removed unused drag-and-drop CSS file to clean up the codebase.
This commit is contained in:
chamikaJ
2025-07-03 10:34:06 +05:30
parent c19c1c2f34
commit e26f16bbc2
13 changed files with 104 additions and 79 deletions

View File

@@ -1,11 +1,11 @@
import React, { ReactNode } from 'react';
import OverviewReports from '@/pages/reporting/overview-reports/overview-reports';
import ProjectsReports from '@/pages/reporting/projects-reports/projects-reports';
import MembersReports from '@/pages/reporting/members-reports/members-reports';
import OverviewTimeReports from '@/pages/reporting/timeReports/overview-time-reports';
import ProjectsTimeReports from '@/pages/reporting/timeReports/projects-time-reports';
import MembersTimeReports from '@/pages/reporting/timeReports/members-time-reports';
import EstimatedVsActualTimeReports from '@/pages/reporting/timeReports/estimated-vs-actual-time-reports';
import React, { ReactNode, lazy } from 'react';
const OverviewReports = lazy(() => import('@/pages/reporting/overview-reports/overview-reports'));
const ProjectsReports = lazy(() => import('@/pages/reporting/projects-reports/projects-reports'));
const MembersReports = lazy(() => import('@/pages/reporting/members-reports/members-reports'));
const OverviewTimeReports = lazy(() => import('@/pages/reporting/timeReports/overview-time-reports'));
const ProjectsTimeReports = lazy(() => import('@/pages/reporting/timeReports/projects-time-reports'));
const MembersTimeReports = lazy(() => import('@/pages/reporting/timeReports/members-time-reports'));
const EstimatedVsActualTimeReports = lazy(() => import('@/pages/reporting/timeReports/estimated-vs-actual-time-reports'));
// Type definition for a menu item
export type ReportingMenuItems = {

View File

@@ -13,20 +13,20 @@ import {
UserSwitchOutlined,
BulbOutlined,
} from '@ant-design/icons';
import React, { ReactNode } from 'react';
import ProfileSettings from '../../pages/settings/profile/profile-settings';
import NotificationsSettings from '../../pages/settings/notifications/notifications-settings';
import ClientsSettings from '../../pages/settings/clients/clients-settings';
import JobTitlesSettings from '@/pages/settings/job-titles/job-titles-settings';
import LabelsSettings from '../../pages/settings/labels/labels-settings';
import CategoriesSettings from '../../pages/settings/categories/categories-settings';
import ProjectTemplatesSettings from '@/pages/settings/project-templates/project-templates-settings';
import TaskTemplatesSettings from '@/pages/settings/task-templates/task-templates-settings';
import TeamMembersSettings from '@/pages/settings/team-members/team-members-settings';
import TeamsSettings from '../../pages/settings/teams/teams-settings';
import ChangePassword from '@/pages/settings/change-password/change-password';
import LanguageAndRegionSettings from '@/pages/settings/language-and-region/language-and-region-settings';
import AppearanceSettings from '@/pages/settings/appearance/appearance-settings';
import React, { ReactNode, lazy } from 'react';
const ProfileSettings = lazy(() => import('../../pages/settings/profile/profile-settings'));
const NotificationsSettings = lazy(() => import('../../pages/settings/notifications/notifications-settings'));
const ClientsSettings = lazy(() => import('../../pages/settings/clients/clients-settings'));
const JobTitlesSettings = lazy(() => import('@/pages/settings/job-titles/job-titles-settings'));
const LabelsSettings = lazy(() => import('../../pages/settings/labels/labels-settings'));
const CategoriesSettings = lazy(() => import('../../pages/settings/categories/categories-settings'));
const ProjectTemplatesSettings = lazy(() => import('@/pages/settings/project-templates/project-templates-settings'));
const TaskTemplatesSettings = lazy(() => import('@/pages/settings/task-templates/task-templates-settings'));
const TeamMembersSettings = lazy(() => import('@/pages/settings/team-members/team-members-settings'));
const TeamsSettings = lazy(() => import('../../pages/settings/teams/teams-settings'));
const ChangePassword = lazy(() => import('@/pages/settings/change-password/change-password'));
const LanguageAndRegionSettings = lazy(() => import('@/pages/settings/language-and-region/language-and-region-settings'));
const AppearanceSettings = lazy(() => import('@/pages/settings/appearance/appearance-settings'));
// type of menu item in settings sidebar
type SettingMenuItems = {