upstream-archive/llama.cpp
1
0
Fork 0
mirror of https://github.com/ggml-org/llama.cpp.git synced 2026-09-29 09:27:33 -05:00
Code Issues Packages Projects Releases Wiki Activity

ui : move mcp from the add menu to the sidebar rail

Browse Source 
Assisted-by: pi:llama.cpp/DeepSeek-V4.1-Flash
This commit is contained in:
Aleksander Grygier
2026-09-28 12:10:13 +02:00
parent 30247b4d34
commit 4d992dbe05
11 changed files with 42 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tools/ui/src/lib/components/app/chat/ChatForm/ChatForm.svelte
+1 -6
View File
@@ -8,8 +8,7 @@
ChatFormInputFileInputInvisible,
ChatFormMcpResourcesList,
ChatFormPickers,
DialogMcpResourcesBrowser,
DialogMcpServers
DialogMcpResourcesBrowser
} from '$lib/components/app';
import {
CLIPBOARD_CONTENT_QUOTE_PREFIX,
@@ -193,7 +192,6 @@
let preSelectedResourceUri = $state<string | undefined>(undefined);
// MCP Servers Dialog State
let isMcpServersDialogOpen = $state(false);
let currentConfig = $derived(settingsStore.config);
@@ -628,7 +626,6 @@
isReasoning={chatStore.isReasoning}
{isRecording}
onFileUpload={handleFileUpload}
onMcpSettingsClick={() => (isMcpServersDialogOpen = true)}
onMicClick={handleMicClick}
{onStop}
onSystemPromptClick={() => onSystemPromptClick?.({ files: uploadedFiles, message: value })}
@@ -667,5 +664,3 @@
}}
preSelectedUri={preSelectedResourceUri}
/>
<DialogMcpServers bind:open={isMcpServersDialogOpen} />
tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddDropdown.svelte
+1 -10
View File
@@ -1,6 +1,6 @@
<script lang="ts">
import { File, Image, MessageSquare, Mic, Plus, Video } from '@lucide/svelte';
import { ChatFormActionAddToolsSubmenu, McpLogo } from '$lib/components/app';
import { ChatFormActionAddToolsSubmenu } from '$lib/components/app';
import { buttonVariants } from '$lib/components/ui/button';
import * as DropdownMenu from '$lib/components/ui/dropdown-menu';
import * as Tooltip from '$lib/components/ui/tooltip';
@@ -132,15 +132,6 @@
</DropdownMenu.Item>
<ChatFormActionAddToolsSubmenu />
<DropdownMenu.Item
class="flex cursor-pointer items-center gap-2"
onclick={chatFormActions.onMcpSettingsClick}
>
<McpLogo class={ICON_CLASS_DEFAULT} />
<span>MCP Servers</span>
</DropdownMenu.Item>
</DropdownMenu.Content>
</DropdownMenu.Root>
</div>
tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte
-14
View File
@@ -9,7 +9,6 @@
MessageSquare,
PencilRuler
} from '@lucide/svelte';
import { McpLogo } from '$lib/components/app';
import { Checkbox } from '$lib/components/ui/checkbox';
import * as Collapsible from '$lib/components/ui/collapsible';
import * as Sheet from '$lib/components/ui/sheet';
@@ -227,19 +226,6 @@
</Collapsible.Content>
</Collapsible.Root>
{/if}
<button
class={sheetItemClass}
onclick={() => {
sheetOpen = false;
chatFormActions.onMcpSettingsClick?.();
}}
type="button"
>
<McpLogo class="inline {ICON_CLASS_DEFAULT} shrink-0" />
<span>MCP Servers</span>
</button>
</div>
</Sheet.Content>
</Sheet.Root>
tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte
-5
View File
@@ -31,7 +31,6 @@
onMicClick?: () => void;
onStop?: () => void;
onSystemPromptClick?: () => void;
onMcpSettingsClick?: () => void;
}
let {
@@ -43,7 +42,6 @@
isReasoning = false,
isRecording = false,
onFileUpload,
onMcpSettingsClick,
onMicClick,
onStop,
onSystemPromptClick,
@@ -135,9 +133,6 @@
get onFileUpload() {
return onFileUpload;
},
get onMcpSettingsClick() {
return onMcpSettingsClick;
},
get onSystemPromptClick() {
return onSystemPromptClick;
}
tools/ui/src/lib/components/app/dialogs/DialogManageModels.svelte
+1 -1
View File
@@ -102,7 +102,7 @@
</Dialog.Title>
</Dialog.Header>
<div class="dialog-view min-h-0 flex-1 pt-2" data-visible={!isSwapping}>
<div class="dialog-view min-h-0 flex-1" data-visible={!isSwapping}>
{#if shownView === 'manage'}
<ModelsManager class="h-full">
{#snippet toolbarEnd()}
tools/ui/src/lib/components/app/dialogs/index.ts
+1 -1
View File
@@ -19,7 +19,7 @@
export { default as DialogMcpServerAddNew } from './DialogMcpServerAddNew.svelte';
/**
* **DialogMcpServers** - MCP servers dialog shown from the chat form
* **DialogMcpServers** - MCP servers dialog shown from the sidebar
*
* Shows the same MCP server list as the `/mcp-servers` route inside a modal
* dialog.
tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigation.svelte
+5
View File
@@ -6,6 +6,7 @@
ActionIcon,
DialogConversationRename,
DialogManageModels,
DialogMcpServers,
DialogSettingsChat,
Logo,
SidebarNavigationActions,
@@ -94,6 +95,7 @@
let renameDialogOpen = $state(false);
let settingsDialogOpen = $state(false);
let mcpDialogOpen = $state(false);
let renameTargetConversationId = $state<string | null>(null);
let renameDraft = $state('');
let renameOriginalTitle = $state('');
@@ -391,6 +393,7 @@
class="px-2"
isExpandedMode={innerWidth > 768 ? uiStore.isSidebarExpanded : true}
onManageModelsClick={() => uiStore.openModelsManager()}
onMcpClick={() => (mcpDialogOpen = true)}
onNewChat={() => {
if (deviceStore.isMobile) {
scheduleMobileCollapse();
@@ -454,6 +457,8 @@
<DialogSettingsChat bind:open={settingsDialogOpen} />
<DialogMcpServers bind:open={mcpDialogOpen} />
<DialogManageModels bind:open={uiStore.manageModelsOpen} />
<style>
tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigationActions.svelte
+26 -20
View File
@@ -26,6 +26,7 @@
onSearchDeactivated?: () => void;
onSearchClick?: () => void;
onManageModelsClick?: () => void;
onMcpClick?: () => void;
onNewChat?: () => void;
onSettingsClick?: () => void;
}
@@ -35,6 +36,7 @@
isExpandedMode = false,
isSearchModeActive = $bindable(false),
onManageModelsClick,
onMcpClick,
onNewChat,
onSearchClick,
onSearchDeactivated,
@@ -123,16 +125,18 @@
}
: item.action === SidebarAction.MANAGE_MODELS
? () => onManageModelsClick?.()
: item.action === SidebarAction.SETTINGS
? () => onSettingsClick?.()
: item.route
? () => {
onNewChat?.();
goto(item.route!);
}
: isSearchOnMobile
? undefined
: onSearchClick}
: item.action === SidebarAction.MCP
? () => onMcpClick?.()
: item.action === SidebarAction.SETTINGS
? () => onSettingsClick?.()
: item.route
? () => {
onNewChat?.();
goto(item.route!);
}
: isSearchOnMobile
? undefined
: onSearchClick}
{@const itemTransition = {
delay: !initialized ? i * ICON_STRIP_TRANSITION_DELAY_MULTIPLIER : 0,
duration: ICON_STRIP_TRANSITION_DURATION,
@@ -181,16 +185,18 @@
}
: item.action === SidebarAction.MANAGE_MODELS
? () => onManageModelsClick?.()
: item.action === SidebarAction.SETTINGS
? () => onSettingsClick?.()
: item.route
? () => {
onNewChat?.();
goto(item.route!);
}
: isSearchOnMobile
? undefined
: onSearchClick}
: item.action === SidebarAction.MCP
? () => onMcpClick?.()
: item.action === SidebarAction.SETTINGS
? () => onSettingsClick?.()
: item.route
? () => {
onNewChat?.();
goto(item.route!);
}
: isSearchOnMobile
? undefined
: onSearchClick}
{@const itemTransition = {
delay: !initialized ? i * ICON_STRIP_TRANSITION_DELAY_MULTIPLIER : 0,
duration: ICON_STRIP_TRANSITION_DURATION,
tools/ui/src/lib/constants/ui.constants.ts
+6
View File
@@ -1,4 +1,5 @@
import { Package, Search, Settings, SquarePen } from '@lucide/svelte';
import McpLogo from '$lib/components/app/mcp/McpLogo.svelte';
import { SidebarAction, ToolSource } from '$lib/enums';
import type { DesktopIconStripItem } from '$lib/types';
@@ -86,6 +87,11 @@ export const SIDEBAR_ACTIONS_ITEMS: DesktopIconStripItem[] = [
icon: MODEL_SELECTOR_ICON,
tooltip: 'Models'
},
{
action: SidebarAction.MCP,
icon: McpLogo,
tooltip: 'MCP'
},
{
action: SidebarAction.SETTINGS,
icon: Settings,
tools/ui/src/lib/enums/ui.enums.ts
+1
View File
@@ -25,6 +25,7 @@ export enum ScrollCarouselVariant {
export enum SidebarAction {
DISCOVER_MODELS = 'discover-models',
MANAGE_MODELS = 'manage-models',
MCP = 'mcp',
NEW_CHAT = 'new-chat',
SETTINGS = 'settings'
}
tools/ui/src/lib/types/chat.d.ts
Vendored
-1
View File
@@ -335,5 +335,4 @@ export interface ChatFormActionsContext {
readonly hasVisionModality: boolean;
onFileUpload?: () => void;
onSystemPromptClick?: () => void;
onMcpSettingsClick?: () => void;
}