mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-07-26 23:51:14 +02:00
refactor(chat-header): update className handling for responsive design and improve layout consistency
This commit is contained in:
parent
918133a4be
commit
b100eda8c6
2 changed files with 9 additions and 6 deletions
|
|
@ -102,8 +102,8 @@ import { useCommentsSync } from "@/hooks/use-comments-sync";
|
|||
import { useMediaQuery } from "@/hooks/use-media-query";
|
||||
import { useElectronAPI } from "@/hooks/use-platform";
|
||||
import { useScraperCapabilities } from "@/hooks/use-scraper-capabilities";
|
||||
import { captureDisplayToPngDataUrl } from "@/lib/chat/display-media-capture";
|
||||
import { canSubmitChat } from "@/lib/chat/can-submit-chat";
|
||||
import { captureDisplayToPngDataUrl } from "@/lib/chat/display-media-capture";
|
||||
import { getMentionDocKey } from "@/lib/chat/mention-doc-key";
|
||||
import { slideoutOpenedTickAtom } from "@/lib/layout-events";
|
||||
import { findPlatform, type PlaygroundPlatform } from "@/lib/playground/catalog";
|
||||
|
|
@ -1715,10 +1715,10 @@ const ComposerAction: FC<ComposerActionProps> = ({
|
|||
)}
|
||||
<ConnectedScraperIcons workspaceId={workspaceId} />
|
||||
</div>
|
||||
<div className="ml-auto flex min-w-0 shrink-0 items-center gap-2">
|
||||
<div className="ml-auto flex min-w-0 shrink items-center gap-2">
|
||||
<ChatHeader
|
||||
workspaceId={workspaceId}
|
||||
className="h-9 max-w-[44vw] px-2 sm:max-w-[220px] sm:px-3"
|
||||
className="h-9 max-w-[44vw] px-2 sm:max-w-none sm:px-3"
|
||||
onChatModelSelected={onChatModelSelected}
|
||||
/>
|
||||
<AuiIf condition={({ thread }) => !thread.isRunning}>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
"use client";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { ImageModelSelector } from "./image-model-selector";
|
||||
import { ModelSelector } from "./model-selector";
|
||||
|
||||
|
|
@ -10,14 +11,16 @@ interface ChatHeaderProps {
|
|||
}
|
||||
|
||||
export function ChatHeader({ workspaceId, className, onChatModelSelected }: ChatHeaderProps) {
|
||||
const selectorClassName = cn(className, "sm:max-w-[180px] sm:min-w-0");
|
||||
|
||||
return (
|
||||
<div className="flex min-w-0 shrink-0 items-center gap-2">
|
||||
<div className="flex min-w-0 shrink items-center gap-2 sm:max-w-[360px]">
|
||||
<ModelSelector
|
||||
workspaceId={workspaceId}
|
||||
className={className}
|
||||
className={selectorClassName}
|
||||
onChatModelSelected={onChatModelSelected}
|
||||
/>
|
||||
<ImageModelSelector workspaceId={workspaceId} className={className} mobileIconOnly />
|
||||
<ImageModelSelector workspaceId={workspaceId} className={selectorClassName} mobileIconOnly />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue