ui : model selector components by allozaur · Pull Request #28419 · ggml-org/llama.cpp

allozaur · 2026-09-04T23:20:35Z

Overview

Groups the four model selector surfaces (dropdown, list, option, sheet) into models/ModelsSelector with their own barrel, extracts the shared reasoning panel and the in-flight download row, moves the option-list helpers to navigation/utils, and wires the selector hook. Also updates the shared searchable-dropdown plumbing (sticky search header/footer, scrollport height) this rework relies on, and the existing selector story imports.

Demo

Desktop

Screen.Recording.2026-09-05.at.02.02.46.mov

Mobile

Screen.Recording.2026-09-05.at.02.09.53.mov

Requirements

I have read and agree with the contributing guidelines
AI usage disclosure: YES, pi:zai-org/GLM-5.3 + llama-ui:unsloth/Qwen3.8-Flash-Next

Copilot

🟡 Changes recommended

It introduces concrete UI/runtime issues (invalid Tailwind important syntax and unhandled promise rejections) that should be fixed before merging.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Refactors the UI model selector surfaces by consolidating dropdown/sheet/list/option into a dedicated ModelsSelector module, extracting shared subcomponents (reasoning panel, download row), and updating the shared searchable dropdown plumbing that the new layout relies on.

Changes:

Re-homes selector components under components/app/models/ModelsSelector/ with a new barrel export and updated story imports.
Adds a sticky-footer reasoning effort panel for the selector and wires it into both dropdown and sheet variants.
Updates searchable dropdown + dropdown content sizing to support sticky header/footer behavior and revised scrollport height.

File summaries

File	Description
tools/ui/tests/stories/ModelsSelector.stories.svelte	Updates story imports/types to new `ModelsSelector` and navigation utils locations.
tools/ui/src/lib/hooks/use-reasoning-menu.svelte.ts	Updates hook doc comment to reflect new consumer (`ModelsSelectorReasoningPanel`).
tools/ui/src/lib/hooks/use-models-selector.svelte.ts	Switches selector option grouping/filtering imports to navigation utils.
tools/ui/src/lib/constants/css-classes.constants.ts	Adds a shared selector for focusing dropdown-menu search input after mount.
tools/ui/src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte	Adjusts dropdown content max-height to accommodate sticky header/footer spacing.
tools/ui/src/lib/components/app/navigation/utils.ts	Introduces shared model option filter/group helpers/types under navigation.
tools/ui/src/lib/components/app/navigation/DropdownMenuSearchable.svelte	Adds sticky footer support and new class passthrough props for header/content.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorSheet.svelte	Integrates reasoning state + panel into the mobile sheet variant.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorReasoningPanel.svelte	New inline collapsible reasoning-effort picker intended for selector footer usage.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorOption.svelte	Adds discover-style avatars and lazy base-model org resolution via Hugging Face.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorList.svelte	Adds in-flight download section + shared cancel confirmation dialog wiring.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte	Removes submenu, rewires search focus behavior, adds sticky reasoning footer.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDownloadItem.svelte	New row component for in-flight/paused downloads with pause/resume/cancel affordances.
tools/ui/src/lib/components/app/models/ModelsSelector/index.ts	New barrel export for the selector module.
tools/ui/src/lib/components/app/models/index.ts	Re-exports `ModelsSelector` from models module barrel.

Review details

Suppressed comments (3)

tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte:264

Tailwind's important modifier is a prefix (e.g. !p-0); p-0! won't be generated and won't override the default padding on DropdownMenu.Content.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDropdown.svelte:360
text-red-400! is not valid Tailwind syntax (important modifier must be prefixed). This likely prevents the error-state text color override from applying.
tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorOption.svelte:91
HuggingFaceService.getBaseModel() can reject (it awaits getDetails()); without a .catch() this can surface as an unhandled promise rejection in the browser.

Files reviewed: 14/15 changed files
Comments generated: 2
Review effort level: Lite

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

A manage models dialog for the local server: a table that folds each repo's quants into one row, groups them into families, and sorts from its column headers. Loaded models lead, then favorites, then the local block, then the hidden one; sections keep their open state in local storage. The toolbar filters by capability, modality and context, rows act on favorite, delete and hide, and the manager opens focused on a model from the sidebar or a download row. The models store gains the recents, hidden and group-open state, and warms the Hub records for the context and capability columns. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

…cars A Q4_0-mtp style tag now resolves the sidecar file when no model file matches it, so a solo draft or mmproj download actually pulls the file. Cached sidecar files list as their own entries so the state survives a restart, and removing such a tag deletes only the sidecar. Assisted-by: pi:zai-org/GLM-5.3

