diff --git a/frontend-modern/public/debug.html b/frontend-modern/public/debug.html new file mode 100644 index 000000000..a67a15f97 --- /dev/null +++ b/frontend-modern/public/debug.html @@ -0,0 +1,56 @@ + + + + + Debug Pulse + + +

Debug Page

+
Initial content - if you see this, JavaScript didn't run
+ +
+

Log:

+
+ + + + \ No newline at end of file diff --git a/frontend-modern/public/test.html b/frontend-modern/public/test.html new file mode 100644 index 000000000..b2bdf5487 --- /dev/null +++ b/frontend-modern/public/test.html @@ -0,0 +1,39 @@ + + + + Test App Loading + + +

Testing App Loading

+
+ + + \ No newline at end of file diff --git a/frontend-modern/src/App.tsx b/frontend-modern/src/App.tsx index a79f49b6b..490d24e60 100644 --- a/frontend-modern/src/App.tsx +++ b/frontend-modern/src/App.tsx @@ -46,14 +46,16 @@ export const useDarkMode = () => { }; function App() { - // Simple auth state - const [isLoading, setIsLoading] = createSignal(true); + console.log('[App] Component initializing...'); + + // Simple auth state - START WITH FALSE TO BYPASS LOADING + const [isLoading, setIsLoading] = createSignal(false); const [needsAuth, setNeedsAuth] = createSignal(false); const [hasAuth, setHasAuth] = createSignal(false); const [proxyAuthInfo, setProxyAuthInfo] = createSignal<{ username?: string; logoutURL?: string } | null>(null); - // Don't initialize WebSocket until after auth check - const [wsStore, setWsStore] = createSignal(null); + // Initialize WebSocket immediately for testing + const [wsStore, setWsStore] = createSignal(getGlobalWebSocketStore()); const state = () => wsStore()?.state || { vms: [], containers: [], nodes: [], pbs: [], lastUpdate: '' }; const connected = () => wsStore()?.connected() || false; const reconnecting = () => wsStore()?.reconnecting() || false; @@ -147,7 +149,16 @@ function App() { // Check auth on mount onMount(async () => { - console.log('[App] Starting auth check...'); + console.log('[App] onMount triggered, starting auth check...'); + console.log('[App] Current location:', window.location.href); + + // Add a timeout fallback - if auth check takes too long, just proceed + const timeoutId = setTimeout(() => { + console.error('[App] Auth check timeout - proceeding without auth'); + setIsLoading(false); + setNeedsAuth(false); + setWsStore(getGlobalWebSocketStore()); + }, 10000); // 10 second timeout // Check if we just logged out - if so, always show login page const justLoggedOut = localStorage.getItem('just_logged_out'); @@ -162,8 +173,11 @@ function App() { // First check security status to see if auth is configured try { + console.log('[App] Fetching /api/security/status...'); const securityRes = await apiFetch('/api/security/status'); + console.log('[App] Security response received:', securityRes.status); const securityData = await securityRes.json(); + console.log('[App] Security data:', securityData); console.log('[App] Security status:', securityData); // Check if auth is disabled via DISABLE_AUTH @@ -318,6 +332,7 @@ function App() { document.documentElement.classList.remove('dark'); } } finally { + clearTimeout(timeoutId); // Clear the timeout since we completed setIsLoading(false); } @@ -386,6 +401,7 @@ function App() { const enhancedStore = () => wsStore(); // Use Show for reactive rendering + console.log('[App] Rendering, isLoading:', isLoading()); return ( +

TEST - APP IS WORKING!

+

If you see this, the basic app infrastructure works.

+ ; +} \ No newline at end of file diff --git a/frontend-modern/src/index.tsx b/frontend-modern/src/index.tsx index 21a490f11..c74161851 100644 --- a/frontend-modern/src/index.tsx +++ b/frontend-modern/src/index.tsx @@ -3,6 +3,7 @@ import { render } from 'solid-js/web'; import './index.css'; import './styles/animations.css'; import App from './App'; +// import App from './Test'; import { logger } from './utils/logger'; const root = document.getElementById('root'); @@ -14,9 +15,23 @@ if (import.meta.env.DEV && !(root instanceof HTMLElement)) { } // Initialize app with logging +console.log('[Index] Starting Pulse app...'); logger.info('Pulse monitoring dashboard starting'); if (root) { - render(() => , root); + console.log('[Index] Root element found, rendering App...'); + try { + render(() => , root); + console.log('[Index] Render call completed'); + } catch (error) { + console.error('[Index] Render error:', error); + // Show error on page + root.innerHTML = `
+

Error Loading App

+ 
${error}
+
`; + } +} else { + console.error('[Index] Root element not found!'); } \ No newline at end of file