From 8d926332ab23aa5785def636aca9d0a52fea4a65 Mon Sep 17 00:00:00 2001 From: ishaanxgupta <124028055+ishaanxgupta@users.noreply.github.com> Date: Thu, 16 Jul 2026 01:57:51 +0000 Subject: [PATCH] company brain responsiveness (#1239) ## Summary - Improves the Company Brain header and stats cards on mobile without changing the desktop layout intent. - Tightens the mobile Slack banner so the Slack logo is not duplicated and the card stays compact. - Centers the onboarding step flow and card as one stack while keeping the logo independent. before: image after: image image image image --- apps/web/app/(app)/onboarding/page.tsx | 4 -- .../components/brain-home/brain-home-view.tsx | 49 ++++++++++++++++--- .../brain-home/connections-board.tsx | 36 ++++++++------ apps/web/components/company-brain-header.tsx | 16 +++--- .../company-brain-onboarding.tsx | 44 +++++++++++------ .../web/components/onboarding-brain/shell.tsx | 23 +++++---- .../onboarding-brain/step-sources.tsx | 45 +++++++++-------- .../components/onboarding-brain/step-team.tsx | 38 +++++++------- 8 files changed, 156 insertions(+), 99 deletions(-) diff --git a/apps/web/app/(app)/onboarding/page.tsx b/apps/web/app/(app)/onboarding/page.tsx index 49718943..4b5af4a3 100644 --- a/apps/web/app/(app)/onboarding/page.tsx +++ b/apps/web/app/(app)/onboarding/page.tsx @@ -86,8 +86,6 @@ export default function BrainOnboardingPage() { () => workspaceDomainFromEmail(user?.email), [user?.email], ) - - // Team (Company Brain) onboarding is gated behind a private-beta flag. const allowTeam = useFeatureFlagEnabled("company-brain-beta") ?? false const [mode, setMode] = useState(detectedMode) const [about, setAbout] = useState({ @@ -339,8 +337,6 @@ export default function BrainOnboardingPage() { setCreatingOrg(false) } }, [ensureOrg, goNext, forceCreate, organizations, router]) - - // Company Brain (team) onboarding is a single research surface, no stepper. const isCompanyBrain = allowTeam && mode === "team" const handleBrainConfirm = useCallback( diff --git a/apps/web/components/brain-home/brain-home-view.tsx b/apps/web/components/brain-home/brain-home-view.tsx index 3be036fc..495bdcf0 100644 --- a/apps/web/components/brain-home/brain-home-view.tsx +++ b/apps/web/components/brain-home/brain-home-view.tsx @@ -219,7 +219,7 @@ function StatsRow({ + )} ))} ) } +function MobileStatLabel({ label }: { label: string }) { + const mobile = + label === "Connected sources" + ? "Sources" + : label === "Active members" + ? "Members" + : label + + return ( + <> + {mobile} + {label} + + ) +} + function RecentMemories({ docs, loading, diff --git a/apps/web/components/brain-home/connections-board.tsx b/apps/web/components/brain-home/connections-board.tsx index 7f39f183..4f7be0b6 100644 --- a/apps/web/components/brain-home/connections-board.tsx +++ b/apps/web/components/brain-home/connections-board.tsx @@ -411,7 +411,7 @@ function TileSkeleton({ showDivider = false }: { showDivider?: boolean }) { function SlackBanner() { return (
-
-
+
+
- +

- Company Brain in Slack + Slack agent + Company Brain in Slack

-

- Install Supermemory so your team can{" "} - @supermemory in any - channel. +

+ + Ask @supermemory from + any channel. + + + Install Supermemory so your team can{" "} + @supermemory in any + channel. +

- - Add to Slack + + Add + Add to Slack
diff --git a/apps/web/components/company-brain-header.tsx b/apps/web/components/company-brain-header.tsx index 41ccb1c4..cde0cd77 100644 --- a/apps/web/components/company-brain-header.tsx +++ b/apps/web/components/company-brain-header.tsx @@ -184,16 +184,16 @@ export function CompanyBrainHeader({ onOpenSearch }: CompanyBrainHeaderProps) { }, [setFeedbackOpen]) return ( -
-
+
+
diff --git a/apps/web/components/onboarding-brain/company-brain-onboarding.tsx b/apps/web/components/onboarding-brain/company-brain-onboarding.tsx index 1a709f0c..64937900 100644 --- a/apps/web/components/onboarding-brain/company-brain-onboarding.tsx +++ b/apps/web/components/onboarding-brain/company-brain-onboarding.tsx @@ -43,12 +43,21 @@ const BACKEND = type Phase = "confirm" | "research" function normalizeDomain(input: string): string { - return input + const host = input .trim() .toLowerCase() .replace(/^https?:\/\//, "") .replace(/^www\./, "") .replace(/\/.*$/, "") + + // The confirmation card is often filled with a company name (for example, + // "Zomato") even though research needs a hostname. Preserve explicit TLDs, + // and make the common single-label case usable without a failed API round trip. + if (/^[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?$/.test(host)) { + return `${host}.com` + } + + return host } export function CompanyBrainOnboarding({ @@ -306,30 +315,35 @@ function DockedHeader({ }) { const brandName = workspaceNameFromDomain(domain) || domain return ( -
+
- - {brandName} - - - {done ? "Company Brain ready" : "Building your Company Brain…"} - +
+ + {brandName} + + + {done ? "Company Brain ready" : "Building your Company Brain…"} + +
{done ? ( ) : ( - + )}
) diff --git a/apps/web/components/onboarding-brain/shell.tsx b/apps/web/components/onboarding-brain/shell.tsx index f2eb9f8a..9044ea08 100644 --- a/apps/web/components/onboarding-brain/shell.tsx +++ b/apps/web/components/onboarding-brain/shell.tsx @@ -19,7 +19,7 @@ export function BrainShell({ step, steps, children }: ShellProps) { return (
@@ -46,20 +46,25 @@ export function BrainShell({ step, steps, children }: ShellProps) { }} /> -
- - +
+ +
+ +
+
+ +
-
+
{!isLast && ( -
+
-
-
+
+
+

-
+
{mode === "personal" ? ( <> -
+
@@ -591,7 +591,7 @@ export function StepSources({
{moreOpen ? ( -
+
-

+

Paste multiple emails at once — we'll split them for you.

{count === 0 ? ( -
+

No invites yet.

@@ -242,11 +242,11 @@ export function StepTeam({
)}
-
+
{values.invites.map((inv) => (
@@ -263,7 +263,7 @@ export function StepTeam({ setRole(inv.email, r as "admin" | "member") } > - + @@ -295,12 +295,12 @@ export function StepTeam({ )} -
+
@@ -308,7 +308,7 @@ export function StepTeam({ variant="insideOut" onClick={onContinue} disabled={submitting} - className="rounded-full px-5 py-[10px] text-[13px] font-medium text-[#fafafa]" + className="rounded-full px-4 py-2 text-[13px] font-medium text-[#fafafa] md:px-5 md:py-[10px]" > {submitting ? ( <>