Skip to main content
Glama
page-header.tsx1.76 kB
import { ReactNode } from 'react'; import { useEmbedding } from '@/components/embed-provider'; import { Separator } from '@/components/ui/separator'; import { SidebarTrigger } from '@/components/ui/sidebar-shadcn'; interface PageHeaderProps { title: ReactNode; description?: ReactNode; leftContent?: ReactNode; rightContent?: ReactNode; showBorder?: boolean; className?: string; hideSidebarTrigger?: boolean; } export const PageHeader = ({ title, description, leftContent, rightContent, showBorder = false, className = '', hideSidebarTrigger = false, }: PageHeaderProps) => { const { embedState } = useEmbedding(); if (embedState.hidePageHeader) { return null; } const showSidebarTrigger = !hideSidebarTrigger && !embedState.isEmbedded; return ( <div className={`flex items-center justify-between py-3 w-full px-4 ${ showBorder ? 'border-b' : '' } ${className}`} > <div className="flex items-center justify-between w-full"> <div className="flex items-center gap-2"> {showSidebarTrigger && <SidebarTrigger />} {showSidebarTrigger && ( <Separator orientation="vertical" className="h-5 mr-2" /> )} <div> <div className="flex items-center gap-2"> {typeof title === 'string' ? ( <h1 className="text-base font-normal">{title}</h1> ) : ( title )} </div> {description && ( <span className="text-xs text-muted-foreground"> {description} </span> )} </div> {leftContent} </div> {rightContent} </div> </div> ); };

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/activepieces/activepieces'

If you have feedback or need assistance with the MCP directory API, please join our Discord server