Emil_Shanaty/open-webui-ai4me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2026-03-05 14:47:48 -06:00
parent 828656b35f
commit 8da02c669e
1 changed files with 31 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/chat/FileNav/SqliteView.svelte
+31 -22
View File
@@ -135,9 +135,9 @@
<div class="flex items-center gap-1 px-2 py-1.5 border-b border-gray-100 dark:border-gray-800 overflow-x-auto scrollbar-none shrink-0"> <div class="flex items-center gap-1 px-2 py-1.5 border-b border-gray-100 dark:border-gray-800 overflow-x-auto scrollbar-none shrink-0">
{#each tables as table} {#each tables as table}
<button <button
class="shrink-0 px-2 py-1 text-xs rounded transition class="shrink-0 px-2 py-1 text-xs rounded-lg transition
{table === selectedTable && !queryMode {table === selectedTable && !queryMode
? 'bg-blue-100 dark:bg-blue-900/40 text-blue-700 dark:text-blue-300 font-medium' ? 'bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-200 font-medium'
: 'text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800'}" : 'text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800'}"
on:click={() => selectTable(table)} on:click={() => selectTable(table)}
> >
@@ -146,9 +146,9 @@
{/each} {/each}
<div class="flex-1"></div> <div class="flex-1"></div>
<button <button
class="shrink-0 px-2 py-1 text-xs rounded transition class="shrink-0 px-2 py-1 text-xs rounded-lg transition font-mono
{queryMode {queryMode
? 'bg-blue-100 dark:bg-blue-900/40 text-blue-700 dark:text-blue-300 font-medium' ? 'bg-gray-100 dark:bg-gray-800 text-gray-700 dark:text-gray-200 font-medium'
: 'text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800'}" : 'text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800'}"
on:click={() => { queryMode = !queryMode; }} on:click={() => { queryMode = !queryMode; }}
> >
@@ -158,30 +158,33 @@
{#if queryMode} {#if queryMode}
<!-- Query editor --> <!-- Query editor -->
<div class="p-2 border-b border-gray-100 dark:border-gray-800 shrink-0"> <div class="shrink-0">
<div class="flex gap-1.5"> <textarea
<textarea bind:value={queryText}
bind:value={queryText} placeholder="SELECT * FROM ..."
placeholder="SELECT * FROM ..." class="query-editor w-full text-xs font-mono bg-transparent text-gray-800 dark:text-gray-200 px-3 py-2 outline-none resize-none"
class="flex-1 text-xs font-mono bg-gray-50 dark:bg-gray-900 border border-gray-200 dark:border-gray-700 rounded px-2 py-1.5 outline-none resize-none min-h-[2.5rem]" rows="3"
rows="2" spellcheck="false"
on:keydown={(e) => { on:keydown={(e) => {
if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') { if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') {
e.preventDefault(); e.preventDefault();
runQuery(); runQuery();
} }
}} }}
></textarea> ></textarea>
<div class="flex items-center justify-between px-2 py-1 bg-gray-50 dark:bg-gray-900 border-b border-gray-100 dark:border-gray-800">
{#if queryError}
<span class="text-[0.65rem] text-red-500 dark:text-red-400 truncate mr-2">{queryError}</span>
{:else}
<span class="text-[0.6rem] text-gray-400 dark:text-gray-600 select-none">⌘+Enter</span>
{/if}
<button <button
class="shrink-0 px-3 py-1 text-xs bg-blue-500 hover:bg-blue-600 text-white rounded transition" class="shrink-0 px-2.5 py-0.5 text-[0.65rem] font-medium rounded hover:bg-gray-200 dark:hover:bg-gray-800 transition text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300"
on:click={runQuery} on:click={runQuery}
> >
{$i18n.t('Run')} {$i18n.t('Run')}
</button> </button>
</div> </div>
{#if queryError}
<div class="mt-1 text-xs text-red-500">{queryError}</div>
{/if}
</div> </div>
{#if queryColumns.length > 0} {#if queryColumns.length > 0}
@@ -327,4 +330,10 @@
:global(.dark) .sqlite-null { :global(.dark) .sqlite-null {
color: #6b7280 !important; color: #6b7280 !important;
} }
.query-editor::placeholder {
color: #9ca3af;
}
:global(.dark) .query-editor::placeholder {
color: #6b7280;
}
</style> </style>