refactor: enhance layout of document filters in DocumentList for better responsiveness

web/app/dashboard/knowledge/_components/document-list.tsx

@@ -338,8 +338,8 @@ export function DocumentList({ knowledgeBaseId, onActionStateChange }: DocumentL
         />
         <div className="flex min-w-0 flex-1 flex-col">
         <div className="flex flex-col gap-2 border-b bg-background px-6 py-2">
-          <div className="flex gap-2">
+          <div className="flex min-w-0 gap-2">
-            <div className="relative flex-1">
+            <div className="relative min-w-0 flex-1">
               <SearchIcon className="pointer-events-none absolute top-1/2 left-2 size-3.5 -translate-y-1/2 text-muted-foreground" />
               <Input
                 value={String(draftFilters.title ?? "")}
@@ -349,6 +349,7 @@ export function DocumentList({ knowledgeBaseId, onActionStateChange }: DocumentL
                 className="h-8 pl-8 text-xs"
               />
             </div>
+            <div className="w-28 shrink-0">
               <OptionCombobox
                 value={String(draftFilters.status ?? "all")}
                 onChange={handleStatusFilterChange}
@@ -357,6 +358,8 @@ export function DocumentList({ knowledgeBaseId, onActionStateChange }: DocumentL
                 searchPlaceholder={t("knowledge.searchStatus")}
                 emptyText={t("knowledge.emptyStatus")}
               />
+            </div>
+            <div className="w-32 shrink-0">
               <OptionCombobox
                 value={String(draftFilters.indexStatus ?? "all")}
                 onChange={handleIndexStatusFilterChange}
@@ -367,6 +370,7 @@ export function DocumentList({ knowledgeBaseId, onActionStateChange }: DocumentL
               />
             </div>
           </div>
+        </div>
         <div className="min-h-0 flex-1">
           <ScrollArea className="h-full">
             <div className={viewMode === "grid" ? "p-2 space-y-1" : "p-2 space-y-0.5"}>