mirror of
https://github.com/danny-avila/LibreChat.git
synced 2026-01-08 03:28:51 +01:00
refactor(DataTable): simplify search handling by removing unnecessary trimming; adjust column width handling for better responsiveness
This commit is contained in:
parent
1cbe3e1326
commit
c6df907734
4 changed files with 11 additions and 13 deletions
|
|
@ -73,12 +73,11 @@ export default function SharedLinks() {
|
|||
const [allKnownLinks, setAllKnownLinks] = useState<SharedLinkItem[]>([]);
|
||||
|
||||
const handleSearchChange = useCallback((value: string) => {
|
||||
const trimmedValue = value.trim();
|
||||
setSearchValue(trimmedValue);
|
||||
setSearchValue(value);
|
||||
setAllKnownLinks([]);
|
||||
setQueryParams((prev) => ({
|
||||
...prev,
|
||||
search: trimmedValue,
|
||||
search: value,
|
||||
}));
|
||||
}, []);
|
||||
|
||||
|
|
|
|||
|
|
@ -97,11 +97,10 @@ export default function ArchivedChatsTable() {
|
|||
});
|
||||
|
||||
const handleSearchChange = useCallback((value: string) => {
|
||||
const trimmedValue = value.trim();
|
||||
setSearchValue(trimmedValue);
|
||||
setSearchValue(value);
|
||||
setQueryParams((prev) => ({
|
||||
...prev,
|
||||
search: trimmedValue,
|
||||
search: value,
|
||||
}));
|
||||
}, []);
|
||||
|
||||
|
|
|
|||
|
|
@ -464,7 +464,7 @@ function DataTable<TData extends Record<string, unknown>, TValue>({
|
|||
role="table"
|
||||
aria-label={localize('com_ui_data_table')}
|
||||
aria-rowcount={data.length}
|
||||
className="table-fixed"
|
||||
className="table-auto"
|
||||
unwrapped={true}
|
||||
>
|
||||
<TableHeader className="sticky top-0 z-10 bg-surface-secondary">
|
||||
|
|
@ -516,9 +516,7 @@ function DataTable<TData extends Record<string, unknown>, TValue>({
|
|||
? {
|
||||
width: `${metaWidth}%`,
|
||||
maxWidth: `${metaWidth}%`,
|
||||
minWidth: isSmallScreen
|
||||
? `${Math.max(metaWidth * 0.7, 10)}%`
|
||||
: `${metaWidth}%`,
|
||||
minWidth: `${metaWidth}%`,
|
||||
}
|
||||
: {};
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -47,6 +47,7 @@ interface TableRowComponentProps<TData extends Record<string, unknown>> {
|
|||
selected: boolean;
|
||||
}
|
||||
|
||||
// ...existing code...
|
||||
const TableRowComponent = <TData extends Record<string, unknown>>(
|
||||
{ row, virtualIndex, style, selected }: TableRowComponentProps<TData>,
|
||||
ref: React.Ref<HTMLTableRowElement>,
|
||||
|
|
@ -72,11 +73,11 @@ const TableRowComponent = <TData extends Record<string, unknown>>(
|
|||
const widthStyle =
|
||||
cell.column.id === 'select'
|
||||
? { width: '32px', maxWidth: '32px', minWidth: '32px' }
|
||||
: percent && percent >= 1 && percent <= 100
|
||||
: percent
|
||||
? {
|
||||
width: `${percent}%`,
|
||||
maxWidth: `${percent}%`,
|
||||
minWidth: isSmallScreen ? `${Math.max(percent * 0.7, 10)}%` : `${percent}%`,
|
||||
minWidth: `${percent}%`, // Don't shrink on mobile
|
||||
}
|
||||
: undefined;
|
||||
|
||||
|
|
@ -93,7 +94,7 @@ const TableRowComponent = <TData extends Record<string, unknown>>(
|
|||
<CellComponent
|
||||
key={cell.id}
|
||||
className={cn(
|
||||
'truncate px-2 py-2 md:px-3 md:py-3',
|
||||
'max-w-0 truncate px-2 py-2 md:px-3 md:py-3',
|
||||
cell.column.id === 'select' && 'w-8 p-1',
|
||||
meta?.className,
|
||||
isDesktopOnly && 'hidden md:table-cell',
|
||||
|
|
@ -108,6 +109,7 @@ const TableRowComponent = <TData extends Record<string, unknown>>(
|
|||
</TableRow>
|
||||
);
|
||||
};
|
||||
// ...existing code...
|
||||
|
||||
type ForwardTableRowComponentType = <TData extends Record<string, unknown>>(
|
||||
props: TableRowComponentProps<TData> & React.RefAttributes<HTMLTableRowElement>,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue