diff --git a/public/app/features/search/page/components/columns.tsx b/public/app/features/search/page/components/columns.tsx index 52944030918..36666951f36 100644 --- a/public/app/features/search/page/components/columns.tsx +++ b/public/app/features/search/page/components/columns.tsx @@ -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 ( -