From 96d32fbfa1c0dcda85db3d06edaff36267023cfa Mon Sep 17 00:00:00 2001 From: Aijana Schumann Date: Tue, 3 Aug 2021 11:08:00 +0200 Subject: Add aria-labels to odlux tables Add aria-labels to all table action buttons Issue-ID: CCSDK-3396 Signed-off-by: Aijana Schumann Change-Id: I1c3922c1d195727265882d3e3362607ab558d603 --- .../src/views/configurationApplication.tsx | 6 ++-- .../src/components/connectionStatusLog.tsx | 2 +- sdnr/wt/odlux/apps/demoApp/pom.xml | 4 --- .../odlux/apps/eventLogApp/src/views/eventLog.tsx | 2 +- .../faultApp/src/handlers/faultAppRootHandler.ts | 10 ------ sdnr/wt/odlux/apps/faultApp/src/pluginFault.tsx | 1 + .../apps/faultApp/src/views/faultApplication.tsx | 15 +++------ .../apps/inventoryApp/src/views/dashboard.tsx | 2 +- .../maintenanceApp/src/views/maintenenceView.tsx | 4 +-- .../mediatorApp/src/views/mediatorApplication.tsx | 2 +- .../src/views/mediatorServerSelection.tsx | 4 +-- .../src/components/performanceData.tsx | 2 +- .../src/views/performanceHistoryApplication.tsx | 2 +- sdnr/wt/odlux/framework/pom.xml | 2 +- sdnr/wt/odlux/framework/src/app.tsx | 1 - .../framework/src/components/errorDisplay.tsx | 1 + .../src/components/material-table/index.tsx | 4 +-- .../src/components/material-table/tableToolbar.tsx | 12 +++---- .../framework/src/components/navigationMenu.tsx | 38 +++++++++++++--------- .../src/handlers/applicationStateHandler.ts | 5 ++- .../framework/src/models/applicationConfig.ts | 3 +- sdnr/wt/odlux/framework/src/views/home.tsx | 12 +++++++ sdnr/wt/odlux/odlux.properties | 8 ++--- 23 files changed, 74 insertions(+), 68 deletions(-) (limited to 'sdnr/wt') diff --git a/sdnr/wt/odlux/apps/configurationApp/src/views/configurationApplication.tsx b/sdnr/wt/odlux/apps/configurationApp/src/views/configurationApplication.tsx index e466dbacc..db426e814 100644 --- a/sdnr/wt/odlux/apps/configurationApp/src/views/configurationApplication.tsx +++ b/sdnr/wt/odlux/apps/configurationApp/src/views/configurationApplication.tsx @@ -588,7 +588,8 @@ class ConfigurationApplicationComponent extends React.Component { navigate("[]"); // empty key means new element }, @@ -597,7 +598,8 @@ class ConfigurationApplicationComponent extends React.Component { window.open(apiDocPathCreate, '_blank'); }, diff --git a/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx b/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx index 94b4872dd..7d2f96af3 100644 --- a/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx +++ b/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx @@ -54,7 +54,7 @@ class ConnectionStatusLogComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Connection Status Log Table', ariaLabel:'refresh', onClick: () => { this.setState({ refreshConnectionStatusLogEditorMode: RefreshConnectionStatusLogDialogMode.RefreshConnectionStatusLogTable }); diff --git a/sdnr/wt/odlux/apps/demoApp/pom.xml b/sdnr/wt/odlux/apps/demoApp/pom.xml index dae67b17b..e3f27d5c9 100644 --- a/sdnr/wt/odlux/apps/demoApp/pom.xml +++ b/sdnr/wt/odlux/apps/demoApp/pom.xml @@ -155,10 +155,6 @@ - - org.apache.maven.plugins - maven-jar-plugin - diff --git a/sdnr/wt/odlux/apps/eventLogApp/src/views/eventLog.tsx b/sdnr/wt/odlux/apps/eventLogApp/src/views/eventLog.tsx index 748c66e51..0308828c9 100644 --- a/sdnr/wt/odlux/apps/eventLogApp/src/views/eventLog.tsx +++ b/sdnr/wt/odlux/apps/eventLogApp/src/views/eventLog.tsx @@ -55,7 +55,7 @@ class EventLogComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Event log', ariaLabel:'refresh', onClick: () => { this.setState({ refreshEventLogEditorMode: RefreshEventLogDialogMode.RefreshEventLogTable }); diff --git a/sdnr/wt/odlux/apps/faultApp/src/handlers/faultAppRootHandler.ts b/sdnr/wt/odlux/apps/faultApp/src/handlers/faultAppRootHandler.ts index 46f92fbef..2ab1da2ed 100644 --- a/sdnr/wt/odlux/apps/faultApp/src/handlers/faultAppRootHandler.ts +++ b/sdnr/wt/odlux/apps/faultApp/src/handlers/faultAppRootHandler.ts @@ -30,7 +30,6 @@ import { SetPanelAction } from '../actions/panelChangeActions'; import { IFaultStatus, faultStatusHandler } from './faultStatusHandler'; import { stuckAlarmHandler } from './clearStuckAlarmsHandler'; import { PanelId } from '../models/panelId'; -import { SetPartialUpdatesAction } from '../actions/partialUpdatesAction'; export interface IFaultAppStoreState { currentProblems: ICurrentProblemsState; @@ -38,7 +37,6 @@ export interface IFaultAppStoreState { alarmLogEntries: IAlarmLogEntriesState; currentOpenPanel: PanelId | null; faultStatus: IFaultStatus; - listenForPartialUpdates: boolean; } const currentOpenPanelHandler: IActionHandler = (state = null, action) => { @@ -48,13 +46,6 @@ const currentOpenPanelHandler: IActionHandler = (state = null, a return state; } -const arePartialUpdatesActiveHandler: IActionHandler = (state = false, action) => { - if (action instanceof SetPartialUpdatesAction) { - state = action.isActive; - } - return state; -} - declare module '../../../../framework/src/store/applicationStore' { interface IApplicationStoreState { fault: IFaultAppStoreState; @@ -67,7 +58,6 @@ const actionHandlers = { alarmLogEntries: alarmLogEntriesActionHandler, currentOpenPanel: currentOpenPanelHandler, faultStatus: faultStatusHandler, - listenForPartialUpdates: arePartialUpdatesActiveHandler }; export const faultAppRootHandler = combineActionHandler(actionHandlers); diff --git a/sdnr/wt/odlux/apps/faultApp/src/pluginFault.tsx b/sdnr/wt/odlux/apps/faultApp/src/pluginFault.tsx index 06299417d..3715c623e 100644 --- a/sdnr/wt/odlux/apps/faultApp/src/pluginFault.tsx +++ b/sdnr/wt/odlux/apps/faultApp/src/pluginFault.tsx @@ -140,6 +140,7 @@ export function register() { applicationApi.applicationStoreInitialized.then(store => { store.dispatch(refreshFaultStatusAsyncAction); }); + window.setInterval(() => { applicationApi.applicationStoreInitialized.then(store => { store.dispatch(refreshFaultStatusAsyncAction); diff --git a/sdnr/wt/odlux/apps/faultApp/src/views/faultApplication.tsx b/sdnr/wt/odlux/apps/faultApp/src/views/faultApplication.tsx index 7b0c23693..0fc7b390e 100644 --- a/sdnr/wt/odlux/apps/faultApp/src/views/faultApplication.tsx +++ b/sdnr/wt/odlux/apps/faultApp/src/views/faultApplication.tsx @@ -41,7 +41,6 @@ import Refresh from '@material-ui/icons/Refresh'; import ClearStuckAlarmsDialog, { ClearStuckAlarmsDialogMode } from '../components/clearStuckAlarmsDialog'; import RefreshAlarmLogDialog, { RefreshAlarmLogDialogMode } from '../components/refreshAlarmLogDialog'; import RefreshCurrentProblemsDialog, { RefreshCurrentProblemsDialogMode } from '../components/refreshCurrentProblemsDialog'; -import { SetPartialUpdatesAction } from '../actions/partialUpdatesAction'; const mapProps = (state: IApplicationStoreState) => ({ panelId: state.fault.currentOpenPanel, @@ -58,7 +57,6 @@ const mapDisp = (dispatcher: IDispatcher) => ({ switchActivePanel: (panelId: PanelId) => { dispatcher.dispatch(setPanelAction(panelId)); }, - setPartialUpdates: (active: boolean) => dispatcher.dispatch(new SetPartialUpdatesAction(active)) }); type FaultApplicationComponentProps = RouteComponentProps & Connect; @@ -138,11 +136,11 @@ class FaultApplicationComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Current Problems List', ariaLabel:'refresh', onClick: () => { this.setState({ refreshCurrentProblemsEditorMode: RefreshCurrentProblemsDialogMode.RefreshCurrentProblemsTable }); @@ -150,7 +148,7 @@ class FaultApplicationComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Alarm log table', ariaLabel:'refresh', onClick: () => { this.setState({ refreshAlarmLogEditorMode: RefreshAlarmLogDialogMode.RefreshAlarmLogTable }); @@ -230,15 +228,12 @@ class FaultApplicationComponent extends React.Component { diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx index b672dc336..0a1bea0f1 100644 --- a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx +++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx @@ -124,7 +124,7 @@ class DashboardSelectorComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Inventory', ariaLabel: 'refresh', onClick: () => { this.setState({ refreshInventoryEditorMode: RefreshInventoryDialogMode.RefreshInventoryTable }); diff --git a/sdnr/wt/odlux/apps/maintenanceApp/src/views/maintenenceView.tsx b/sdnr/wt/odlux/apps/maintenanceApp/src/views/maintenenceView.tsx index 6b5071d90..0be28b748 100644 --- a/sdnr/wt/odlux/apps/maintenanceApp/src/views/maintenenceView.tsx +++ b/sdnr/wt/odlux/apps/maintenanceApp/src/views/maintenenceView.tsx @@ -113,7 +113,7 @@ class MaintenenceViewComponent extends React.Component { + icon: AddIcon, tooltip: 'Add', ariaLabel:'add-element', onClick: () => { const startTime = (new Date().valueOf()); const endTime = startTime; this.setState({ @@ -128,7 +128,7 @@ class MaintenenceViewComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Maintenance Entries', ariaLabel: 'refresh', onClick: () => { this.setState({ refreshMaintenenceEntriesEditorMode: RefreshMaintenanceEntriesDialogMode.RefreshMaintenanceEntriesTable }); diff --git a/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorApplication.tsx b/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorApplication.tsx index f96223297..fbf6d5774 100644 --- a/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorApplication.tsx +++ b/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorApplication.tsx @@ -151,7 +151,7 @@ class MediatorApplicationComponent extends React.Component ); - const addMediatorConfigAction = { icon: AddIcon, tooltip: 'Add', onClick: this.onOpenAddConfigurationDialog }; + const addMediatorConfigAction = { icon: AddIcon, tooltip: 'Add', ariaLabel: 'add-element', onClick: this.onOpenAddConfigurationDialog }; return (
diff --git a/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorServerSelection.tsx b/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorServerSelection.tsx index 0f4ebbe0b..be1ecc718 100644 --- a/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorServerSelection.tsx +++ b/sdnr/wt/odlux/apps/mediatorApp/src/views/mediatorServerSelection.tsx @@ -90,7 +90,7 @@ class MediatorServerSelectionComponent extends React.Component { + icon: Refresh, tooltip: 'Refresh Mediator Server Table', ariaLabel:'refresh', onClick: () => { this.setState({ refreshMediatorEditorMode: RefreshMediatorDialogMode.RefreshMediatorTable }); @@ -98,7 +98,7 @@ class MediatorServerSelectionComponent extends React.Component { + icon: AddIcon, tooltip: 'Add', ariaLabel:'add-element', onClick: () => { this.setState({ mediatorServerEditorMode: EditMediatorServerDialogMode.AddMediatorServer, mediatorServerToEdit: emptyMediatorServer, diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx index 62090245a..6a06ea351 100644 --- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx @@ -85,7 +85,7 @@ class PerformanceDataComponent extends React.Component this.props.toggleFilterButton(!this.props.isFilterVisible)} existingFilter={this.props.existingFilter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} showFilter={this.props.isFilterVisible} onChange={this.props.setSubView}> {lineChart(chartPagedData)} - + ); diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx index a0df93fe1..b0fd54c42 100644 --- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx @@ -251,7 +251,7 @@ class PerformanceHistoryComponent extends React.Component - + diff --git a/sdnr/wt/odlux/framework/pom.xml b/sdnr/wt/odlux/framework/pom.xml index 3e947539f..0e6b3cf7f 100644 --- a/sdnr/wt/odlux/framework/pom.xml +++ b/sdnr/wt/odlux/framework/pom.xml @@ -46,7 +46,7 @@ ${maven.build.timestamp} ONAP Frankfurt (Neon, mdsal ${odl.mdsal.version}) - 110.0d5d064(21/07/05) + 115.f8b3b3c(21/07/30) ONAP SDN-R | ONF Wireless for ${distversion} - Build: ${buildtime} ${buildno} ${project.version} diff --git a/sdnr/wt/odlux/framework/src/app.tsx b/sdnr/wt/odlux/framework/src/app.tsx index 7e162cd51..ada78b90f 100644 --- a/sdnr/wt/odlux/framework/src/app.tsx +++ b/sdnr/wt/odlux/framework/src/app.tsx @@ -105,4 +105,3 @@ export const runApplication = () => { }; - diff --git a/sdnr/wt/odlux/framework/src/components/errorDisplay.tsx b/sdnr/wt/odlux/framework/src/components/errorDisplay.tsx index 1060d4b6d..b2a1f1f20 100644 --- a/sdnr/wt/odlux/framework/src/components/errorDisplay.tsx +++ b/sdnr/wt/odlux/framework/src/components/errorDisplay.tsx @@ -82,6 +82,7 @@ class ErrorDisplayComponent extends React.Component { render(): JSX.Element { const { classes, state } = this.props; const errorInfo = state.framework.applicationState.errors.length && state.framework.applicationState.errors[state.framework.applicationState.errors.length - 1]; + return ( = WithStyles & { enableSelection?: boolean; disableSorting?: boolean; disableFilter?: boolean; - customActionButtons?: { icon: React.ComponentType, tooltip?: string, onClick: () => void, disabled?: boolean }[]; + customActionButtons?: { icon: React.ComponentType, tooltip?: string, ariaLabel: string, onClick: () => void, disabled?: boolean }[]; onHandleClick?(event: React.MouseEvent, rowData: TData): void; createContextMenu?: (row: TData) => React.ReactElement, React.ComponentType>>[]; }; @@ -253,8 +253,8 @@ class MaterialTableComponent extends React.Component { const entryId = getId(entry); - const isSelected = this.isSelected(entryId); const contextMenu = (this.props.createContextMenu && this.state.contextMenuInfo.index === index && this.props.createContextMenu(entry)) || null; + const isSelected = this.isSelected(entryId) || this.state.contextMenuInfo.index === index; return ( { numSelected: number | null; title?: string; tableId?: string; - customActionButtons?: { icon: React.ComponentType, tooltip?: string, onClick: () => void, disabled?: boolean }[]; + customActionButtons?: { icon: React.ComponentType, tooltip?: string, ariaLabel: string, onClick: () => void, disabled?: boolean }[]; onToggleFilter: () => void; onExportToCsv: () => void; } @@ -91,7 +91,7 @@ class TableToolbarComponent extends React.Component 0 ? classes.highlight : ''} `} >
@@ -110,7 +110,7 @@ class TableToolbarComponent extends React.Component ( - action.onClick()}> + action.onClick()}> @@ -118,20 +118,20 @@ class TableToolbarComponent extends React.Component 0 ? ( - + ) : ( - { this.props.onToggleFilter && this.props.onToggleFilter() }}> + { this.props.onToggleFilter && this.props.onToggleFilter() }}> )} diff --git a/sdnr/wt/odlux/framework/src/components/navigationMenu.tsx b/sdnr/wt/odlux/framework/src/components/navigationMenu.tsx index 437ba1b3a..b65eb29e2 100644 --- a/sdnr/wt/odlux/framework/src/components/navigationMenu.tsx +++ b/sdnr/wt/odlux/framework/src/components/navigationMenu.tsx @@ -87,9 +87,10 @@ const styles = (theme: Theme) => createStyles({ const tabletWidthBreakpoint = 768; export const NavigationMenu = withStyles(styles)(connect()(({ classes, state, dispatch }: WithStyles & Connect & Connect) => { - const { user } = state.framework.authenticationState - const isOpen = state.framework.applicationState.isMenuOpen - const closedByUser = state.framework.applicationState.isMenuClosedByUser + const { user } = state.framework.authenticationState; + const isOpen = state.framework.applicationState.isMenuOpen; + const closedByUser = state.framework.applicationState.isMenuClosedByUser; + const transportUrl = state.framework.applicationState.transportpceUrl; const [responsive, setResponsive] = React.useState(false); @@ -139,20 +140,25 @@ export const NavigationMenu = withStyles(styles)(connect()(({ classes, state, di ) || null; }) || null; - const transportPCELink = } - external/>; - - const linkFound = menuItems.find(obj=>obj.key === "linkCalculation"); - if(linkFound){ - const index = menuItems.indexOf(linkFound); - menuItems.splice(index+1,0,transportPCELink); - }else{ - menuItems.push(transportPCELink); + if(transportUrl.length>0){ + + const transportPCELink = } + external />; + + const linkFound = menuItems.find(obj => obj.key === "linkCalculation"); + + if (linkFound) { + const index = menuItems.indexOf(linkFound); + menuItems.splice(index + 1, 0, transportPCELink); + } else { + menuItems.push(transportPCELink); + } } + return ( { applicationStateInit.authentication = config.authentication === "oauth" ? "oauth" : "basic"; applicationStateInit.enablePolicy = config.enablePolicy ? true : false; + applicationStateInit.transportpceUrl=config.transportpceUrl == undefined ? "" : config.transportpceUrl; } export const applicationStateHandler: IActionHandler = (state = applicationStateInit, action) => { diff --git a/sdnr/wt/odlux/framework/src/models/applicationConfig.ts b/sdnr/wt/odlux/framework/src/models/applicationConfig.ts index 5224840eb..0ae9c266b 100644 --- a/sdnr/wt/odlux/framework/src/models/applicationConfig.ts +++ b/sdnr/wt/odlux/framework/src/models/applicationConfig.ts @@ -1,4 +1,5 @@ export type ApplicationConfig = { authentication: "basic"|"oauth", // basic - enablePolicy: false // false + enablePolicy: false, // false + transportpceUrl? : string }; \ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/views/home.tsx b/sdnr/wt/odlux/framework/src/views/home.tsx index b5df0526f..0e1d487e3 100644 --- a/sdnr/wt/odlux/framework/src/views/home.tsx +++ b/sdnr/wt/odlux/framework/src/views/home.tsx @@ -91,6 +91,9 @@ class Home extends React.Component { const connectionStatusOptions = { responsive: true, maintainAspectRatio: false, + animation: { + duration: 0 + }, plugins: { legend: { display: true, @@ -109,6 +112,9 @@ class Home extends React.Component { const connectionStatusUnavailableOptions = { responsive: true, maintainAspectRatio: false, + animation: { + duration: 0 + }, plugins: { legend: { display: true, @@ -178,6 +184,9 @@ class Home extends React.Component { const alarmStatusOptions = { responsive: true, maintainAspectRatio: false, + animation: { + duration: 0 + }, plugins: { legend: { display: true, @@ -196,6 +205,9 @@ class Home extends React.Component { const alarmStatusUnavailableOptions = { responsive: true, maintainAspectRatio: false, + animation: { + duration: 0 + }, plugins: { legend: { display: true, diff --git a/sdnr/wt/odlux/odlux.properties b/sdnr/wt/odlux/odlux.properties index 5e34ec0cd..7a69b8f07 100644 --- a/sdnr/wt/odlux/odlux.properties +++ b/sdnr/wt/odlux/odlux.properties @@ -1,12 +1,12 @@ odlux.framework.buildno=110.0d5d064(21/07/05) -odlux.apps.configurationApp.buildno=96.078ad12(21/03/25) +odlux.apps.configurationApp.buildno=103.10d8f9a(21/05/21) odlux.apps.connectApp.buildno=110.0d5d064(21/07/05) -odlux.apps.eventLogApp.buildno=96.078ad12(21/03/25) +odlux.apps.eventLogApp.buildno=103.10d8f9a(21/05/21) odlux.apps.faultApp.buildno=110.0d5d064(21/07/05) odlux.apps.helpApp.buildno=96.078ad12(21/03/25) odlux.apps.inventoryApp.buildno=108.a60ec28(21/06/11) odlux.apps.linkCalculationApp.buildno=96.078ad12(21/03/25) -odlux.apps.maintenanceApp.buildno=96.078ad12(21/03/25) -odlux.apps.mediatorApp.buildno=96.078ad12(21/03/25) +odlux.apps.maintenanceApp.buildno=103.10d8f9a(21/05/21) +odlux.apps.mediatorApp.buildno=103.10d8f9a(21/05/21) odlux.apps.networkMapApp.buildno=102.acd1c0b(21/05/07) odlux.apps.permanceHistoryApp.buildno=81.1c38886(20/12/04) -- cgit 1.2.3-korg