fix(table-chart): fix "Search by" control visibility and improve table controls layout (#36073)

Co-authored-by: SBIN2010 <Sbin2010@mail.ru>
This commit is contained in:
innovark
2026-07-02 03:22:36 +03:00
committed by GitHub
parent af0a55a4f3
commit b3197c9b5e
5 changed files with 58 additions and 62 deletions

View File

@@ -56,6 +56,7 @@ import { PAGE_SIZE_OPTIONS } from '../consts';
import { sortAlphanumericCaseInsensitive } from './utils/sortAlphanumericCaseInsensitive';
import { SearchOption, SortByItem } from '../types';
import SearchSelectDropdown from './components/SearchSelectDropdown';
import { SupersetTheme, css } from '@apache-superset/core/theme';
export interface DataTableProps<D extends object> extends TableOptions<D> {
tableClassName?: string;
@@ -561,6 +562,9 @@ export default typedMemo(function DataTable<D extends object>({
align="center"
justify="space-between"
gap="middle"
css={(theme: SupersetTheme) => css`
font-size: ${theme.fontSizeSM}px;
`}
>
{hasPagination ? (
<SelectPageSize
@@ -576,30 +580,32 @@ export default typedMemo(function DataTable<D extends object>({
/>
) : null}
<Flex wrap align="center" gap="middle">
{serverPagination && searchInput && (
<Space size="small" className="search-select-container">
<span className="search-by-label">{t('Search by')}:</span>
<SearchSelectDropdown
searchOptions={searchOptions}
value={serverPaginationData?.searchColumn || ''}
onChange={onSearchColChange}
/>
</Space>
)}
{searchInput && (
<GlobalFilter<D>
searchInput={
typeof searchInput === 'boolean' ? undefined : searchInput
}
preGlobalFilteredRows={preGlobalFilteredRows}
setGlobalFilter={
manualSearch ? handleSearchChange : setGlobalFilter
}
filterValue={manualSearch ? initialSearchText : filterValue}
id={searchInputId}
serverPagination={!!serverPagination}
rowCount={rowCount}
/>
<>
{serverPagination && (
<Space direction="vertical" size={4}>
{t('Search by')}
<SearchSelectDropdown
searchOptions={searchOptions}
value={serverPaginationData?.searchColumn || ''}
onChange={onSearchColChange}
/>
</Space>
)}
<GlobalFilter<D>
searchInput={
typeof searchInput === 'boolean' ? undefined : searchInput
}
preGlobalFilteredRows={preGlobalFilteredRows}
setGlobalFilter={
manualSearch ? handleSearchChange : setGlobalFilter
}
filterValue={manualSearch ? initialSearchText : filterValue}
id={searchInputId}
serverPagination={!!serverPagination}
rowCount={rowCount}
/>
</>
)}
{renderTimeComparisonDropdown
? renderTimeComparisonDropdown()