github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-03-09 07:18:29 -05:00
Code Issues 308 Packages Projects Releases 100 Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2026-02-27 16:47:36 -06:00
parent 3be06132db
commit 3a6c88ade9
1 changed files with 102 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

151
src/lib/components/chat/MessageInput/TerminalMenu.svelte
View File

@@ -66,7 +66,10 @@
// Disable all direct terminals when switching to a system terminal
if ($settings?.terminalServers?.some((s) => s.enabled)) {
const updatedServers = ($settings.terminalServers ?? []).map((s) => ({ ...s, enabled: false }));
const updatedServers = ($settings.terminalServers ?? []).map((s) => ({
...s,
enabled: false
}));
settings.set({
...$settings,
terminalServers: updatedServers
@@ -111,17 +114,29 @@
<!-- Direct terminals (gated by permission) -->
{#if $user?.role === 'admin' || ($user?.permissions?.features?.direct_tool_servers ?? true)}
<div class="flex items-center justify-between px-3 py-1">
<span class="text-[10px] font-medium text-gray-400 dark:text-gray-500 uppercase tracking-wider">
<span
class="text-[10px] font-medium text-gray-400 dark:text-gray-500 uppercase tracking-wider"
>
{$i18n.t('Direct')}
</span>
<Tooltip content={$i18n.t('Add Terminal')} placement="top">
<button
type="button"
class="p-0.5 rounded-md text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 transition"
on:click|stopPropagation={() => { show = false; showSettings.set(true); }}
on:click|stopPropagation={() => {
show = false;
showSettings.set(true);
}}
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-3.5">
<path d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z" />
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="size-3.5"
>
<path
d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z"
/>
</svg>
</button>
</Tooltip>
@@ -130,69 +145,107 @@
{#each directTerminals as terminal}
<button
type="button"
class="flex w-full justify-between gap-2 items-center px-3 py-1.5 text-sm cursor-pointer rounded-xl {$selectedTerminalId === terminal.url
class="flex w-full justify-between gap-2 items-center px-3 py-1.5 text-sm cursor-pointer rounded-xl {$selectedTerminalId ===
terminal.url
? 'bg-gray-50 dark:bg-gray-800/50'
: 'hover:bg-gray-50 dark:hover:bg-gray-800/50'}"
on:click={() => selectDirect(terminal)}
>
<div class="flex flex-1 gap-2 items-center truncate">
<Cloud className="size-4 shrink-0" strokeWidth="2" />
<span class="truncate">{terminal.name || terminal.url.replace(/^https?:\/\//, '')}</span>
<span class="truncate"
>{terminal.name || terminal.url.replace(/^https?:\/\//, '')}</span
>
</div>
{#if $selectedTerminalId === terminal.url}
<div class="shrink-0 text-emerald-600 dark:text-emerald-400">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-4">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="size-4"
>
<path
fill-rule="evenodd"
d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z"
clip-rule="evenodd"
/>
</svg>
</div>
{/if}
</button>
{/each}
<hr class="border-gray-100 dark:border-gray-800 my-1" />
{#if directTerminals.length > 0 && systemTerminals.length > 0}
<hr class="border-gray-100 dark:border-gray-800 my-1" />
{/if}
{/if}
<!-- System terminals -->
<div class="flex items-center justify-between px-3 py-1">
<span class="text-[10px] font-medium text-gray-400 dark:text-gray-500 uppercase tracking-wider">
{$i18n.t('System')}
</span>
{#if $user?.role === 'admin'}
<Tooltip content={$i18n.t('Add Terminal')} placement="top">
<button
type="button"
class="p-0.5 rounded-md text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 transition"
on:click|stopPropagation={() => { show = false; goto('/admin/settings/integrations'); }}
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-3.5">
<path d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z" />
</svg>
</button>
</Tooltip>
{/if}
</div>
{#each systemTerminals as terminal}
<button
type="button"
class="flex w-full justify-between gap-2 items-center px-3 py-1.5 text-sm cursor-pointer rounded-xl {$selectedTerminalId === terminal.id
? 'bg-gray-50 dark:bg-gray-800/50'
: 'hover:bg-gray-50 dark:hover:bg-gray-800/50'}"
on:click={() => selectSystem(terminal)}
>
<div class="flex flex-1 gap-2 items-center truncate">
<Cloud className="size-4 shrink-0" strokeWidth="2" />
<span class="truncate">{terminal.name || $i18n.t('Terminal')}</span>
</div>
{#if $selectedTerminalId === terminal.id}
<div class="shrink-0 text-emerald-600 dark:text-emerald-400">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-4">
<path fill-rule="evenodd" d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z" clip-rule="evenodd" />
</svg>
</div>
{#if systemTerminals.length > 0}
<div class="flex items-center justify-between px-3 py-1">
<span
class="text-[10px] font-medium text-gray-400 dark:text-gray-500 uppercase tracking-wider"
>
{$i18n.t('System')}
</span>
{#if $user?.role === 'admin'}
<Tooltip content={$i18n.t('Add Terminal')} placement="top">
<button
type="button"
class="p-0.5 rounded-md text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 transition"
on:click|stopPropagation={() => {
show = false;
goto('/admin/settings/integrations');
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="size-3.5"
>
<path
d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z"
/>
</svg>
</button>
</Tooltip>
{/if}
</button>
{/each}
</div>
{#each systemTerminals as terminal}
<button
type="button"
class="flex w-full justify-between gap-2 items-center px-3 py-1.5 text-sm cursor-pointer rounded-xl {$selectedTerminalId ===
terminal.id
? 'bg-gray-50 dark:bg-gray-800/50'
: 'hover:bg-gray-50 dark:hover:bg-gray-800/50'}"
on:click={() => selectSystem(terminal)}
>
<div class="flex flex-1 gap-2 items-center truncate">
<Cloud className="size-4 shrink-0" strokeWidth="2" />
<span class="truncate">{terminal.name || $i18n.t('Terminal')}</span>
</div>
{#if $selectedTerminalId === terminal.id}
<div class="shrink-0 text-emerald-600 dark:text-emerald-400">
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="size-4"
>
<path
fill-rule="evenodd"
d="M16.704 4.153a.75.75 0 01.143 1.052l-8 10.5a.75.75 0 01-1.127.075l-4.5-4.5a.75.75 0 011.06-1.06l3.894 3.893 7.48-9.817a.75.75 0 011.05-.143z"
clip-rule="evenodd"
/>
</svg>
</div>
{/if}
</button>
{/each}
{/if}
</DropdownMenu.Content>
</div>
</Dropdown>