mirror of
https://github.com/grafana/grafana.git
synced 2025-02-11 08:05:43 -06:00
Search: Adjust table structure (#48933)
* Search: Adjust table structure * Always include tags column
This commit is contained in:
parent
683c1c0f40
commit
8b5f899912
@ -12,10 +12,10 @@ import { SelectionChecker, SelectionToggle } from '../selection';
|
||||
|
||||
import { TableColumn } from './SearchResultsTable';
|
||||
|
||||
const TYPE_COLUMN_WIDTH = 130;
|
||||
const TYPE_COLUMN_WIDTH = 250;
|
||||
const DATASOURCE_COLUMN_WIDTH = 200;
|
||||
const LOCATION_COLUMN_WIDTH = 200;
|
||||
const TAGS_COLUMN_WIDTH = 200;
|
||||
const TAGS_COLUMN_WIDTH = 300;
|
||||
|
||||
export const generateColumns = (
|
||||
response: QueryResponse,
|
||||
@ -111,14 +111,7 @@ export const generateColumns = (
|
||||
availableWidth -= width;
|
||||
}
|
||||
|
||||
// Show tags if we have any
|
||||
if (access.tags) {
|
||||
width = TAGS_COLUMN_WIDTH;
|
||||
columns.push(makeTagsColumn(access.tags, width, styles.tagList, onTagSelected));
|
||||
availableWidth -= width;
|
||||
}
|
||||
|
||||
width = Math.max(availableWidth, LOCATION_COLUMN_WIDTH);
|
||||
width = Math.max(availableWidth - TAGS_COLUMN_WIDTH, LOCATION_COLUMN_WIDTH);
|
||||
const meta = response.view.dataFrame.meta?.custom as SearchResultMeta;
|
||||
if (meta?.locationInfo) {
|
||||
columns.push({
|
||||
@ -152,8 +145,11 @@ export const generateColumns = (
|
||||
Header: 'Location',
|
||||
width,
|
||||
});
|
||||
availableWidth -= width;
|
||||
}
|
||||
|
||||
columns.push(makeTagsColumn(access.tags, availableWidth, styles.tagList, onTagSelected));
|
||||
|
||||
return columns;
|
||||
};
|
||||
|
||||
@ -282,14 +278,11 @@ function makeTagsColumn(
|
||||
return {
|
||||
Cell: (p) => {
|
||||
const tags = field.values.get(p.row.index);
|
||||
if (tags) {
|
||||
return (
|
||||
<div {...p.cellProps} className={p.cellStyle}>
|
||||
<TagList className={tagListClass} tags={tags} onClick={onTagSelected} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
return tags ? (
|
||||
<div {...p.cellProps} className={p.cellStyle}>
|
||||
<TagList className={tagListClass} tags={tags} onClick={onTagSelected} />
|
||||
</div>
|
||||
) : null;
|
||||
},
|
||||
id: `column-tags`,
|
||||
field: field,
|
||||
|
Loading…
Reference in New Issue
Block a user