81 lines
2.7 KiB
TypeScript
Executable File
81 lines
2.7 KiB
TypeScript
Executable File
import '../css/app.css';
|
|
import '../css/dark-mode.css';
|
|
|
|
import { createInertiaApp, router } from '@inertiajs/react';
|
|
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
|
|
import { createRoot } from 'react-dom/client';
|
|
import { initializeTheme } from './hooks/use-appearance';
|
|
import { initializeGlobalSettings } from './utils/globalSettings';
|
|
import { initPerformanceMonitoring, lazyLoadImages } from './utils/performance';
|
|
import './i18n'; // Import i18n configuration
|
|
import './utils/axios-config'; // Import axios configuration
|
|
import i18n from './i18n';
|
|
import { RootLayout } from './layouts/root-layout';
|
|
import axios from 'axios';
|
|
|
|
// Handle 419 Page Expired errors globally
|
|
router.on('invalid', (event) => {
|
|
if (event.detail.response?.status === 419) {
|
|
event.preventDefault();
|
|
|
|
// Refresh CSRF token and alert the user so they can safely retry without losing state immediately
|
|
axios.get('/sanctum/csrf-cookie').then(() => {
|
|
alert('Your session expired but has been refreshed in the background. Please try saving again.');
|
|
}).catch(() => {
|
|
window.location.reload();
|
|
});
|
|
}
|
|
});
|
|
|
|
// Initialize performance monitoring
|
|
initPerformanceMonitoring();
|
|
|
|
// Initialize lazy loading of images when DOM is ready
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
lazyLoadImages();
|
|
});
|
|
|
|
const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
|
|
|
|
createInertiaApp({
|
|
title: (title) => (title ? `${title} - ${appName}` : appName),
|
|
resolve: (name) => {
|
|
const pages = import.meta.glob('./pages/**/*.tsx');
|
|
return resolvePageComponent(`./pages/${name}.tsx`, pages).then((module: any) => {
|
|
const page = module.default;
|
|
const oldLayout = page.layout;
|
|
|
|
// Wrap every page in RootLayout to ensure global providers stay mounted
|
|
page.layout = (children: any) => {
|
|
const content = oldLayout ? oldLayout(children) : children;
|
|
return <RootLayout>{content}</RootLayout>;
|
|
};
|
|
|
|
return module;
|
|
});
|
|
},
|
|
setup({ el, App, props }) {
|
|
// Initialize global settings
|
|
const initialGlobalSettings = props.initialPage.props.globalSettings || {};
|
|
initializeGlobalSettings(initialGlobalSettings);
|
|
|
|
// Sync global page data for utilities
|
|
try { (window as any).page = props.initialPage; } catch (e) {}
|
|
|
|
const root = createRoot(el);
|
|
|
|
initializeTheme();
|
|
|
|
const render = () => root.render(<App {...props} />);
|
|
|
|
if (i18n.isInitialized) {
|
|
render();
|
|
} else {
|
|
i18n.on('initialized', render);
|
|
}
|
|
},
|
|
progress: {
|
|
color: '#4B5563',
|
|
},
|
|
});
|