Web console: add sort to tiers list (#10416)

* add sort to tiers list

* update snapshot
This commit is contained in:
Vadim Ogievetsky 2020-09-22 19:00:55 -07:00 committed by GitHub
parent 7cc0a7be68
commit ac0a45471e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 32 additions and 20 deletions

View File

@ -20,7 +20,7 @@ exports[`lookups view matches snapshot 1`] = `
columns={
Array [
"Lookup name",
"Tier",
"Lookup tier",
"Type",
"Version",
"Actions",
@ -95,7 +95,7 @@ exports[`lookups view matches snapshot 1`] = `
"show": true,
},
Object {
"Header": "Tier",
"Header": "Lookup tier",
"accessor": "tier",
"filterable": true,
"id": "tier",

View File

@ -47,10 +47,20 @@ import { LocalStorageBackedArray } from '../../utils/local-storage-backed-array'
import './lookups-view.scss';
const tableColumns: string[] = ['Lookup name', 'Tier', 'Type', 'Version', ACTION_COLUMN_LABEL];
const tableColumns: string[] = [
'Lookup name',
'Lookup tier',
'Type',
'Version',
ACTION_COLUMN_LABEL,
];
const DEFAULT_LOOKUP_TIER: string = '__default';
function tierNameCompare(a: string, b: string) {
return a.localeCompare(b);
}
export interface LookupEntriesAndTiers {
lookupEntries: any[];
tiers: string[];
@ -99,7 +109,9 @@ export class LookupsView extends React.PureComponent<LookupsViewProps, LookupsVi
processQuery: async () => {
const tiersResp = await axios.get('/druid/coordinator/v1/lookups/config?discover=true');
const tiers =
tiersResp.data && tiersResp.data.length > 0 ? tiersResp.data : [DEFAULT_LOOKUP_TIER];
tiersResp.data && tiersResp.data.length > 0
? tiersResp.data.sort(tierNameCompare)
: [DEFAULT_LOOKUP_TIER];
const lookupEntries: {}[] = [];
const lookupResp = await axios.get('/druid/coordinator/v1/lookups/config/all');
@ -304,34 +316,35 @@ export class LookupsView extends React.PureComponent<LookupsViewProps, LookupsVi
columns={[
{
Header: 'Lookup name',
show: hiddenColumns.exists('Lookup name'),
id: 'lookup_name',
accessor: 'id',
filterable: true,
show: hiddenColumns.exists('Lookup name'),
},
{
Header: 'Tier',
Header: 'Lookup tier',
show: hiddenColumns.exists('Lookup tier'),
id: 'tier',
accessor: 'tier',
filterable: true,
show: hiddenColumns.exists('Tier'),
},
{
Header: 'Type',
show: hiddenColumns.exists('Type'),
id: 'type',
accessor: 'spec.type',
filterable: true,
show: hiddenColumns.exists('Type'),
},
{
Header: 'Version',
show: hiddenColumns.exists('Version'),
id: 'version',
accessor: 'version',
filterable: true,
show: hiddenColumns.exists('Version'),
},
{
Header: ACTION_COLUMN_LABEL,
show: hiddenColumns.exists(ACTION_COLUMN_LABEL),
id: ACTION_COLUMN_ID,
width: ACTION_COLUMN_WIDTH,
accessor: (row: any) => ({ id: row.id, tier: row.tier }),
@ -352,7 +365,6 @@ export class LookupsView extends React.PureComponent<LookupsViewProps, LookupsVi
/>
);
},
show: hiddenColumns.exists(ACTION_COLUMN_LABEL),
},
]}
defaultPageSize={50}

View File

@ -316,13 +316,14 @@ ORDER BY "rank" DESC, "service" DESC`;
columns={[
{
Header: 'Service',
show: hiddenColumns.exists('Service'),
accessor: 'service',
width: 300,
Aggregated: () => '',
show: hiddenColumns.exists('Service'),
},
{
Header: 'Type',
show: hiddenColumns.exists('Type'),
accessor: 'service_type',
width: 150,
Cell: row => {
@ -339,10 +340,10 @@ ORDER BY "rank" DESC, "service" DESC`;
</a>
);
},
show: hiddenColumns.exists('Type'),
},
{
Header: 'Tier',
show: hiddenColumns.exists('Tier'),
id: 'tier',
accessor: row => {
return row.tier ? row.tier : row.worker ? row.worker.category : null;
@ -359,16 +360,16 @@ ORDER BY "rank" DESC, "service" DESC`;
</a>
);
},
show: hiddenColumns.exists('Tier'),
},
{
Header: 'Host',
show: hiddenColumns.exists('Host'),
accessor: 'host',
Aggregated: () => '',
show: hiddenColumns.exists('Host'),
},
{
Header: 'Port',
show: hiddenColumns.exists('Port'),
id: 'port',
accessor: row => {
const ports: string[] = [];
@ -381,10 +382,10 @@ ORDER BY "rank" DESC, "service" DESC`;
return ports.join(', ') || 'No port';
},
Aggregated: () => '',
show: hiddenColumns.exists('Port'),
},
{
Header: 'Curr size',
show: hiddenColumns.exists('Curr size'),
id: 'curr_size',
width: 100,
filterable: false,
@ -400,10 +401,10 @@ ORDER BY "rank" DESC, "service" DESC`;
if (row.value === null) return '';
return formatBytes(row.value);
},
show: hiddenColumns.exists('Curr size'),
},
{
Header: 'Max size',
show: hiddenColumns.exists('Max size'),
id: 'max_size',
width: 100,
filterable: false,
@ -419,10 +420,10 @@ ORDER BY "rank" DESC, "service" DESC`;
if (row.value === null) return '';
return formatBytes(row.value);
},
show: hiddenColumns.exists('Max size'),
},
{
Header: 'Usage',
show: hiddenColumns.exists('Usage'),
id: 'usage',
width: 100,
filterable: false,
@ -479,10 +480,10 @@ ORDER BY "rank" DESC, "service" DESC`;
return '';
}
},
show: hiddenColumns.exists('Usage'),
},
{
Header: 'Detail',
show: capabilities.hasCoordinatorAccess() && hiddenColumns.exists('Detail'),
id: 'queue',
width: 400,
filterable: false,
@ -542,10 +543,10 @@ ORDER BY "rank" DESC, "service" DESC`;
segmentsToDropSize,
);
},
show: capabilities.hasCoordinatorAccess() && hiddenColumns.exists('Detail'),
},
{
Header: ACTION_COLUMN_LABEL,
show: capabilities.hasOverlordAccess() && hiddenColumns.exists(ACTION_COLUMN_LABEL),
id: ACTION_COLUMN_ID,
width: ACTION_COLUMN_WIDTH,
accessor: row => row.worker,
@ -556,7 +557,6 @@ ORDER BY "rank" DESC, "service" DESC`;
const workerActions = this.getWorkerActions(row.value.host, disabled);
return <ActionCell actions={workerActions} />;
},
show: capabilities.hasOverlordAccess() && hiddenColumns.exists(ACTION_COLUMN_LABEL),
},
]}
/>