8f1b1fb5cd
* feat(ui): replace generic building icon with company monogram in user menu The company row and switcher flyout in the sidebar user menu showed lucide Building2 for every company. Render the company's initial in a small rounded square instead (square = company, circle = person), so each company gets a mark of its own. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(mobile): touch behavior polish for the mobile web experience - kill -webkit-tap-highlight-color flash; touch-action: manipulation on interactive elements (no double-tap-to-zoom wait); user-select: none on buttons (long-press no longer enters text selection) - overscroll-behavior-y: contain on html/body: pull-to-refresh no longer hijacks list scrolling, inner scrollers stop chaining to the document (contain, not none, so iOS rubber-banding survives) - 16px font-size floor for form fields on coarse pointers: iOS Safari stops zooming into focused inputs; desktop keeps text-sm - min-h-screen -> min-h-dvh everywhere: correct height under collapsing mobile browser chrome, identical on desktop - active: variants mirror hover: on Button: Tailwind 4 gates hover: behind (hover: hover), so touch devices previously got zero pointer feedback - theme-color now tracks the app: default was a leftover blue #304D83; SSR emits white and ThemeColorSync mirrors the computed --background into the meta tag across dark mode and palette switches Hover-stuck-after-tap and viewport-fit/safe-area were already covered (Tailwind 4 hover gating; existing viewportFit: cover + safe-area utilities). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * docs: log monogram and overscroll decisions Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: Jakob Wennberg <311770904+jakobwennberg-oss@users.noreply.github.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
63 lines
2.4 KiB
TypeScript
63 lines
2.4 KiB
TypeScript
import Link from 'next/link'
|
|
import { Settings } from 'lucide-react'
|
|
import { createClient, createServiceClient } from '@/lib/supabase/server'
|
|
import OnboardingBackdrop from '@/components/onboarding/OnboardingBackdrop'
|
|
import { SessionTimeoutController } from '@/components/auth/SessionTimeoutController'
|
|
|
|
export default async function OnboardingLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode
|
|
}) {
|
|
const supabase = await createClient()
|
|
const { data: { user } } = await supabase.auth.getUser()
|
|
|
|
// Only show the settings escape hatch for users who have completed
|
|
// onboarding at least once: i.e. they have a company_members row, even if
|
|
// it points to an archived company. Absolute first-time users don't need
|
|
// it and it clutters the welcome screen.
|
|
//
|
|
// Must use the service client: RLS on company_members goes through
|
|
// user_company_ids(), which filters out archived companies, so an
|
|
// authenticated query would return nothing for a user who archived their
|
|
// last company and make the escape hatch disappear exactly when it's
|
|
// needed most. Scoped to user_id = user.id, so no cross-user exposure.
|
|
let hasCompletedOnboarding = false
|
|
if (user) {
|
|
const service = createServiceClient()
|
|
const { data } = await service
|
|
.from('company_members')
|
|
.select('company_id')
|
|
.eq('user_id', user.id)
|
|
.limit(1)
|
|
.maybeSingle()
|
|
hasCompletedOnboarding = !!data
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-dvh bg-background flex items-center justify-center">
|
|
{user && <SessionTimeoutController />}
|
|
<OnboardingBackdrop />
|
|
|
|
<div className="relative z-10 w-full max-w-lg px-5">
|
|
{children}
|
|
</div>
|
|
|
|
{/* Escape hatch: a user who archived their last company can still
|
|
reach account settings (and the delete-account flow) from here.
|
|
Hidden for absolute first-time users (no memberships ever). */}
|
|
{user && hasCompletedOnboarding && (
|
|
<Link
|
|
href="/settings/account"
|
|
aria-label="Kontoinställningar"
|
|
title="Kontoinställningar"
|
|
className="fixed bottom-6 right-6 z-50 flex h-10 w-10 items-center justify-center rounded-full border border-border bg-background/80 text-muted-foreground shadow-sm backdrop-blur transition-colors hover:border-foreground/40 hover:text-foreground"
|
|
>
|
|
<Settings className="h-4 w-4" />
|
|
</Link>
|
|
)}
|
|
|
|
</div>
|
|
)
|
|
}
|