feat(web): surface Company Brain to personal-brain users (#1370)

Adds a dismissible Company Brain card to the dashboard header slot and a permanent entry in the profile menu for users whose org has no company brain, both linking to team onboarding.

Onboarding now honours ?mode=team so a personal-domain email arriving from those CTAs isn't routed to personal onboarding.

Fixes ENG-1132

apps/web/app/(app)/onboarding/page.tsx

@@ -64,6 +64,9 @@ export default function BrainOnboardingPage() {
 
 	// `?new=1` forces creating an additional org even when the user already has one.
 	const forceCreate = params?.get("new") === "1"
+	// ensureOrg strips `new` once the org exists, so latch it for `finish`'s reload.
+	const forcedCreateRef = useRef(forceCreate)
+	if (forceCreate) forcedCreateRef.current = true
 	const nameParam = params?.get("name")?.trim() || ""
 
 	const stepFromUrl = (params?.get("step") as BrainStep | null) ?? "about"
@@ -73,9 +76,12 @@ export default function BrainOnboardingPage() {
 
 	const [step, setStep] = useState<BrainStep>(initialStep)
 
+	// `?mode=team` wins over email detection so a personal-domain user arriving
+	// from a "set up a Company Brain" CTA doesn't land in personal onboarding.
+	const modeParam = params?.get("mode") === "team" ? "team" : null
 	const detectedMode = useMemo(
-		() => detectModeFromEmail(user?.email),
-		[user?.email],
+		() => modeParam ?? detectModeFromEmail(user?.email),
+		[modeParam, user?.email],
 	)
 	const suggestedWorkspaceName = useMemo(
 		() => workspaceNameFromEmail(user?.email),
@@ -113,12 +119,12 @@ export default function BrainOnboardingPage() {
 				sources?: SourcesValues
 				team?: TeamValues
 			}
-			if (cached.mode) setMode(cached.mode)
+			if (cached.mode && !modeParam) setMode(cached.mode)
 			if (cached.about) setAbout((a) => ({ ...a, ...cached.about }))
 			if (cached.sources) setSources((s) => ({ ...s, ...cached.sources }))
 			if (cached.team) setTeam((t) => ({ ...t, ...cached.team }))
 		} catch {}
-	}, [forceCreate])
+	}, [forceCreate, modeParam])
 
 	useEffect(() => {
 		try {
@@ -209,12 +215,12 @@ export default function BrainOnboardingPage() {
 			localStorage.removeItem(STORAGE_KEY)
 		} catch {}
 		// Extra org from settings: hard-reload so org-scoped caches don't show the previous org's data.
-		if (forceCreate) {
+		if (forcedCreateRef.current) {
 			window.location.href = "/?onboarded=1"
 			return
 		}
 		router.push("/?onboarded=1")
-	}, [router, mode, sources, team, forceCreate])
+	}, [router, mode, sources, team])
 
 	const goNext = useCallback(() => {
 		const idx = steps.indexOf(step)

apps/web/components/app-experience.tsx

@@ -16,6 +16,7 @@ import { ChatSidebar, HomeChatComposer } from "@/components/chat"
 import type { ChatAttachmentDraft } from "@/components/chat/attachments"
 import { DashboardView } from "@/components/dashboard-view"
 import { BrainHomeView } from "@/components/brain-home/brain-home-view"
+import { CompanyBrainPromo } from "@/components/company-brain-promo"
 import { useHasCompanyBrain } from "@/hooks/use-company-brain"
 import { MemoriesGrid } from "@/components/memories-grid"
 import { GraphLayoutView } from "@/components/graph-layout-view"
@@ -802,7 +803,7 @@ export function AppExperience() {
 								) : (
 									<DashboardView
 										spaceLabel={dashboardSpaceLabel}
-										headerNotice={undefined}
+										headerNotice={<CompanyBrainPromo />}
 										highlights={highlightsData?.highlights ?? []}
 										isLoadingHighlights={isLoadingHighlights}
 										onAddMemory={handleAddMemory}

apps/web/components/company-brain-promo.tsx

@@ -0,0 +1,89 @@
+"use client"
+
+import { useEffect, useState } from "react"
+import { useRouter } from "next/navigation"
+import { ArrowRight, XIcon } from "lucide-react"
+import { Logo } from "@ui/assets/Logo"
+import { Button } from "@repo/ui/components/button"
+import { cn } from "@lib/utils"
+import { analytics } from "@/lib/analytics"
+import { dmSansClassName } from "@/lib/fonts"
+import { useHasCompanyBrain } from "@/hooks/use-company-brain"
+
+const DISMISS_KEY = "supermemory-company-brain-promo-dismissed-v1"
+
+export function CompanyBrainPromo() {
+	const router = useRouter()
+	const hasCompanyBrain = useHasCompanyBrain()
+	const [dismissed, setDismissed] = useState(true)
+
+	useEffect(() => {
+		if (hasCompanyBrain) return
+		try {
+			setDismissed(localStorage.getItem(DISMISS_KEY) === "1")
+		} catch {
+			setDismissed(false)
+		}
+	}, [hasCompanyBrain])
+
+	const visible = !hasCompanyBrain && !dismissed
+
+	useEffect(() => {
+		if (visible) analytics.companyBrainPromoSeen()
+	}, [visible])
+
+	if (!visible) return null
+
+	const dismiss = () => {
+		setDismissed(true)
+		try {
+			localStorage.setItem(DISMISS_KEY, "1")
+		} catch {}
+		analytics.companyBrainPromoDismissed()
+	}
+
+	return (
+		<div
+			className={cn(
+				"flex items-center gap-4 rounded-xl bg-surface-card/60 px-4 py-4 backdrop-blur-md",
+				"shadow-[0_12px_40px_rgba(0,0,0,0.22)]",
+				dmSansClassName(),
+			)}
+		>
+			<div className="flex size-10 shrink-0 items-center justify-center rounded-lg bg-[#0562ef]">
+				<Logo className="h-4 w-5" />
+			</div>
+			<div className="min-w-0 flex-1">
+				<p className="text-[15px] font-semibold text-[#fafafa]">
+					Give your team a Company Brain
+				</p>
+				<p className="text-[13px] text-[#a1a1a1]">
+					Lives in your Slack. Answers from your team's tools, and brings things
+					up before you ask.
+				</p>
+			</div>
+			<Button
+				className={cn(
+					"rounded-full! h-9! min-h-9 shrink-0 gap-1.5 px-3 font-medium",
+					dmSansClassName(),
+				)}
+				onClick={() => {
+					analytics.companyBrainPromoClicked({ source: "dashboard_card" })
+					router.push("/onboarding?new=1&mode=team")
+				}}
+				variant="headers"
+			>
+				Set it up
+				<ArrowRight className="size-4 shrink-0" />
+			</Button>
+			<button
+				aria-label="Dismiss"
+				type="button"
+				onClick={dismiss}
+				className="shrink-0 rounded-full p-1.5 text-[#737373] transition-colors hover:text-[#fafafa]"
+			>
+				<XIcon className="size-4" />
+			</button>
+		</div>
+	)
+}

apps/web/components/user-profile-menu.tsx

@@ -13,6 +13,7 @@ import {
 import { authClient } from "@lib/auth"
 import { useRouter } from "next/navigation"
 import {
+	Brain,
 	LogOut,
 	Settings,
 	Settings2,
@@ -22,6 +23,7 @@ import {
 	Sun,
 } from "lucide-react"
 import { cn } from "@lib/utils"
+import { analytics } from "@/lib/analytics"
 import { dmSansClassName } from "@/lib/fonts"
 import { useOrgOnboarding } from "@hooks/use-org-onboarding"
 import { useTokenUsage } from "@/hooks/use-token-usage"
@@ -164,6 +166,18 @@ export function UserProfileMenu({
 					<Settings className="size-4 text-[#737373]" />
 					Settings
 				</DropdownMenuItem>
+				{isCompanyBrain ? null : (
+					<DropdownMenuItem
+						onClick={() => {
+							analytics.companyBrainPromoClicked({ source: "profile_menu" })
+							router.push("/onboarding?new=1&mode=team")
+						}}
+						className="gap-2.5 rounded-lg px-2.5 py-2 text-sm font-medium text-white/85 hover:bg-white/[0.06] focus:bg-white/[0.06] focus:text-white cursor-pointer"
+					>
+						<Brain className="size-4 text-[#737373]" />
+						Set up Company Brain
+					</DropdownMenuItem>
+				)}
 				{isCompanyBrain ? (
 					<DropdownMenuItem
 						onClick={() => void setViewMode("configure")}

apps/web/lib/analytics.ts

@@ -257,4 +257,12 @@ export const analytics = {
 		rating: "up" | "down" | null
 		message: string
 	}) => safeCapture("digest_feedback_detail", props),
+
+	// company brain promo
+	companyBrainPromoSeen: () => safeCapture("company_brain_promo_seen"),
+	companyBrainPromoClicked: (props: {
+		source: "dashboard_card" | "profile_menu"
+	}) => safeCapture("company_brain_promo_clicked", props),
+	companyBrainPromoDismissed: () =>
+		safeCapture("company_brain_promo_dismissed"),
 }