diff --git a/src/components/AuthLoader.astro b/src/components/AuthLoader.astro new file mode 100644 index 0000000..cd58650 --- /dev/null +++ b/src/components/AuthLoader.astro @@ -0,0 +1,278 @@ +--- +/** + * AuthLoader Component + * + * Provides a loading state for authentication-protected pages to prevent + * flashing of content before auth verification completes. + * + * Usage: + * - Wraps the content of pages that require authentication + * - Shows a loading spinner while auth is being verified server-side + * - Prevents flash of unauthenticated content + */ + +export interface Props { + /** Custom loading message */ + message?: string; + /** Show minimal loader without background */ + minimal?: boolean; +} + +const { + message = "Verifying authentication...", + minimal = false +} = Astro.props; +--- + +
+ {minimal ? ( + +
+
+ {message} +
+ ) : ( + +
+
+
+
+

Authenticating

+

{message}

+
+
+
+ )} + + + +
+ + + + \ No newline at end of file diff --git a/src/lib/supabase-ssr.ts b/src/lib/supabase-ssr.ts index 00d7951..f6d27c4 100644 --- a/src/lib/supabase-ssr.ts +++ b/src/lib/supabase-ssr.ts @@ -6,13 +6,19 @@ export function createSupabaseServerClient( cookies: AstroCookies, cookieOptions?: CookieOptions ) { - // Default cookie options for Docker/localhost environment + // Environment-aware cookie configuration + const isProduction = import.meta.env.PROD || process.env.NODE_ENV === 'production'; + + // For Docker/localhost, always use non-secure cookies + // In production, this will be overridden to use secure cookies + const useSecureCookies = isProduction; + const defaultCookieOptions: CookieOptions = { - secure: false, // localhost is non-HTTPS in Docker - sameSite: 'lax', // allow cross-site cookie on navigation - path: '/', // root-wide access - httpOnly: true, // JS-inaccessible for security - maxAge: 60 * 60 * 24 * 7, // 7 days + secure: useSecureCookies, // secure in production, non-secure for localhost + sameSite: 'lax', // allow cross-site cookie on navigation + path: '/', // root-wide access + httpOnly: true, // JS-inaccessible for security + maxAge: 60 * 60 * 24 * 7, // 7 days }; return createServerClient( diff --git a/src/pages/dashboard.astro b/src/pages/dashboard.astro index 9f2d7e1..8c37aab 100644 --- a/src/pages/dashboard.astro +++ b/src/pages/dashboard.astro @@ -1,6 +1,7 @@ --- import Layout from '../layouts/Layout.astro'; import Navigation from '../components/Navigation.astro'; +import AuthLoader from '../components/AuthLoader.astro'; import { verifyAuth } from '../lib/auth'; // Enable server-side rendering for auth checks @@ -14,6 +15,7 @@ if (!auth) { --- +