mirror of
https://github.com/simstudioai/sim.git
synced 2026-04-06 03:00:16 -04:00
680c9cddf0
* fix(sidebar): show icon-sized skeletons in collapsed settings sidebar * fix(sidebar): hide expanded skeletons during pre-hydration in collapsed settings * fix(sidebar): align collapsed settings skeletons with actual icon positions * fix(sidebar): match collapsed skeleton section grouping with loaded layout * fix(sidebar): hoist skeleton section counts to module constant * improvement(ui): align all public pages with dark landing theme and improve whitelabeling * fix(ui): address PR review comments - restore StatusPageLayout wrapper, improve whitelabel detection * fix(ui): add missing dark class to 404 page, add relative positioning to invite layout * fix(ui): fallback to white button when whitelabeled without primary color * improvement(seo): add x-default hreflang, speakable schema to landing and blog posts * fix(ui): fix OTP/input light-mode styles and add missing header classes on standalone auth pages * undo hardcoded ff config * update old components/ui usage to emcn * fix(ui): add SupportFooter to InviteLayout, remove duplicates from unsubscribe page * fix(ui): fix invite layout flex centering, use BrandedButton on 404 page * fix(ui): fix OTP group styling, props spread order in BrandedButton, invite header shrink-0 * fix: enterprise hydration error --------- Co-authored-by: Emir Karabeg <emirkarabeg@berkeley.edu>
85 lines
2.6 KiB
TypeScript
85 lines
2.6 KiB
TypeScript
'use client'
|
|
|
|
import Image from 'next/image'
|
|
import Link from 'next/link'
|
|
import { GithubIcon } from '@/components/icons'
|
|
import { useBrandConfig } from '@/ee/whitelabeling'
|
|
|
|
interface ChatHeaderProps {
|
|
chatConfig: {
|
|
title?: string
|
|
customizations?: {
|
|
headerText?: string
|
|
logoUrl?: string
|
|
imageUrl?: string
|
|
primaryColor?: string
|
|
}
|
|
} | null
|
|
starCount: string
|
|
}
|
|
|
|
export function ChatHeader({ chatConfig, starCount }: ChatHeaderProps) {
|
|
const brand = useBrandConfig()
|
|
const primaryColor = chatConfig?.customizations?.primaryColor || 'var(--brand-primary-hex)'
|
|
const customImage = chatConfig?.customizations?.imageUrl || chatConfig?.customizations?.logoUrl
|
|
|
|
return (
|
|
<nav
|
|
aria-label='Chat navigation'
|
|
className={`flex w-full items-center justify-between px-4 pt-[12px] pb-[21px] sm:px-8 sm:pt-[8.5px] md:px-[44px] md:pt-[16px]`}
|
|
>
|
|
<div className='flex items-center gap-[34px]'>
|
|
<div className='flex items-center gap-3'>
|
|
{customImage && (
|
|
<Image
|
|
src={customImage}
|
|
alt={`${chatConfig?.title || 'Chat'} logo`}
|
|
width={24}
|
|
height={24}
|
|
unoptimized
|
|
className='h-6 w-6 rounded-md object-cover'
|
|
/>
|
|
)}
|
|
<h2 className='font-medium text-[18px] text-foreground'>
|
|
{chatConfig?.customizations?.headerText || chatConfig?.title || 'Chat'}
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
|
|
{!brand.logoUrl && (
|
|
<div className='flex items-center gap-[16px]'>
|
|
<a
|
|
href='https://github.com/simstudioai/sim'
|
|
target='_blank'
|
|
rel='noopener noreferrer'
|
|
className='flex items-center gap-2 text-[16px] text-muted-foreground transition-colors hover:text-foreground'
|
|
aria-label={`GitHub repository - ${starCount} stars`}
|
|
>
|
|
<GithubIcon className='h-[16px] w-[16px]' aria-hidden='true' />
|
|
<span aria-live='polite'>{starCount}</span>
|
|
</a>
|
|
{/* Only show Sim logo if no custom branding is set */}
|
|
|
|
<Link
|
|
href='https://sim.ai'
|
|
target='_blank'
|
|
rel='noopener noreferrer'
|
|
aria-label='Sim home'
|
|
>
|
|
<Image
|
|
src='/logo/b&w/text/small.png'
|
|
alt='Sim - Workflows for LLMs'
|
|
width={29.869884}
|
|
height={14.5656}
|
|
className='h-[14.5656px] w-auto pb-[1px]'
|
|
priority
|
|
loading='eager'
|
|
quality={100}
|
|
/>
|
|
</Link>
|
|
</div>
|
|
)}
|
|
</nav>
|
|
)
|
|
}
|