Skip to content

Commit 187ea1c

Browse files
saphidclaude
andcommitted
fix(web): keep the model picker a fixed height while searching
Lock the popover to the height it had when the search started, so it never resizes while typing. Results scroll inside it, and it fits its content again once the query is cleared. Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>
1 parent 755253b commit 187ea1c

1 file changed

Lines changed: 4 additions & 5 deletions

File tree

‎apps/web/src/components/chat/ModelPickerContent.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -704,7 +704,7 @@ export const ModelPickerContent = memo(function ModelPickerContent(props: {
704704
const [modelListContentSize, setModelListContentSize] = useState(
705705
() => filteredItemKeys.length * MODEL_LIST_ESTIMATED_ITEM_SIZE,
706706
);
707-
const [searchMinHeight, setSearchMinHeight] = useState(0);
707+
const [searchHeight, setSearchHeight] = useState(0);
708708
useLayoutEffect(
709709
() => modelListRef.current?.getState().listen("totalSize", setModelListContentSize),
710710
[],
@@ -830,8 +830,8 @@ export const ModelPickerContent = memo(function ModelPickerContent(props: {
830830
<div
831831
ref={pickerContentRef}
832832
className="relative flex max-h-86.5 w-screen max-w-90 flex-row overflow-hidden"
833-
// Don't shrink while searching, so the input stays put when the popover opens upward.
834-
style={isSearching ? { minHeight: searchMinHeight } : undefined}
833+
// Hold the height from when the search started; results scroll instead of resizing.
834+
style={isSearching ? { height: searchHeight } : undefined}
835835
data-model-picker-content="true"
836836
>
837837
{/* Sidebar */}
@@ -907,8 +907,7 @@ export const ModelPickerContent = memo(function ModelPickerContent(props: {
907907
placeholder="Search models..."
908908
value={searchQuery}
909909
onChange={(e) => {
910-
const height = pickerContentRef.current?.offsetHeight ?? 0;
911-
setSearchMinHeight((min) => (isSearching ? Math.max(min, height) : height));
910+
if (!isSearching) setSearchHeight(pickerContentRef.current?.offsetHeight ?? 0);
912911
setSearchQuery(e.target.value);
913912
}}
914913
onKeyDown={(e) => {

0 commit comments

Comments
 (0)