Add an allowHtml prop to MarkdownContent: raw HTML found in the markdown is rendered after DOMPurify sanitization instead of being escaped as literal text. Default stays escaped. Assisted-by: pi:GLM-5.3-Flash

The Discover surface: the curated-catalog list with its search and skeletons, the details pane with its readme, metadata, Hub stats and download options, and the standalone download progress bar that replaces the plain one. The quant download button sizes its select with a new xs trigger, so the select gains that size and the muted box look. The store stays incomplete when a repo fails, so the next mount retries it. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

The manager dialog gains its second view: the Discover Models call to action fades the table out, slides the title with its compass mark, and fades the discover surface in; the arrow button returns to the table. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

A provider is a server entry with a base url, an optional key, a protocol and the paths its API lives at; the local llama.cpp server is the built-in one. Backends persist in settings and the active one is restored on load. Requests resolve against the active backend, model ids become backend-qualified, and every backend's model list is fetched and cached in the background. The manager's helpers learn to read a model's drafts, context and the provider that serves it. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

Chat goes through protocol adapters, so an OpenAI-compatible endpoint speaks its own wire format: per-backend paths and headers, the model on the request, tools kept on the local server, and token counts synthesized for endpoints that do not stream their own timings. The server store keeps the local server's props while another provider is active, a conversation resolves the provider its model belongs to before sending, and the chat screen never blocks on the local probe when the install has none. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

A provider is added from a preset card or by hand: the dialog probes the endpoint, reads a refusal as a llama.cpp server that wants a key, and shows the connection test as a status block. Presets carry their official artwork and a saved backend keeps its branding through the favicon fallback. The manager dialog gains its third view, and the settings save stops clobbering keys that other surfaces write. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

The table grows a section per enabled provider, each with its own mark, error and loading state, and a provider filter with live repo counts. Rows gain their capability gates back, the draft column with its use-as-draft action, and the quant badge names the provider on its rows. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

The selector surfaces move under models/ModelsSelector with their own barrel: the dropdown and sheet relocate, the list, option and trigger icon split out, and the shared list helpers join the navigation utils. The searchable dropdown gains a sticky footer and per-surface class hooks. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

The selector keeps working when a provider is down: the trigger shows the provider's mark and the org avatar, the banner only appears when no backend is enabled, and the model ids read through their settings. The model mark becomes MODEL_ICON everywhere. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

The reasoning level becomes its own control next to the selector, and the add menu drops its reasoning submenu. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

Assisted-by: pi:zai-org/GLM-5.3-Flash

allozaur · 2026-10-01T06:41:18Z

code moved to #29583

github-actions Bot added the server/ui label Sep 4, 2026

allozaur force-pushed the allozaur/ui/models-selector branch from 40f1829 to ba0e9ad Compare September 4, 2026 23:24

allozaur force-pushed the allozaur/ui/discover-dialog branch from 82134d1 to 3d901dd Compare September 4, 2026 23:24

allozaur changed the title ~~ui : group the model selector components~~ ui : model selector components Sep 4, 2026

allozaur force-pushed the allozaur/ui/discover-dialog branch from 3d901dd to 30735d8 Compare September 4, 2026 23:31

allozaur force-pushed the allozaur/ui/models-selector branch from ba0e9ad to f2f9780 Compare September 4, 2026 23:31

allozaur force-pushed the allozaur/ui/discover-dialog branch from 30735d8 to cd06d0f Compare September 4, 2026 23:57

allozaur force-pushed the allozaur/ui/models-selector branch from f2f9780 to ec70604 Compare September 4, 2026 23:57

allozaur marked this pull request as ready for review September 5, 2026 00:01

allozaur requested a review from a team as a code owner September 5, 2026 00:01

Copilot AI lite review requested due to automatic review settings September 5, 2026 00:01

Copilot started reviewing on behalf of allozaur September 5, 2026 00:02

View session

Copilot AI reviewed Sep 5, 2026

View reviewed changes

Comment thread tools/ui/src/lib/components/app/models/ModelsSelector/ModelsSelectorDownloadItem.svelte Outdated

Comment thread tools/ui/src/lib/components/app/navigation/DropdownMenuSearchable.svelte

allozaur force-pushed the allozaur/ui/models-selector branch from ec70604 to ebcc2fd Compare September 5, 2026 00:11

allozaur requested review from ServeurpersoCom and ggerganov September 5, 2026 00:14

