local authentication placeholder

src/app/LocalAuthPlaceholder.tsx

@@ -0,0 +1,61 @@
+import { Box, Button, CssBaseline, Paper, Stack, Typography } from '@mui/material'
+import { getName } from 'services/whiteLabel'
+
+export type LocalAuthPlaceholderReason = 'unconfigured' | 'insecure_origin'
+
+interface Props {
+  /** Why cloud Auth0 was skipped — copy differs when env is set but the page is not a secure context (e.g. http://LAN IP). */
+  reason?: LocalAuthPlaceholderReason
+}
+
+/**
+ * Shown when Auth0 is not used (missing config and/or non–secure context).
+ * Replace with backend-driven login once local auth is implemented.
+ */
+export default function LocalAuthPlaceholder(props: Props) {
+  const { reason = 'unconfigured' } = props
+  const productName = getName()
+
+  const explanation =
+    reason === 'insecure_origin'
+      ? 'This URL is not a secure context for cloud sign-in (Auth0 requires HTTPS, localhost, or 127.0.0.1). Use local account sign-in here instead once it is connected.'
+      : 'Cloud sign-in (Auth0) is not configured for this deployment. Local account sign-in will be available here.'
+
+  return (
+    <>
+      <CssBaseline />
+      <Box
+        sx={{
+          minHeight: '100vh',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          bgcolor: 'background.default',
+          p: 2,
+        }}
+      >
+        <Paper elevation={2} sx={{ maxWidth: 420, width: '100%', p: 4 }}>
+          <Stack spacing={3} alignItems="stretch">
+            <Typography variant="h5" component="h1">
+              {productName}
+            </Typography>
+            <Typography variant="body2" color="text.secondary">
+              {explanation}
+            </Typography>
+            <Stack spacing={1.5}>
+              <Button variant="contained" size="large" disabled>
+                Log in
+              </Button>
+              <Button variant="outlined" size="large" disabled>
+                Sign up
+              </Button>
+            </Stack>
+            <Typography variant="caption" color="text.secondary">
+              Buttons are placeholders until the backend login flow is wired up.
+            </Typography>
+          </Stack>
+        </Paper>
+      </Box>
+    </>
+  )
+}

src/utils/auth0Config.ts

@@ -0,0 +1,24 @@
+import { getWhitelabel } from 'services/whiteLabel'
+
+/** True when Auth0 env + whitelabel client ID are present; avoids mounting Auth0Provider on offline / local LAN builds. */
+export function isAuth0Configured(): boolean {
+  const wl = getWhitelabel()
+  const domain = String(import.meta.env.VITE_AUTH0_CLIENT_DOMAIN ?? '').trim()
+  const clientRaw = wl.auth0ClientId ?? import.meta.env.VITE_AUTH0_CLIENT_ID
+  const clientId = String(clientRaw ?? '').trim()
+  return domain.length > 0 && clientId.length > 0
+}
+
+/**
+ * auth0-spa-js only runs in a "secure context" (HTTPS, http://localhost, http://127.0.0.1, etc.).
+ * Plain http://192.168.x.x fails — same check as `window.isSecureContext`.
+ */
+export function isAuth0SpaOriginAllowed(): boolean {
+  if (typeof window === 'undefined') return true
+  return window.isSecureContext
+}
+
+/** Mount Auth0 only when credentials exist and the browser will let the SDK run. */
+export function shouldMountAuth0Provider(): boolean {
+  return isAuth0Configured() && isAuth0SpaOriginAllowed()
+}