From 62acc9c53fa732573f5e09c001e32ea2e98ecc36 Mon Sep 17 00:00:00 2001 From: Theodore Li Date: Wed, 1 Jul 2026 16:20:40 -0700 Subject: [PATCH] fix(interfaces): always-light public surfaces (chat, resume, file shares, unsubscribe, invite) with emcn components (#5336) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(interfaces): pin deployed chat + resume to light mode, emcn-only components * fix(interfaces): review feedback — formErrors dep in field renderer, keep overlay tint on attachment remove * improvement(interfaces): chat header uses the platform SimWordmark instead of the svg asset * fix(interfaces): light mode for file-share gates, unsubscribe, and invite surfaces --- .../(auth)/components/auth-background-svg.tsx | 93 --- .../app/(auth)/components/auth-background.tsx | 17 - .../(auth)/components/auth-button-classes.ts | 9 +- .../(auth)/components/auth-submit-button.tsx | 5 +- .../(interfaces)/chat/[identifier]/chat.tsx | 2 +- .../chat/[identifier]/loading.tsx | 2 +- .../components/error-state/error-state.tsx | 8 +- .../chat/components/header/header.tsx | 18 +- .../chat/components/input/input.tsx | 66 +- .../loading-state/loading-state.tsx | 2 +- .../message-container/message-container.tsx | 11 +- .../message/components/file-download.tsx | 29 +- .../message/components/markdown-renderer.tsx | 48 +- .../chat/components/message/message.tsx | 53 +- .../voice-interface/voice-interface.tsx | 25 +- .../[executionId]/resume-page-client.tsx | 772 +++++++----------- .../app/_shell/providers/theme-provider.tsx | 4 +- .../app/f/[token]/public-file-auth-shell.tsx | 39 +- apps/sim/app/f/[token]/public-file-auth.tsx | 25 +- .../app/f/[token]/public-file-email-auth.tsx | 49 +- .../app/f/[token]/public-file-sso-auth.tsx | 21 +- apps/sim/app/f/[token]/public-file-view.tsx | 23 +- .../sim/app/invite/components/status-card.tsx | 72 +- apps/sim/app/unsubscribe/unsubscribe.tsx | 98 +-- apps/sim/ee/sso/components/sso-auth.tsx | 17 +- apps/sim/ee/sso/components/sso-form.tsx | 17 +- 26 files changed, 564 insertions(+), 961 deletions(-) delete mode 100644 apps/sim/app/(auth)/components/auth-background-svg.tsx delete mode 100644 apps/sim/app/(auth)/components/auth-background.tsx diff --git a/apps/sim/app/(auth)/components/auth-background-svg.tsx b/apps/sim/app/(auth)/components/auth-background-svg.tsx deleted file mode 100644 index aebbe483e1..0000000000 --- a/apps/sim/app/(auth)/components/auth-background-svg.tsx +++ /dev/null @@ -1,93 +0,0 @@ -export default function AuthBackgroundSVG() { - return ( - <> - {/* Top-left card outline */} - - - {/* Top-right card outline */} - - - {/* Bottom-left card outline (mirrored) */} - - - {/* Bottom-right card outline (mirrored) */} - - - ) -} diff --git a/apps/sim/app/(auth)/components/auth-background.tsx b/apps/sim/app/(auth)/components/auth-background.tsx deleted file mode 100644 index fedca77f53..0000000000 --- a/apps/sim/app/(auth)/components/auth-background.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import { cn } from '@sim/emcn' -import AuthBackgroundSVG from '@/app/(auth)/components/auth-background-svg' - -type AuthBackgroundProps = { - className?: string - children?: React.ReactNode -} - -export default function AuthBackground({ className, children }: AuthBackgroundProps) { - return ( -
-
- -
{children}
-
- ) -} diff --git a/apps/sim/app/(auth)/components/auth-button-classes.ts b/apps/sim/app/(auth)/components/auth-button-classes.ts index 95a3592fe9..6b392632de 100644 --- a/apps/sim/app/(auth)/components/auth-button-classes.ts +++ b/apps/sim/app/(auth)/components/auth-button-classes.ts @@ -1,10 +1,3 @@ -/** Shared className for primary auth/status CTA buttons on dark auth surfaces. */ -export const AUTH_PRIMARY_CTA_BASE = - 'inline-flex h-[32px] items-center justify-center gap-2 rounded-[5px] border border-[var(--auth-primary-btn-border)] bg-[var(--auth-primary-btn-bg)] px-2.5 font-[430] font-season text-[var(--auth-primary-btn-text)] text-sm transition-colors hover:border-[var(--auth-primary-btn-hover-border)] hover:bg-[var(--auth-primary-btn-hover-bg)] hover:text-[var(--auth-primary-btn-hover-text)] disabled:cursor-not-allowed disabled:opacity-50' as const - -/** Full-width variant used for primary auth form submit buttons. */ -export const AUTH_SUBMIT_BTN = `${AUTH_PRIMARY_CTA_BASE} w-full` as const - -/** Shared className for inline auth action links on dark auth surfaces. */ +/** Shared className for inline auth action links. */ export const AUTH_TEXT_LINK = 'font-medium text-[var(--brand-accent)] underline-offset-4 transition hover:text-[var(--brand-accent-hover)] hover:underline disabled:cursor-not-allowed disabled:opacity-50' as const diff --git a/apps/sim/app/(auth)/components/auth-submit-button.tsx b/apps/sim/app/(auth)/components/auth-submit-button.tsx index c08cb3249a..ae9004b818 100644 --- a/apps/sim/app/(auth)/components/auth-submit-button.tsx +++ b/apps/sim/app/(auth)/components/auth-submit-button.tsx @@ -14,9 +14,8 @@ interface AuthSubmitButtonProps { /** * The canonical full-width primary auth action — a `primary`-variant {@link Chip} - * with the shared in-flight spinner. Replaces the legacy dark - * `AUTH_SUBMIT_BTN` class string for every in-scope auth submit (login, signup, - * verify, reset), so the primary CTA chrome lives in exactly one place. + * with the shared in-flight spinner, so the primary CTA chrome lives in + * exactly one place. */ export function AuthSubmitButton({ children, diff --git a/apps/sim/app/(interfaces)/chat/[identifier]/chat.tsx b/apps/sim/app/(interfaces)/chat/[identifier]/chat.tsx index 6d4a9435a6..49f71d7927 100644 --- a/apps/sim/app/(interfaces)/chat/[identifier]/chat.tsx +++ b/apps/sim/app/(interfaces)/chat/[identifier]/chat.tsx @@ -426,7 +426,7 @@ export default function ChatClient({ identifier }: { identifier: string }) { } return ( -
+
{/* Header component */} diff --git a/apps/sim/app/(interfaces)/chat/[identifier]/loading.tsx b/apps/sim/app/(interfaces)/chat/[identifier]/loading.tsx index 9b032730a1..8f55e4c555 100644 --- a/apps/sim/app/(interfaces)/chat/[identifier]/loading.tsx +++ b/apps/sim/app/(interfaces)/chat/[identifier]/loading.tsx @@ -2,7 +2,7 @@ import { Skeleton } from '@sim/emcn' export default function ChatLoading() { return ( -
+
diff --git a/apps/sim/app/(interfaces)/chat/components/error-state/error-state.tsx b/apps/sim/app/(interfaces)/chat/components/error-state/error-state.tsx index 23cbd1789e..8d14e3a1ee 100644 --- a/apps/sim/app/(interfaces)/chat/components/error-state/error-state.tsx +++ b/apps/sim/app/(interfaces)/chat/components/error-state/error-state.tsx @@ -1,5 +1,6 @@ 'use client' +import { Button } from '@sim/emcn' import { useRouter } from 'next/navigation' interface ChatErrorStateProps { @@ -16,12 +17,13 @@ export function ChatErrorState({ error }: ChatErrorStateProps) { Chat Unavailable

{error}

- +
) diff --git a/apps/sim/app/(interfaces)/chat/components/header/header.tsx b/apps/sim/app/(interfaces)/chat/components/header/header.tsx index cbe6e74c2f..014c103ca6 100644 --- a/apps/sim/app/(interfaces)/chat/components/header/header.tsx +++ b/apps/sim/app/(interfaces)/chat/components/header/header.tsx @@ -3,6 +3,7 @@ import Image from 'next/image' import Link from 'next/link' import { GithubIcon } from '@/components/icons' +import { SimWordmark } from '@/app/(landing)/components/navbar/components' import { useBrandConfig } from '@/ee/whitelabeling' interface ChatHeaderProps { @@ -20,13 +21,12 @@ interface ChatHeaderProps { export function ChatHeader({ chatConfig, starCount }: ChatHeaderProps) { const brand = useBrandConfig() - const primaryColor = chatConfig?.customizations?.primaryColor || 'var(--brand)' const customImage = chatConfig?.customizations?.imageUrl || chatConfig?.customizations?.logoUrl return (