fix: resolve layout shift in knowledge items with long names

This commit is contained in:
silentoplayz 2025-12-08 23:49:04 -05:00
parent 2b1a29d44b
commit 1912fb1a75
5 changed files with 12 additions and 4 deletions

View file

@ -36,7 +36,7 @@
let filter = {}; let filter = {};
$: filter = { $: filter = {
...(query ? { query } : {}), ...(query ? { query: query } : {}),
...(orderBy ? { order_by: orderBy } : {}), ...(orderBy ? { order_by: orderBy } : {}),
...(direction ? { direction } : {}) ...(direction ? { direction } : {})
}; };

View file

@ -121,6 +121,7 @@
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
placeholder={$i18n.t('Search Chats')} placeholder={$i18n.t('Search Chats')}
maxlength="500"
/> />
{#if query} {#if query}

View file

@ -209,6 +209,7 @@
class="w-full rounded-r-xl py-1.5 pl-2.5 text-sm bg-transparent dark:text-gray-300 outline-hidden" class="w-full rounded-r-xl py-1.5 pl-2.5 text-sm bg-transparent dark:text-gray-300 outline-hidden"
placeholder={placeholder ? placeholder : $i18n.t('Search')} placeholder={placeholder ? placeholder : $i18n.t('Search')}
autocomplete="off" autocomplete="off"
maxlength="500"
bind:value bind:value
on:input={() => { on:input={() => {
dispatch('input'); dispatch('input');

View file

@ -242,11 +242,11 @@
</div> </div>
<div class=" flex items-center gap-1 justify-between px-1.5"> <div class=" flex items-center gap-1 justify-between px-1.5">
<div class=" flex items-center gap-2"> <div class=" flex-1 min-w-0 flex items-center gap-2">
<div class=" text-sm font-medium line-clamp-1 capitalize">{item.name}</div> <div class=" text-sm font-medium line-clamp-1 capitalize">{item.name}</div>
</div> </div>
<div> <div class="shrink-0">
<div class="text-xs text-gray-500"> <div class="text-xs text-gray-500">
<Tooltip <Tooltip
content={item?.user?.email ?? $i18n.t('Deleted User')} content={item?.user?.email ?? $i18n.t('Deleted User')}

View file

@ -68,13 +68,18 @@
let models = null; let models = null;
let total = null; let total = null;
let searchDebounceTimer;
$: if ( $: if (
page !== undefined && page !== undefined &&
query !== undefined && query !== undefined &&
selectedTag !== undefined && selectedTag !== undefined &&
viewOption !== undefined viewOption !== undefined
) { ) {
getModelList(); clearTimeout(searchDebounceTimer);
searchDebounceTimer = setTimeout(() => {
getModelList();
}, 300);
} }
const getModelList = async () => { const getModelList = async () => {
@ -381,6 +386,7 @@
class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
placeholder={$i18n.t('Search Models')} placeholder={$i18n.t('Search Models')}
maxlength="500"
/> />
{#if query} {#if query}