From 1e2f3338ed5eb880ccdfea327bd3c792b336efb6 Mon Sep 17 00:00:00 2001 From: Martin Boulais <31805063+martinboulais@users.noreply.github.com> Date: Thu, 21 Jul 2022 07:45:45 +0200 Subject: [PATCH] [O2B-659] Make active columns independent of the model + refactoring (#661) Fix some docblock types --- lib/public/Model.js | 5 ++ .../components/Filters/FlpsFilter/index.js | 6 +- .../components/Filters/LogsFilter/index.js | 5 +- .../components/Filters/RunsFilter/index.js | 40 ++++++------- lib/public/utilities/frontLink.js | 58 +++++++++++++++++++ .../{index.js => envsActiveColumns.js} | 10 +--- lib/public/views/Envs/Overview/index.js | 6 +- .../{index.js => flpsActiveColumns.js} | 9 +-- lib/public/views/Flps/Overview/index.js | 7 +-- lib/public/views/Home/Overview/index.js | 11 ++-- .../{index.js => lhcFillsActiveColumns.js} | 17 ++---- lib/public/views/LhcFills/Overview/index.js | 6 +- .../{index.js => logsActiveColumns.js} | 30 ++++------ .../reducedLogsActiveColumns.js} | 20 +------ lib/public/views/Logs/Logs.js | 24 -------- lib/public/views/Logs/Overview/index.js | 12 ++-- .../{index.js => runsActiveColumns.js} | 54 ++++++++--------- lib/public/views/Runs/Details/index.js | 8 +-- .../views/Runs/Overview/exportRunsModal.js | 7 +-- lib/public/views/Runs/Overview/index.js | 20 +++---- lib/public/views/Runs/Runs.js | 34 ++--------- lib/public/views/Subsystems/Details/index.js | 8 +-- .../{index.js => tagsActiveColumns.js} | 10 +--- lib/public/views/Tags/Details/index.js | 4 +- lib/public/views/Tags/Overview/index.js | 34 +++++------ test/public/logs/overview.test.js | 1 + 26 files changed, 199 insertions(+), 247 deletions(-) create mode 100644 lib/public/utilities/frontLink.js rename lib/public/views/Envs/ActiveColumns/{index.js => envsActiveColumns.js} (87%) rename lib/public/views/Flps/ActiveColumns/{index.js => flpsActiveColumns.js} (84%) rename lib/public/views/LhcFills/ActiveColumns/{index.js => lhcFillsActiveColumns.js} (81%) rename lib/public/views/Logs/ActiveColumns/{index.js => logsActiveColumns.js} (83%) rename lib/public/views/{Runs/ActiveColumnsLogs/index.js => Logs/ActiveColumns/reducedLogsActiveColumns.js} (74%) rename lib/public/views/Runs/ActiveColumns/{index.js => runsActiveColumns.js} (82%) rename lib/public/views/Tags/ActiveColumns/{index.js => tagsActiveColumns.js} (86%) diff --git a/lib/public/Model.js b/lib/public/Model.js index a197aa1d1d..a349f1ee16 100644 --- a/lib/public/Model.js +++ b/lib/public/Model.js @@ -21,6 +21,7 @@ import Flps from './views/Flps/Flps.js'; import Envs from './views/Envs/Envs.js'; import LhcFills from './views/LhcFills/LhcFills.js'; import { ModalModel } from './components/modal/ModalModel.js'; +import { registerFrontLinkListener } from './utilities/frontLink.js'; /** * Root of model tree @@ -77,6 +78,9 @@ export default class Model extends Observable { this.tags = new Tags(this); this.tags.bubbleTo(this); + /** + * @type {Flps} + */ this.flps = new Flps(this); this.flps.bubbleTo(this); @@ -84,6 +88,7 @@ export default class Model extends Observable { this.router = new QueryRouter(); this.router.observe(this.handleLocationChange.bind(this)); this.router.bubbleTo(this); + registerFrontLinkListener((e) => this.router.handleLinkEvent(e)); // Init pages this.handleLocationChange(); diff --git a/lib/public/components/Filters/FlpsFilter/index.js b/lib/public/components/Filters/FlpsFilter/index.js index a9f9b8f177..18692c366e 100644 --- a/lib/public/components/Filters/FlpsFilter/index.js +++ b/lib/public/components/Filters/FlpsFilter/index.js @@ -15,8 +15,10 @@ import { h } from '/js/src/index.js'; import { iconChevronBottom, iconChevronRight } from '/js/src/icons.js'; /** + * FIXME this seems bugged, model.flps.toggleFilterExpanded do not exist + * * Render a complete filter collection - * @param {Object} model The global model object + * @param {Model} model The global model object * @param {Object} columns The columns representing the table * @return {vnode} The full collection of filters accessible through dropdowns */ @@ -33,7 +35,7 @@ const filters = (model, columns) => h('', model.flps.isFilterExpanded(key) ? iconChevronBottom() : iconChevronRight()), h('.f4.ml1', column.name), ]), - model.flps.isFilterExpanded(key) && column.filter, + model.flps.isFilterExpanded(key) && typeof column.filter === 'function' ? column.filter(model) : column.filter, ]); } return accumulator; diff --git a/lib/public/components/Filters/LogsFilter/index.js b/lib/public/components/Filters/LogsFilter/index.js index 92ca7a618b..57833fb312 100644 --- a/lib/public/components/Filters/LogsFilter/index.js +++ b/lib/public/components/Filters/LogsFilter/index.js @@ -22,14 +22,13 @@ import { h } from '/js/src/index.js'; const filters = (model, columns) => h('.w-100.shadow-level1.br2', [ h('.f4.ph2', 'Filters'), - Object.entries(columns).reduce((accumulator, [key, column]) => { + Object.values(columns).reduce((accumulator, column) => { if (column.filter) { accumulator.push([ h('.flex-row.items-baseline.ph3.pv1', [ h('.w-30.f5', column.name), - h('.w-70', column.filter), + h('.w-70', typeof column.filter === 'function' ? column.filter(model) : column.filter), ]), - model.logs.isFilterExpanded(key) && column.filter, ]); } return accumulator; diff --git a/lib/public/components/Filters/RunsFilter/index.js b/lib/public/components/Filters/RunsFilter/index.js index c25601b507..887c611b49 100644 --- a/lib/public/components/Filters/RunsFilter/index.js +++ b/lib/public/components/Filters/RunsFilter/index.js @@ -15,29 +15,27 @@ import { h } from '/js/src/index.js'; /** * Render a complete filter collection - * @param {Object} model The global model object + * @param {Model} model The global model object * @param {Object} columns The columns representing the table * @return {vnode} The full collection of filters accessible through various input forms */ -const filtersRuns = (model, columns) => - h('.w-100.shadow-level1.br2', [ - h('.f4.ph2', 'Filters'), - Object.entries(columns).reduce((accumulator, [key, column]) => { - if (column.filter) { - accumulator.push([ - h('.flex-row.items-baseline.ph3.pv1', [ - h('.w-30.f5', column.name), - h('.w-70', column.filter), - ]), - model.runs.isFilterExpanded(key) && column.filter, - ]); - } - return accumulator; - }, []), - h('.p2', h('button.btn.btn-danger.mt2', { - disabled: !model.runs.isAnyFilterActive(), - onclick: () => model.runs.resetRunsParams(), - }, 'Reset all filters')), - ]); +const filtersRuns = (model, columns) => h('.w-100.shadow-level1.br2', [ + h('.f4.ph2', 'Filters'), + Object.values(columns).reduce((accumulator, column) => { + if (column.filter) { + accumulator.push([ + h('.flex-row.items-baseline.ph3.pv1', [ + h('.w-30.f5', column.name), + h('.w-70', typeof column.filter === 'function' ? column.filter(model) : column.filter), + ]), + ]); + } + return accumulator; + }, []), + h('.p2', h('button.btn.btn-danger.mt2', { + disabled: !model.runs.isAnyFilterActive(), + onclick: () => model.runs.resetRunsParams(), + }, 'Reset all filters')), +]); export default filtersRuns; diff --git a/lib/public/utilities/frontLink.js b/lib/public/utilities/frontLink.js new file mode 100644 index 0000000000..74cf9920d9 --- /dev/null +++ b/lib/public/utilities/frontLink.js @@ -0,0 +1,58 @@ +/** + * @license + * Copyright CERN and copyright holders of ALICE O2. This software is + * distributed under the terms of the GNU General Public License v3 (GPL + * Version 3), copied verbatim in the file "COPYING". + * + * See http://alice-o2.web.cern.ch/license for full licensing information. + * + * In applying this license CERN does not waive the privileges and immunities + * granted to it by virtue of its status as an Intergovernmental Organization + * or submit itself to any jurisdiction. + */ + +import { h } from '/js/src/index.js'; + +const frontLinkListeners = []; + +/** + * Register a function to be called any time one of the frontLink is triggered (the navigation event will be passed as parameter) + * + * @param {callback} listener the listener to register + * + * @return {void} + */ +export const registerFrontLinkListener = (listener) => { + frontLinkListeners.push(listener); +}; + +// eslint-disable-next-line require-jsdoc +const formatParameter = (key, value) => `${key}=${value}`; + +/** + * Return a component representing a link + * + * @param {string} text the text of the link displayed to the user + * @param {Object} page the page to which the link points to + * @param {Object} [parameters] optionally the list of query parameters, as an object + * @param {Object} [attributes] optionally the list of attributes to add to the link vnode + * + * @return {vnode} the link component + */ +export const frontLink = (text, page, parameters, attributes) => { + parameters = { + ...parameters, + page, + }; + const href = `?${Object.entries(parameters).map(([key, value]) => formatParameter(key, value)).join('&')}`; + + return h('a', { + ...attributes, + href, + onclick: (e) => { + for (const listener of frontLinkListeners) { + listener(e); + } + }, + }, text); +}; diff --git a/lib/public/views/Envs/ActiveColumns/index.js b/lib/public/views/Envs/ActiveColumns/envsActiveColumns.js similarity index 87% rename from lib/public/views/Envs/ActiveColumns/index.js rename to lib/public/views/Envs/ActiveColumns/envsActiveColumns.js index 1d2467227d..908f425f4b 100644 --- a/lib/public/views/Envs/ActiveColumns/index.js +++ b/lib/public/views/Envs/ActiveColumns/envsActiveColumns.js @@ -14,11 +14,9 @@ import { formatTimestamp } from '../../../utilities/formatting/formatTimestamp.js'; /** - * Method to receive the list of active columns for a generic Environments component - * @param {Object} _model The global model object - * @return {Object} A collection of columns. + * List of active columns for a generic Environments component */ -const activeColumns = (_model) => ({ +export const envsActiveColumns = { id: { name: 'Id', size: 'w-10', @@ -69,6 +67,4 @@ const activeColumns = (_model) => ({ balloon: true, }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Envs/Overview/index.js b/lib/public/views/Envs/Overview/index.js index bef569fa15..84ca174377 100644 --- a/lib/public/views/Envs/Overview/index.js +++ b/lib/public/views/Envs/Overview/index.js @@ -14,7 +14,7 @@ import { h } from '/js/src/index.js'; import table from '../../../components/Table/index.js'; import { amountSelector, pageSelector } from '../../../components/Pagination/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { envsActiveColumns } from '../ActiveColumns/envsActiveColumns.js'; const AVAILABLE_AMOUNTS = [5, 10, 20]; const TABLEROW_HEIGHT = 46; @@ -41,8 +41,6 @@ const envOverviewScreen = (model) => h( * @returns {Object} Html page */ const showEnvsTable = (model, envs) => { - const envsColumns = activeColumns(model); - if (!model.envs.rowCountFixed) { // Calculates the number of rows which should be visible on the page model.envs.envsPerPage = model.calculateRowDisplayAmount(TABLEROW_HEIGHT, PAGE_USED_HEIGHT); @@ -51,7 +49,7 @@ const showEnvsTable = (model, envs) => { return [ h('.w-100.flex-column', [ h('.header-container.pv2'), - table(envs, envsColumns, {}, null, '.table-sm'), + table(envs, envsActiveColumns, {}, null, '.table-sm'), pagination(model), ]), ]; diff --git a/lib/public/views/Flps/ActiveColumns/index.js b/lib/public/views/Flps/ActiveColumns/flpsActiveColumns.js similarity index 84% rename from lib/public/views/Flps/ActiveColumns/index.js rename to lib/public/views/Flps/ActiveColumns/flpsActiveColumns.js index c8eaf1c7b8..28ccb84f38 100644 --- a/lib/public/views/Flps/ActiveColumns/index.js +++ b/lib/public/views/Flps/ActiveColumns/flpsActiveColumns.js @@ -12,10 +12,9 @@ */ /** - * Method to retrieve the list of active columns for a generic table component - * @return {Object} A collection of columns with parameters for the Run table + * List of active columns for a generic table component */ -const activeColumns = () => ({ +export const flpsActiveColumns = { id: { name: 'ID', visible: false, @@ -51,6 +50,4 @@ const activeColumns = () => ({ visible: true, size: 'cell-m', }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Flps/Overview/index.js b/lib/public/views/Flps/Overview/index.js index 7f6d2e195e..c326fabe83 100644 --- a/lib/public/views/Flps/Overview/index.js +++ b/lib/public/views/Flps/Overview/index.js @@ -15,7 +15,7 @@ import { h } from '/js/src/index.js'; import filters from '../../../components/Filters/FlpsFilter/index.js'; import table from '../../../components/Table/index.js'; import { amountSelector, pageSelector } from '../../../components/Pagination/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { flpsActiveColumns } from '../ActiveColumns/flpsActiveColumns.js'; const AVAILABLE_AMOUNTS = [5, 10, 20]; @@ -26,7 +26,6 @@ const AVAILABLE_AMOUNTS = [5, 10, 20]; */ const flpOverview = (model) => { const data = model.flps.getFlps(); - const flpsColumns = activeColumns(); const amountDropdownVisible = model.flps.isAmountDropdownVisible(); const flpsPerPage = model.flps.getFlpsPerPage(); @@ -34,9 +33,9 @@ const flpOverview = (model) => { return h('', { onremove: () => model.flps.clearFlps() }, [ h('h2.mv2', 'Flp'), h('.flex-row.mv1', [ - h('.w-10', filters(model, flpsColumns)), + h('.w-10', filters(model, flpsActiveColumns)), h('.w-90', h('.w-100.flex-column.mh3', [ - table(data, flpsColumns, {}, (entry) => ({ + table(data, flpsActiveColumns, {}, (entry) => ({ onclick: () => model.router.go(`?page=flp-detail&id=${entry.id}`, ''), })), h('.flex-row.justify-between.mv3', [ diff --git a/lib/public/views/Home/Overview/index.js b/lib/public/views/Home/Overview/index.js index 6c48f566ba..bac043848a 100644 --- a/lib/public/views/Home/Overview/index.js +++ b/lib/public/views/Home/Overview/index.js @@ -12,8 +12,8 @@ */ import { h } from '/js/src/index.js'; -import { activeHomeOverviewColumns as activeLogsColumns } from '../../Logs/ActiveColumns/index.js'; -import { activeHomeOverviewColumns as activeRunsColumns } from '../../Runs/ActiveColumns/index.js'; +import { homeOverviewLogsActiveColumns } from '../../Logs/ActiveColumns/logsActiveColumns.js'; +import { homeOverviewRunsActiveColumns } from '../../Runs/ActiveColumns/runsActiveColumns.js'; import table from '../../../components/Table/index.js'; const TABLEROW_HEIGHT = 46; @@ -30,10 +30,7 @@ const HomeOverviewScreen = (model) => { model.logs.setLogsPerPage(rowCount); const logs = model.logs.getLogs(); - const logsColumns = activeLogsColumns(model); - const runs = model.runs.getRuns(); - const runsColumns = activeRunsColumns(model); model.runs.setRunsPerPage(rowCount); return h('.flex-row.w-100', [ @@ -41,11 +38,11 @@ const HomeOverviewScreen = (model) => { style: 'padding-right: 1rem;', }, [ h('h2', 'Log Entries'), - table(logs, logsColumns), + table(logs, homeOverviewLogsActiveColumns), ]), h('.flex-column.w-50', [ h('h2', 'Runs'), - table(runs, runsColumns), + table(runs, homeOverviewRunsActiveColumns), ]), ]); }; diff --git a/lib/public/views/LhcFills/ActiveColumns/index.js b/lib/public/views/LhcFills/ActiveColumns/lhcFillsActiveColumns.js similarity index 81% rename from lib/public/views/LhcFills/ActiveColumns/index.js rename to lib/public/views/LhcFills/ActiveColumns/lhcFillsActiveColumns.js index 4a884fed7a..a1dbe8964e 100644 --- a/lib/public/views/LhcFills/ActiveColumns/index.js +++ b/lib/public/views/LhcFills/ActiveColumns/lhcFillsActiveColumns.js @@ -13,15 +13,13 @@ */ import { formatTimestamp } from '../../../utilities/formatting/formatTimestamp.js'; -import { h } from '/js/src/index.js'; import { formatDuration } from '../../../utilities/formatting/formatDuration.js'; +import { frontLink } from '../../../utilities/frontLink.js'; /** - * Method to receive the list of active columns for a generic Environments component - * @param {Object} model The global model object - * @return {Object} A collection of columns. + * List of active columns for a lhc fills table */ -const activeColumns = (model) => ({ +export const lhcFillsActiveColumns = { fillNumber: { name: 'Fill Number', visible: true, @@ -65,14 +63,9 @@ const activeColumns = (model) => ({ size: 'w-15', title: true, format: (runs) => runs && runs.length > 0 ? [].concat(...runs.map(({ runNumber, id }) => [ - h('a', { - onclick: (e) => model.router.handleLinkEvent(e), - href: `?page=run-detail&id=${id}`, - }, runNumber), + frontLink(runNumber, 'run-detail', { id }), ', ', ])).slice(0, -1) : '-', balloon: true, }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/LhcFills/Overview/index.js b/lib/public/views/LhcFills/Overview/index.js index b2aa5c9989..ff5a88c631 100644 --- a/lib/public/views/LhcFills/Overview/index.js +++ b/lib/public/views/LhcFills/Overview/index.js @@ -15,7 +15,7 @@ import { h } from '/js/src/index.js'; import table from '../../../components/Table/index.js'; import { amountSelector, pageSelector } from '../../../components/Pagination/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { lhcFillsActiveColumns } from '../ActiveColumns/lhcFillsActiveColumns.js'; const AVAILABLE_AMOUNTS = [5, 10, 20]; const TABLEROW_HEIGHT = 46; @@ -38,8 +38,6 @@ const lhcFillOverviewScreen = (model) => h('', { * @returns {Object} Html page */ const showEnvsTable = (model, lhcFills) => { - const lhcFillsColumns = activeColumns(model); - if (!model.lhcFills.rowCountFixed) { // Calculates the number of rows which should be visible on the page model.lhcFills.lhcFillsPerPage = model.calculateRowDisplayAmount(TABLEROW_HEIGHT, PAGE_USED_HEIGHT); @@ -48,7 +46,7 @@ const showEnvsTable = (model, lhcFills) => { return [ h('.flex-row.header-container.pv2'), h('.w-100.flex-column', [ - table(lhcFills, lhcFillsColumns, {}, null, '.table-sm'), + table(lhcFills, lhcFillsActiveColumns, {}, null, '.table-sm'), pagination(model), ]), ]; diff --git a/lib/public/views/Logs/ActiveColumns/index.js b/lib/public/views/Logs/ActiveColumns/logsActiveColumns.js similarity index 83% rename from lib/public/views/Logs/ActiveColumns/index.js rename to lib/public/views/Logs/ActiveColumns/logsActiveColumns.js index 3995aeaa03..2b07fb1bc0 100644 --- a/lib/public/views/Logs/ActiveColumns/index.js +++ b/lib/public/views/Logs/ActiveColumns/logsActiveColumns.js @@ -33,11 +33,9 @@ const iconWithCountContainer = (count, icon) => count > 0 ? h('.flex-row.items-c ]) : '-'; /** - * Method to retrieve the list of active columns for a generic LOGS component - * @param {Object} model The global model object - * @return {Object} A collection of columns with parameters for the Log table + * List of active columns for a logs table */ -const activeColumns = (model) => ({ +export const logsActiveColumns = { id: { name: 'Entry ID', visible: false, @@ -49,7 +47,7 @@ const activeColumns = (model) => ({ sortable: true, size: 'w-30', format: (title, log) => title ? title : log.parentLogId ? `Re: log id ${log.parentLogId}` : 'Re: - ', - filter: titleFilter(model), + filter: titleFilter, balloon: true, }, author: { @@ -58,7 +56,7 @@ const activeColumns = (model) => ({ sortable: true, size: 'w-15', format: (author) => author.name, - filter: authorFilter(model), + filter: authorFilter, }, createdAt: { name: 'Created', @@ -66,7 +64,7 @@ const activeColumns = (model) => ({ sortable: true, size: 'w-10', format: (timestamp) => formatTimestamp(timestamp, false), - filter: createdFilter(model), + filter: createdFilter, }, tags: { name: 'Tags', @@ -74,7 +72,7 @@ const activeColumns = (model) => ({ sortable: true, size: 'w-15', format: (tags) => tags && tags.length > 0 ? tags.map(({ text }) => text).join(', ') : '-', - filter: remoteDataTagFilter(model.tags.getTags(), model.logs.listingTagsFilterModel), + filter: (model) => remoteDataTagFilter(model.tags.getTags(), model.logs.listingTagsFilterModel), balloon: true, }, runs: { @@ -83,7 +81,7 @@ const activeColumns = (model) => ({ sortable: true, size: 'w-15', format: (runs) => runs && runs.length > 0 ? runs.map(({ runNumber }) => runNumber).join(', ') : '-', - filter: runsFilter(model), + filter: runsFilter, balloon: true, }, parentLogId: { @@ -115,14 +113,12 @@ const activeColumns = (model) => ({ href: `?page=log-detail&id=${log.id}`, }, 'More')), }, -}); +}; /** - * Method to retrieve the list of active columns for the logs table on the home overview page - * @param {Object} model The global model object - * @return {Object} A collection of columns with parameters for the Log table + * List of active columns for the logs' table on the home overview page */ -export const activeHomeOverviewColumns = (model) => ({ +export const homeOverviewLogsActiveColumns = { id: { name: 'Entry ID', visible: false, @@ -135,7 +131,6 @@ export const activeHomeOverviewColumns = (model) => ({ size: 'w-60', expand: true, format: (title, log) => title ? title : log.parentLogId ? `Re: log id ${log.parentLogId}` : 'Re: - ', - filter: titleFilter(model), }, createdAt: { name: 'Created', @@ -143,7 +138,6 @@ export const activeHomeOverviewColumns = (model) => ({ sortable: false, size: 'w-30', format: (timestamp) => formatTimestamp(timestamp), - filter: createdFilter(model), }, actions: { name: '', @@ -157,6 +151,4 @@ export const activeHomeOverviewColumns = (model) => ({ href: `?page=log-detail&id=${log.id}`, }, 'More')), }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Runs/ActiveColumnsLogs/index.js b/lib/public/views/Logs/ActiveColumns/reducedLogsActiveColumns.js similarity index 74% rename from lib/public/views/Runs/ActiveColumnsLogs/index.js rename to lib/public/views/Logs/ActiveColumns/reducedLogsActiveColumns.js index 79582dc629..6bd42f84a6 100644 --- a/lib/public/views/Runs/ActiveColumnsLogs/index.js +++ b/lib/public/views/Logs/ActiveColumns/reducedLogsActiveColumns.js @@ -14,11 +14,6 @@ import { h } from '/js/src/index.js'; import { iconCommentSquare, iconPaperclip, iconCheck } from '/js/src/icons.js'; -import titleFilter from '../../../components/Filters/LogsFilter/title.js'; -import authorFilter from '../../../components/Filters/LogsFilter/author.js'; -import createdFilter from '../../../components/Filters/LogsFilter/created.js'; -import runsFilter from '../../../components/Filters/LogsFilter/runs.js'; -import { remoteDataTagFilter } from '../../../components/Filters/common/remoteDataTagFilter.js'; import { formatTimestamp } from '../../../utilities/formatting/formatTimestamp.js'; /** @@ -33,11 +28,9 @@ const iconWithCountContainer = (count, icon) => count > 0 ? h('.flex-row.items-c ]) : ''; /** - * Method to retrieve the list of active columns for a generic table component - * @param {Object} model The global model object - * @return {Object} A collection of columns with parameters for the Log table + * List of active columns for a logs table display in a tab for another entity's detail */ -const activeColumns = (model) => ({ +export const reducedLogsActiveColumns = { id: { name: 'Entry ID', visible: false, @@ -48,7 +41,6 @@ const activeColumns = (model) => ({ visible: true, sortable: false, size: 'w-30', - filter: titleFilter(model), }, author: { name: 'Author', @@ -56,7 +48,6 @@ const activeColumns = (model) => ({ sortable: false, size: 'w-10', format: (author) => author.name, - filter: authorFilter(model), }, createdAt: { name: 'Created', @@ -64,7 +55,6 @@ const activeColumns = (model) => ({ sortable: false, size: 'w-15', format: (timestamp) => formatTimestamp(timestamp), - filter: createdFilter(model), }, tags: { name: 'Tags', @@ -72,7 +62,6 @@ const activeColumns = (model) => ({ sortable: false, size: 'w-15', format: (tags) => tags && tags.length > 0 ? tags.map(({ text }) => text).join(', ') : '-', - filter: remoteDataTagFilter(model.tags.getTags(), model.logs.listingTagsFilterModel), }, runs: { name: 'Runs', @@ -80,7 +69,6 @@ const activeColumns = (model) => ({ sortable: false, size: 'w-20', format: (runs) => runs && runs.length > 0 ? runs.map(({ runNumber }) => runNumber).join(', ') : '-', - filter: runsFilter(model), }, parentLogId: { name: 'Parent Log Id', @@ -100,6 +88,4 @@ const activeColumns = (model) => ({ size: 'w-5 w-wrapped', format: (attachments) => iconWithCountContainer(attachments.length, iconPaperclip()), }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Logs/Logs.js b/lib/public/views/Logs/Logs.js index b718767e89..b8105a26aa 100644 --- a/lib/public/views/Logs/Logs.js +++ b/lib/public/views/Logs/Logs.js @@ -430,7 +430,6 @@ export default class LogModel extends Observable { * @return {undefined} */ resetLogsParams(fetch = true) { - this.expandedFilters = []; this.activeFilters = []; this.titleFilterText = ''; @@ -512,29 +511,6 @@ export default class LogModel extends Observable { return this.activeFilters; } - /** - * Toggle the expansion state (visibility) of a filter menu - * @param {String} targetKey The key of the filter whose visibility should be toggled - * @returns {undefined} - */ - toggleFilterExpanded(targetKey) { - if (this.isFilterExpanded(targetKey)) { - this.expandedFilters = this.expandedFilters.filter((key) => key !== targetKey); - } else { - this.expandedFilters.push(targetKey); - } - this.notify(); - } - - /** - * Check if a certain filter should be expanded (visible) - * @param {String} targetKey The key of the filter whose visibility should be checked - * @returns {Boolean} Whether the provided filter is expanded or not - */ - isFilterExpanded(targetKey) { - return this.expandedFilters.includes(targetKey); - } - /** * Returns the current title substring filter * @returns {String} The current title substring filter diff --git a/lib/public/views/Logs/Overview/index.js b/lib/public/views/Logs/Overview/index.js index c16f916cb1..f4b0b522c2 100644 --- a/lib/public/views/Logs/Overview/index.js +++ b/lib/public/views/Logs/Overview/index.js @@ -15,7 +15,7 @@ import { h } from '/js/src/index.js'; import filters from '../../../components/Filters/LogsFilter/index.js'; import table from '../../../components/Table/index.js'; import { amountSelector, pageSelector } from '../../../components/Pagination/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { logsActiveColumns } from '../ActiveColumns/logsActiveColumns.js'; const AVAILABLE_AMOUNTS = [5, 10, 20]; const TABLEROW_HEIGHT = 69; @@ -41,8 +41,6 @@ const logOverviewScreen = (model) => { * @return {vnode} Returns a vnode with the table containing the logs */ const showLogsTable = (model, logs) => { - const logsColumns = activeColumns(model); - if (!model.logs.getRowCountIsFixed()) { // Calculates the number of rows which should be visible on the page const logsPerPage = model.calculateRowDisplayAmount(TABLEROW_HEIGHT, PAGE_USED_HEIGHT); @@ -52,14 +50,14 @@ const showLogsTable = (model, logs) => { return [ h('.flex-row.header-container.pv2', [ filterLogsButton(model.logs), - filterPanel(model, logsColumns), + filterPanel(model, logsActiveColumns), h(`.w-50.filters${model.logs.isAnyFilterActive() && !model.logs.getShowFilters() ? '.display-block' : '.display-none'}`, h('.f5'), `Active filters: ${model.logs.getActiveFilters().join(', ')}`), addLogsButton(model), ]), h('.w-100.flex-column', [ - table(logs, logsColumns, { sortModel: model.logs.overviewSortModel }), + table(logs, logsActiveColumns, { sortModel: model.logs.overviewSortModel }), pagination(model), ]), ]; @@ -86,8 +84,8 @@ const filterLogsButton = (logs) => /** * Builds a panel containing possible filters for logs - * @param {object} model Global model to access functions - * @param {JSON} logsColumns - JSON containing columns displayed and their properties + * @param {Model} model Global model to access functions + * @param {object} logsColumns - JSON containing columns displayed and their properties * @returns {vnode} A panel with filters */ const filterPanel = (model, logsColumns) => diff --git a/lib/public/views/Runs/ActiveColumns/index.js b/lib/public/views/Runs/ActiveColumns/runsActiveColumns.js similarity index 82% rename from lib/public/views/Runs/ActiveColumns/index.js rename to lib/public/views/Runs/ActiveColumns/runsActiveColumns.js index 7afa8b0aab..74e2b4c5fc 100644 --- a/lib/public/views/Runs/ActiveColumns/index.js +++ b/lib/public/views/Runs/ActiveColumns/runsActiveColumns.js @@ -23,7 +23,7 @@ import detectorsFilter from '../../../components/Filters/RunsFilter/detectors.js import ddflpFilter from '../../../components/Filters/RunsFilter/ddflp.js'; import dcsFilter from '../../../components/Filters/RunsFilter/dcs.js'; import epnFilter from '../../../components/Filters/RunsFilter/epn.js'; -import runQuality from '../../../components/Filters/RunsFilter/runQuality.js'; +import runQualityFilter from '../../../components/Filters/RunsFilter/runQuality.js'; import { remoteDataTagFilter } from '../../../components/Filters/common/remoteDataTagFilter.js'; import { formatTimestamp } from '../../../utilities/formatting/formatTimestamp.js'; import { durationFilter } from '../../../components/Filters/RunsFilter/durationFilter.js'; @@ -31,11 +31,9 @@ import { formatRunDuration } from '../formatRunDuration.js'; import fillNumbersFilter from '../../../components/Filters/RunsFilter/fillNumbers.js'; /** - * Method to retrieve the list of active columns for a generic table component - * @param {Object} model The global model object - * @return {Object} A collection of columns with parameters for the Run table + * List of active columns for a generic runs table */ -const activeColumns = (model) => ({ +export const runsActiveColumns = { id: { name: 'ID', visible: false, @@ -45,20 +43,20 @@ const activeColumns = (model) => ({ name: 'Run', visible: true, size: 'w-5 f6 w-wrapped', - filter: runNumberFilter(model), + filter: runNumberFilter, format: (text, run) => h('a', { href: `?page=run-detail&id=${run.id}` }, text), }, detectors: { name: 'Detectors', visible: true, size: 'w-20 f6', - format: (detectors, model) => { + format: (detectors, run) => { if (detectors && detectors.length > 0) { - return [h('.badge.bg-gray-light.mh2.nDetectors-badge', model.nDetectors), `${detectors.toString()}`]; + return [h('.badge.bg-gray-light.mh2.nDetectors-badge', run.nDetectors), `${detectors.toString()}`]; } return '-'; }, - filter: detectorsFilter(model), + filter: detectorsFilter, balloon: true, }, tags: { @@ -67,7 +65,7 @@ const activeColumns = (model) => ({ size: 'w-15 f6', format: (tags) => tags && tags.length > 0 ? tags.map(({ text }) => text).join(', ') : '-', exportFormat: (tags) => tags && tags.length > 0 ? tags.map(({ text }) => text).join(', ') : '-', - filter: remoteDataTagFilter(model.tags.getTags(), model.runs.listingTagsFilterModel), + filter: (model) => remoteDataTagFilter(model.tags.getTags(), model.runs.listingTagsFilterModel), balloon: (tags) => tags && tags.length > 0, }, fillNumber: { @@ -75,7 +73,7 @@ const activeColumns = (model) => ({ visible: true, size: 'w-5 f6', format: (fill) => fill !== null ? fill : '-', - filter: fillNumbersFilter(model), + filter: fillNumbersFilter, }, timeO2Start: { name: 'O2 Start', @@ -83,7 +81,7 @@ const activeColumns = (model) => ({ size: 'w-7 f6 w-wrapped', format: (timestamp) => formatTimestamp(timestamp, false), exportFormat: (timestamp) => formatTimestamp(timestamp), - filter: o2startFilter(model), + filter: o2startFilter, }, timeO2End: { name: 'O2 Stop', @@ -91,7 +89,7 @@ const activeColumns = (model) => ({ size: 'w-7 f6 w-wrapped', format: (timestamp) => formatTimestamp(timestamp, false), exportFormat: (timestamp) => formatTimestamp(timestamp), - filter: o2endFilter(model), + filter: o2endFilter, }, timeTrgStart: { name: 'TRG Start', @@ -113,13 +111,13 @@ const activeColumns = (model) => ({ size: 'w-10 f6 w-wrapped', format: (_duration, run) => formatRunDuration(run), exportFormat: (_duration, run) => formatRunDuration(run, true), - filter: durationFilter(model), + filter: durationFilter, }, environmentId: { name: 'Environment ID', visible: true, size: 'w-10 f6 w-wrapped', - filter: environmentIdFilter(model), + filter: environmentIdFilter, }, runType: { name: 'Run Type', @@ -131,19 +129,19 @@ const activeColumns = (model) => ({ visible: true, size: 'w-5 f6 w-wrapped', format: (runQuality) => runQuality ? runQuality : '-', - filter: runQuality(model), + filter: runQualityFilter, }, nDetectors: { name: 'DETs #', visible: false, size: 'w-2 f6 w-wrapped', - filter: nDetectorsFilter(model), + filter: nDetectorsFilter, }, nFlps: { name: 'FLPs #', visible: true, size: 'w-2 f6 w-wrapped', - filter: nFlpsFilter(model), + filter: nFlpsFilter, }, nEpns: { name: 'EPNs #', @@ -166,7 +164,7 @@ const activeColumns = (model) => ({ size: 'w-2 f6 w-wrapped', format: (boolean) => boolean ? 'On' : 'Off', exportFormat: (boolean) => boolean ? 'On' : 'Off', - filter: ddflpFilter(model), + filter: ddflpFilter, }, dcs: { name: 'DCS', @@ -174,7 +172,7 @@ const activeColumns = (model) => ({ size: 'w-2 f6 w-wrapped', format: (boolean) => boolean ? 'On' : 'Off', exportFormat: (boolean) => boolean ? 'On' : 'Off', - filter: dcsFilter(model), + filter: dcsFilter, }, epn: { name: 'EPN', @@ -182,23 +180,21 @@ const activeColumns = (model) => ({ size: 'w-2 f6 w-wrapped', format: (boolean) => boolean ? 'On' : 'Off', exportFormat: (boolean) => boolean ? 'On' : 'Off', - filter: epnFilter(model), + filter: epnFilter, }, epnTopology: { name: 'EPN Topology', visible: true, size: 'w-15 f6', - filter: epnTopologyFilter(model), + filter: epnTopologyFilter, balloon: true, }, -}); +}; /** - * Method to retrieve the list of active home overview columns for a generic table component - * @param {Object} _model The global model object - * @return {Object} A collection of columns with parameters for the Run table + * List of active home overview columns for a runs table component */ -export const activeHomeOverviewColumns = (_model) => ({ +export const homeOverviewRunsActiveColumns = { runNumber: { name: 'Number', visible: true, @@ -226,6 +222,4 @@ export const activeHomeOverviewColumns = (_model) => ({ href: `?page=run-detail&id=${run.id}`, }, 'More')), }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Runs/Details/index.js b/lib/public/views/Runs/Details/index.js index 516cf40aa5..2797b88cdd 100644 --- a/lib/public/views/Runs/Details/index.js +++ b/lib/public/views/Runs/Details/index.js @@ -16,8 +16,8 @@ import errorAlert from '../../../components/common/errorAlert.js'; import spinner from '../../../components/common/spinner.js'; import table from '../../../components/Table/index.js'; import targetURL from '../../../utilities/targetURL.js'; -import activeColumns from '../../Runs/ActiveColumnsLogs/index.js'; -import activeColumnsFLP from '../../Flps/ActiveColumns/index.js'; +import { reducedLogsActiveColumns } from '../../Logs/ActiveColumns/reducedLogsActiveColumns.js'; +import { flpsActiveColumns } from '../../Flps/ActiveColumns/flpsActiveColumns.js'; import runDetail from '../../../components/RunDetail/index.js'; import editTagsPanel from './editTagsPanel.js'; import lhcFillPanel from './lhcFillPanel.js'; @@ -47,7 +47,7 @@ const runDetails = (model) => { const panels = { logs: { name: 'Log Entries', - content: table(dataLogs, activeColumns(model), {}, (entry) => ({ + content: table(dataLogs, reducedLogsActiveColumns, {}, (entry) => ({ style: { cursor: 'pointer', }, @@ -56,7 +56,7 @@ const runDetails = (model) => { }, flps: { name: 'FLP Statistics', - content: table(dataFlps, activeColumnsFLP(), {}, (entry) => ({ + content: table(dataFlps, flpsActiveColumns, {}, (entry) => ({ style: { cursor: 'pointer', }, diff --git a/lib/public/views/Runs/Overview/exportRunsModal.js b/lib/public/views/Runs/Overview/exportRunsModal.js index 70d112d617..86d0ce5ec2 100644 --- a/lib/public/views/Runs/Overview/exportRunsModal.js +++ b/lib/public/views/Runs/Overview/exportRunsModal.js @@ -12,7 +12,7 @@ */ import { h } from '/js/src/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { runsActiveColumns } from '../ActiveColumns/runsActiveColumns.js'; import pick from '../../../utilities/pick.js'; /** @@ -28,8 +28,7 @@ const exportForm = (model, runs, modalHandler) => { const exportTypes = ['JSON', 'CSV']; const selectedRunsFields = model.runs.getSelectedRunsFields() || []; const selectedExportType = model.runs.getSelectedExportType() || exportTypes[0]; - const currentActiveColumns = activeColumns(model); - const runsFields = Object.keys(currentActiveColumns); + const runsFields = Object.keys(runsActiveColumns); const enabled = runs && selectedRunsFields.length > 0 && Boolean(selectedExportType); return [ @@ -82,7 +81,7 @@ const exportForm = (model, runs, modalHandler) => { runs.map((selectedRun) => { const entries = Object.entries(pick(selectedRun, selectedRunsFields)); const formattedEntries = entries.map(([key, value]) => { - const formatExport = currentActiveColumns[key].exportFormat || ((identity) => identity); + const formatExport = runsActiveColumns[key].exportFormat || ((identity) => identity); return [key, formatExport(value, selectedRun)]; }); return Object.fromEntries(formattedEntries); diff --git a/lib/public/views/Runs/Overview/index.js b/lib/public/views/Runs/Overview/index.js index 0384d7c980..0bb0dc7acb 100644 --- a/lib/public/views/Runs/Overview/index.js +++ b/lib/public/views/Runs/Overview/index.js @@ -15,7 +15,7 @@ import { h } from '/js/src/index.js'; import filtersRuns from '../../../components/Filters/RunsFilter/index.js'; import table from '../../../components/Table/index.js'; import { amountSelector, pageSelector } from '../../../components/Pagination/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { runsActiveColumns } from '../ActiveColumns/runsActiveColumns.js'; import { exportRunsModal } from './exportRunsModal.js'; const AVAILABLE_AMOUNTS = [5, 10, 20]; @@ -25,7 +25,7 @@ const PAGE_USED_HEIGHT = 215; /** * Table row header - * @param {object} model Pass the model to access the defined functions + * @param {Model} model Pass the model to access the defined functions * @return {vnode} Return the view of the table with the filtering options */ const runsOverview = (model) => h('', { @@ -34,13 +34,11 @@ const runsOverview = (model) => h('', { /** * Build components in case of runs retrieval success - * @param {object} model model to access global functions + * @param {Model} model model to access global functions * @param {Array} runs list of runs retrieved from server * @return {vnode} Returns a vnode with the table containing the runs */ const showRunsTable = (model, runs) => { - const runsColumns = activeColumns(model); - if (!model.runs.getRowCountIsFixed()) { const runsPerPage = model.calculateRowDisplayAmount(TABLEROW_HEIGHT, PAGE_USED_HEIGHT); model.runs.setRunsPerPage(runsPerPage); @@ -48,14 +46,14 @@ const showRunsTable = (model, runs) => { return [ h('.flex-row.header-container.pv2', [ filterRunsButton(model.runs), - filterPanel(model, runsColumns), + filterPanel(model, runsActiveColumns), h(`.w-60.filters${model.runs.isAnyFilterActive() && !model.runs.getShowFilters() ? '.display-block' : '.display-none'}`, h('.f5'), `Active filters: ${model.runs.getActiveFilters().join(', ')}`), exportRunsButton(model), ]), h('.flex-column.w-100', [ - table(runs, runsColumns), + table(runs, runsActiveColumns), pagination(model), ]), ]; @@ -63,7 +61,7 @@ const showRunsTable = (model, runs) => { /** * Build a button which operates the display of filters box - * @param {Runs.js} runs to access Runs functions + * @param {RunModel} runs to access Runs functions * @returns {vnode} vnode with button */ const filterRunsButton = (runs) => @@ -82,8 +80,10 @@ const filterRunsButton = (runs) => /** * Builds a panel containing possible filters for runs - * @param {object} model global model to access functions - * @param {JSON} runsColumns - JSON containing columns displayed and their properties + * + * @param {Model} model global model to access functions + * @param {object} runsColumns columns displayed and their properties + * * @returns {vnode} panel with filters for Runs table */ const filterPanel = (model, runsColumns) => h(`.w-25.filters${model.runs.getShowFilters() ? '.display-block' : '.display-none'}`, { diff --git a/lib/public/views/Runs/Runs.js b/lib/public/views/Runs/Runs.js index a50ce85ef4..e091e8c7be 100644 --- a/lib/public/views/Runs/Runs.js +++ b/lib/public/views/Runs/Runs.js @@ -367,7 +367,6 @@ export default class RunModel extends Observable { * @return {undefined} */ resetRunsParams(fetch = true) { - this.expandedFilters = []; this.activeFilters = []; this.runFilterOperation = 'AND'; @@ -636,8 +635,6 @@ export default class RunModel extends Observable { this.collapsedColumns = []; this.collapsableColumns = []; - this.expandedFilters = []; - this.amountDropdownVisible = false; this.runsPerPage = 10; this.selectedPage = 1; @@ -1049,7 +1046,7 @@ export default class RunModel extends Observable { /** * Sets whether the filters are shown or not * @param {Boolean} showFilters Whether the filter should be shown - * @returns {Boolean} returns boolean + * @returns {void} */ setShowFilters(showFilters) { this.showFilters = showFilters; @@ -1058,36 +1055,13 @@ export default class RunModel extends Observable { /** * Toggles whether the filters are shown - * @returns {Boolean} returns boolean + * @returns {void} */ toggleShowFilters() { this.setShowFilters(!this.getShowFilters()); this.notify(); } - /** - * Toggle the expansion state (visibility) of a filter menu - * @param {String} targetKey The key of the filter whose visibility should be toggled - * @returns {undefined} - */ - toggleFilterExpanded(targetKey) { - if (this.isFilterExpanded(targetKey)) { - this.expandedFilters = this.expandedFilters.filter((key) => key !== targetKey); - } else { - this.expandedFilters.push(targetKey); - } - this.notify(); - } - - /** - * Check if a certain filter should be expanded (visible) - * @param {String} targetKey The key of the filter whose visibility should be checked - * @returns {Boolean} Whether the provided filter is expanded or not - */ - isFilterExpanded(targetKey) { - return this.expandedFilters.includes(targetKey); - } - /** * Returns whether the number of rows is fixed * @returns {Boolean} whether the number of visible rows is fixed @@ -1099,7 +1073,7 @@ export default class RunModel extends Observable { /** * Sets if the rowCount should be fixed or not * @param {Boolean} fixed whether the number of visible rows should be fixed or not - * @returns {Boolean} return boolean + * @returns {void} */ setRowCountFixed(fixed) { this.rowCountFixed = fixed; @@ -1117,7 +1091,7 @@ export default class RunModel extends Observable { * @param {boolean} value parameter to specify if user is in edit mode */ set isEditModeEnabled(value) { - this._isEditModeEnabled = value ? true : false; + this._isEditModeEnabled = value; this.notify(); } diff --git a/lib/public/views/Subsystems/Details/index.js b/lib/public/views/Subsystems/Details/index.js index 36a06f49e0..3ccf0f250b 100644 --- a/lib/public/views/Subsystems/Details/index.js +++ b/lib/public/views/Subsystems/Details/index.js @@ -15,13 +15,13 @@ import { h } from '/js/src/index.js'; import spinner from '../../../components/common/spinner.js'; import table from '../../../components/Table/index.js'; import targetURL from '../../../utilities/targetURL.js'; -import activeColumns from '../../Logs/ActiveColumns/index.js'; +import { logsActiveColumns } from '../../Logs/ActiveColumns/logsActiveColumns.js'; /** * The VNode of the Subsystem Detail screen. * - * @param {*} model Pass the model to access the defined functions. - * @return {vnode} The VNode of the Subsystem Detail screen. + * @param {Model} model Pass the model to access the defined functions. + * @return {vnode|void} The VNode of the Subsystem Detail screen. */ const subsystemDetails = (model) => { if (!model.router.params.id) { @@ -47,7 +47,7 @@ const subsystemDetails = (model) => { }, logs: { name: 'Logs with this subsystem', - content: table(dataLogs, activeColumns(model), {}, (entry) => ({ + content: table(dataLogs, logsActiveColumns, {}, (entry) => ({ style: { cursor: 'pointer', }, diff --git a/lib/public/views/Tags/ActiveColumns/index.js b/lib/public/views/Tags/ActiveColumns/tagsActiveColumns.js similarity index 86% rename from lib/public/views/Tags/ActiveColumns/index.js rename to lib/public/views/Tags/ActiveColumns/tagsActiveColumns.js index ba644e59f8..7664f45d94 100644 --- a/lib/public/views/Tags/ActiveColumns/index.js +++ b/lib/public/views/Tags/ActiveColumns/tagsActiveColumns.js @@ -14,11 +14,9 @@ import { formatTimestamp } from '../../../utilities/formatting/formatTimestamp.js'; /** - * Method to retrieve the list of active columns for a generic table component - * @param {Object} model The global model object - * @return {Object} A collection of columns with parameters for the Tag table + * List of active columns for a tags table */ -const activeColumns = () => ({ +export const tagsActiveColumns = { id: { visible: false, primary: true, @@ -62,6 +60,4 @@ const activeColumns = () => ({ format: (email) => email || '-', sortable: false, }, -}); - -export default activeColumns; +}; diff --git a/lib/public/views/Tags/Details/index.js b/lib/public/views/Tags/Details/index.js index e6088656cf..da32f31e95 100644 --- a/lib/public/views/Tags/Details/index.js +++ b/lib/public/views/Tags/Details/index.js @@ -16,7 +16,7 @@ import errorAlert from '../../../components/common/errorAlert.js'; import spinner from '../../../components/common/spinner.js'; import table from '../../../components/Table/index.js'; import targetURL from '../../../utilities/targetURL.js'; -import activeColumns from '../../Runs/ActiveColumnsLogs/index.js'; +import { reducedLogsActiveColumns } from '../../Logs/ActiveColumns/reducedLogsActiveColumns.js'; import tagDetail from '../../../components/TagDetail/index.js'; /** @@ -45,7 +45,7 @@ const tagDetails = (model) => { const panels = { logs: { name: 'Logs with this tag', - content: table(dataLogs, activeColumns(model), {}, (entry) => ({ + content: table(dataLogs, reducedLogsActiveColumns, {}, (entry) => ({ style: { cursor: 'pointer', }, diff --git a/lib/public/views/Tags/Overview/index.js b/lib/public/views/Tags/Overview/index.js index 7eed7e776c..ba2a41d4fa 100644 --- a/lib/public/views/Tags/Overview/index.js +++ b/lib/public/views/Tags/Overview/index.js @@ -13,7 +13,7 @@ import { h } from '/js/src/index.js'; import table from '../../../components/Table/index.js'; -import activeColumns from '../ActiveColumns/index.js'; +import { tagsActiveColumns } from '../ActiveColumns/tagsActiveColumns.js'; /** * Table row header @@ -28,24 +28,20 @@ const tagOverview = (model) => h('', { onremove: () => model.tags.overview.reset * @param {RemoteData} tags list of tags retrieved from server * @return {vnode} Returns a vnode with the table containing the tags */ -const showTagsTable = (model, tags) => { - const tagsColumns = activeColumns(); - - return [ - h('.flex-row.justify-between.items-center', [ - h('h2', 'Tags'), - h('button.btn.btn-primary.w-15#create', { - onclick: () => model.router.go('/?page=tag-create'), - }, 'Create tag'), - ]), - h('.flex-row', [ - h('.w-100.flex-column', [ - table(tags, tagsColumns, { filterModel: model.tags.overview }, (entry) => ({ - onclick: () => model.router.go(`?page=tag-detail&id=${entry.id}`), - }), '.clickable'), - ]), +const showTagsTable = (model, tags) => [ + h('.flex-row.justify-between.items-center', [ + h('h2', 'Tags'), + h('button.btn.btn-primary.w-15#create', { + onclick: () => model.router.go('/?page=tag-create'), + }, 'Create tag'), + ]), + h('.flex-row', [ + h('.w-100.flex-column', [ + table(tags, tagsActiveColumns, { filterModel: model.tags.overview }, (entry) => ({ + onclick: () => model.router.go(`?page=tag-detail&id=${entry.id}`), + }), '.clickable'), ]), - ]; -}; + ]), +]; export default (model) => [tagOverview(model)]; diff --git a/test/public/logs/overview.test.js b/test/public/logs/overview.test.js index 01eaa55c04..32c89b3390 100644 --- a/test/public/logs/overview.test.js +++ b/test/public/logs/overview.test.js @@ -140,6 +140,7 @@ module.exports = () => { // eslint-disable-next-line no-undef model.logs.resetLogsParams(); }); + await page.waitForNetworkIdle(); await page.waitForTimeout(100); // Expect the total number of rows to once more equal the original total