summaryrefslogtreecommitdiffstats
path: root/sdnr/wt/odlux/apps/connectApp/src/components
diff options
context:
space:
mode:
authorAijana Schumann <aijana.schumann@highstreet-technologies.com>2020-11-30 18:51:52 +0100
committerAijana Schumann <aijana.schumann@highstreet-technologies.com>2020-11-30 18:55:38 +0100
commitc6f98d59285656f179eea80662e86f7cf5329e59 (patch)
tree384d7bcb8061cea40599f45874a51e6f11a1759c /sdnr/wt/odlux/apps/connectApp/src/components
parentf88794b887842911b30a75afc53f87f660d1c1e7 (diff)
Add aria-labels
Add aria-labels to odlux framework and apps Issue-ID: CCSDK-2886 Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com> Change-Id: If1fdf9f8a805b567dd65bcf2cfb029b71f9235b7
Diffstat (limited to 'sdnr/wt/odlux/apps/connectApp/src/components')
-rw-r--r--sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx4
-rw-r--r--sdnr/wt/odlux/apps/connectApp/src/components/editNetworkElementDialog.tsx6
-rw-r--r--sdnr/wt/odlux/apps/connectApp/src/components/infoNetworkElementDialog.tsx14
3 files changed, 13 insertions, 11 deletions
diff --git a/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx b/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx
index 96f6c8a6b..f2fd2937d 100644
--- a/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx
+++ b/sdnr/wt/odlux/apps/connectApp/src/components/connectionStatusLog.tsx
@@ -42,9 +42,9 @@ class ConnectionStatusLogComponent extends React.Component<ConnectionStatusLogCo
render(): JSX.Element {
return (
<ConnectionStatusTable stickyHeader tableId="connection-status-table" columns={[
- { property: "timestamp", title: "Time", type: ColumnType.text },
+ { property: "timestamp", title: "Timestamp", type: ColumnType.text },
{ property: "nodeId", title: "Node Name", type: ColumnType.text },
- { property: "status", title: "Connection status", type: ColumnType.text },
+ { property: "status", title: "Connection Status", type: ColumnType.text },
]} idProperty="id" {...this.props.connectionStatusLogActions} {...this.props.connectionStatusLogProperties} >
</ConnectionStatusTable>
);
diff --git a/sdnr/wt/odlux/apps/connectApp/src/components/editNetworkElementDialog.tsx b/sdnr/wt/odlux/apps/connectApp/src/components/editNetworkElementDialog.tsx
index 3b4cf3bb5..97e6647cf 100644
--- a/sdnr/wt/odlux/apps/connectApp/src/components/editNetworkElementDialog.tsx
+++ b/sdnr/wt/odlux/apps/connectApp/src/components/editNetworkElementDialog.tsx
@@ -192,11 +192,11 @@ class EditNetworkElementDialogComponent extends React.Component<EditNetworkEleme
{setting.enableUsernameEditor && <TextField disabled={!setting.enableUsernameEditor} spellCheck={false} margin="dense" id="password" label="Password" aria-label="password" type="password" fullWidth value={this.state.password} onChange={(event) => { this.setState({ password: event.target.value }); }} /> || null}
<FormControl fullWidth disabled={!setting.enableUsernameEditor}>
<InputLabel htmlFor="active">Required</InputLabel>
- <Select value={this.state.isRequired || false} onChange={(event) => {
+ <Select aria-label="required-selection" value={this.state.isRequired || false} onChange={(event) => {
this.setState({ isRequired: event.target.value as any as boolean });
}} inputProps={{ name: 'required', id: 'required' }} fullWidth >
- <MenuItem value={true as any as string} >True</MenuItem>
- <MenuItem value={false as any as string} >False</MenuItem>
+ <MenuItem value={true as any as string} aria-label="true">True</MenuItem>
+ <MenuItem value={false as any as string} aria-label="false">False</MenuItem>
</Select>
</FormControl>
</DialogContent>
diff --git a/sdnr/wt/odlux/apps/connectApp/src/components/infoNetworkElementDialog.tsx b/sdnr/wt/odlux/apps/connectApp/src/components/infoNetworkElementDialog.tsx
index ea9d419ec..df8515e58 100644
--- a/sdnr/wt/odlux/apps/connectApp/src/components/infoNetworkElementDialog.tsx
+++ b/sdnr/wt/odlux/apps/connectApp/src/components/infoNetworkElementDialog.tsx
@@ -56,7 +56,7 @@ const settings: { [key: string]: DialogSettings } = {
[InfoNetworkElementDialogMode.InfoNetworkElement]: {
dialogTitle: "Yang capabilities of the network element",
dialogDescription: "Available capabilities of the network element",
- cancelButtonText: "Cancel",
+ cancelButtonText: "OK",
}
}
@@ -97,6 +97,8 @@ class InfoNetworkElementDialogComponent extends React.Component<InfoNetworkEleme
}
});
+ yangCapabilities = yangCapabilities.sort((a,b) => a.module === b.module ? 0 : a.module > b.module ? 1 : -1);
+
return (
<Dialog open={this.props.mode !== InfoNetworkElementDialogMode.None}>
<DialogTitle id="form-dialog-title">{setting.dialogTitle}</DialogTitle>
@@ -104,7 +106,7 @@ class InfoNetworkElementDialogComponent extends React.Component<InfoNetworkEleme
<DialogContentText>
{setting.dialogDescription + " " + this.state.nodeId}
</DialogContentText>
- <Table >
+ <Table aria-label="yang-capabilities-table">
<TableHead>
<TableRow>
<TableCell align="right">S.No</TableCell>
@@ -114,17 +116,17 @@ class InfoNetworkElementDialogComponent extends React.Component<InfoNetworkEleme
</TableHead>
<TableBody>
{yangCapabilities.map((yang, index) => (
- <TableRow>
+ <TableRow aria-label="yang-capabilities-row">
<TableCell>{index + 1}</TableCell>
- <TableCell>{yang.module}</TableCell>
- <TableCell>{yang.revision}</TableCell>
+ <TableCell aria-label="yang-module"><a href={`/yang-schema/${yang.module}`} target={"_blank"}> {yang.module} </a></TableCell>
+ <TableCell aria-label="yang-revision">{yang.revision}</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</DialogContent>
<DialogActions>
- <Button onClick={(event) => {
+ <Button aria-label="ok-button" onClick={(event) => {
this.onCancel();
event.preventDefault();
event.stopPropagation();