allozaur force-pushed the allozaur/ui/discover-dialog branch from cd06d0f to 105fbb2 Compare September 5, 2026 00:48

allozaur force-pushed the allozaur/ui/models-selector branch from ebcc2fd to da76e8f Compare September 5, 2026 00:48

allozaur force-pushed the allozaur/ui/discover-dialog branch from 105fbb2 to 13cfa2c Compare September 5, 2026 00:52

allozaur force-pushed the allozaur/ui/models-selector branch from da76e8f to 4a28a98 Compare September 5, 2026 00:52

allozaur force-pushed the allozaur/ui/discover-dialog branch from 13cfa2c to 5e37842 Compare September 6, 2026 16:34

allozaur requested review from a team as code owners September 6, 2026 16:34

allozaur force-pushed the allozaur/ui/models-selector branch from 4a28a98 to 238e89f Compare September 6, 2026 16:34

allozaur force-pushed the allozaur/ui/discover-dialog branch from 5e37842 to 4cfe5cd Compare September 7, 2026 06:12

allozaur force-pushed the allozaur/ui/models-selector branch from 238e89f to ae151a7 Compare September 7, 2026 06:12

allozaur force-pushed the allozaur/ui/discover-dialog branch from 4cfe5cd to 71594cd Compare September 7, 2026 07:00

allozaur force-pushed the allozaur/ui/models-selector branch from ae151a7 to 0dde539 Compare September 7, 2026 07:00

allozaur force-pushed the allozaur/ui/discover-dialog branch from 71594cd to e8a0d69 Compare September 7, 2026 07:09

allozaur force-pushed the allozaur/ui/models-selector branch from 0dde539 to dee4eb2 Compare September 7, 2026 07:09

allozaur force-pushed the allozaur/ui/models-selector branch from b0375a6 to cf6579e Compare September 7, 2026 15:07

0cc4m added testing Everything test related and removed testing Everything test related Vulkan Issues specific to the Vulkan backend ggml changes relating to the ggml tensor library for machine learning OpenVINO WebGPU labels Sep 7, 2026

allozaur force-pushed the allozaur/ui/discover-dialog branch from 98eec5a to 4886b06 Compare September 7, 2026 19:00

allozaur force-pushed the allozaur/ui/models-selector branch from cf6579e to f3a2912 Compare September 7, 2026 19:00

allozaur force-pushed the allozaur/ui/discover-dialog branch from 4886b06 to 6ec02a4 Compare September 7, 2026 23:16

allozaur force-pushed the allozaur/ui/models-selector branch from f3a2912 to d8702eb Compare September 7, 2026 23:16

allozaur mentioned this pull request Sep 14, 2026

ui: fix removed reasoning menu in single model mode on desktop #27985

Merged

allozaur force-pushed the allozaur/ui/models-selector branch from d8702eb to e7ac5b2 Compare September 16, 2026 11:11

allozaur force-pushed the allozaur/ui/discover-dialog branch from 6ec02a4 to ab8cfd0 Compare September 16, 2026 11:11

allozaur force-pushed the allozaur/ui/models-selector branch from e7ac5b2 to 311816c Compare September 16, 2026 11:14

allozaur force-pushed the allozaur/ui/discover-dialog branch from ab8cfd0 to 0bbe4dd Compare September 16, 2026 11:14

allozaur added 13 commits September 30, 2026 15:31

ui : optional sanitized raw HTML in markdown

95b40f2

Add an allowHtml prop to MarkdownContent: raw HTML found in the markdown is rendered after DOMPurify sanitization instead of being escaped as literal text. Default stays escaped. Assisted-by: pi:GLM-5.3-Flash

ui : move reasoning effort beside the model selector

f847272

The reasoning level becomes its own control next to the selector, and the add menu drops its reasoning submenu. Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash

ui : drop an orphaned doc comment left by a moved method

76be7c1

Assisted-by: pi:zai-org/GLM-5.3-Flash

Navigation Menu

Repository navigation

ui : model selector components - #28419

ui : model selector components#28419
allozaur wants to merge 13 commits into
allozaur/ui/providers-settingsfrom
allozaur/ui/models-selector

allozaur commented Sep 4, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

allozaur commented Oct 1, 2026

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

allozaur commented Sep 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Overview

Demo

Desktop

Mobile

Requirements

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

🟡 Changes recommended

Suppressed comments (3)

Uh oh!

Uh oh!

Uh oh!

allozaur commented Oct 1, 2026

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

allozaur commented Sep 4, 2026 •

edited

Loading