feat: lock model selector during guided tour and refine open state logic

This commit is contained in:
Shine1i 2026-02-16 02:05:53 +01:00
commit d0bcf02784
2 changed files with 27 additions and 5 deletions

View file

@ -205,6 +205,7 @@ export function ChatPage(): ReactElement {
});
const [settingsOpen, setSettingsOpen] = useState(false);
const [modelSelectorOpen, setModelSelectorOpen] = useState(false);
const [modelSelectorLocked, setModelSelectorLocked] = useState(false);
const [sidebarOpen, setSidebarOpen] = useState(true);
const viewBeforeCompareRef = useRef<ChatView | null>(null);
const inferenceParams = useChatRuntimeStore((state) => state.params);
@ -239,8 +240,23 @@ export function ChatPage(): ReactElement {
[],
);
const openModelSelector = useCallback(() => setModelSelectorOpen(true), []);
const closeModelSelector = useCallback(() => setModelSelectorOpen(false), []);
const openModelSelector = useCallback(() => {
setModelSelectorLocked(true);
setModelSelectorOpen(true);
}, []);
const closeModelSelector = useCallback(() => {
setModelSelectorLocked(false);
setModelSelectorOpen(false);
}, []);
const handleModelSelectorOpenChange = useCallback(
(open: boolean) => {
if (!open && modelSelectorLocked) return;
setModelSelectorOpen(open);
},
[modelSelectorLocked],
);
const openSettings = useCallback(() => setSettingsOpen(true), []);
const closeSettings = useCallback(() => setSettingsOpen(false), []);
const openSidebar = useCallback(() => setSidebarOpen(true), []);
@ -313,6 +329,13 @@ export function ChatPage(): ReactElement {
steps: tourSteps,
});
useEffect(() => {
if (tour.open) return;
if (!modelSelectorLocked) return;
setModelSelectorLocked(false);
setModelSelectorOpen(false);
}, [modelSelectorLocked, tour.open]);
return (
<div className="h-[calc(100vh-4rem)] bg-background overflow-hidden">
<GuidedTour {...tour.tourProps} />
@ -355,7 +378,7 @@ export function ChatPage(): ReactElement {
onEject={handleEject}
variant="ghost"
open={modelSelectorOpen}
onOpenChange={setModelSelectorOpen}
onOpenChange={handleModelSelectorOpenChange}
triggerDataTour="chat-model-selector"
contentDataTour="chat-model-selector-popover"
/>

View file

@ -55,7 +55,7 @@ export function StudioPage(): ReactElement {
return (
<div className="min-h-screen bg-background">
<main className="mx-auto max-w-7xl px-6 py-4">
<GuidedTour {...tour.tourProps} celebrate={true} />
<GuidedTour {...tour.tourProps} celebrate={isConfigTour} />
<DatasetPreviewDialog
open={dialogOpen}
@ -114,4 +114,3 @@ export function StudioPage(): ReactElement {
</div>
);
}