ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add aria lables to pod drop down and tables of PG resources (#16229)

Browse Source 
* Add aria labels to pod drop down on resource health and tables on overview

* Added roles

* Fix strings

* Added role to table headers

* Added heading levels
This commit is contained in:
nasc17
2021-07-22 12:07:35 -07:00
committed by GitHub
parent 380457122c
commit 64d432c8e2
3 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
extensions/arc/src/localizedConstants.ts
View File

@@ -73,6 +73,7 @@ export const grafanaDashboard = localize('arc.grafanaDashboard', "Grafana Dashbo
export const kibanaDashboardDescription = localize('arc.kibanaDashboardDescription', "Dashboard for viewing logs");
export const grafanaDashboardDescription = localize('arc.grafanaDashboardDescription', "Dashboard for viewing metrics");
export const serviceEndpoints = localize('arc.serviceEndpoints', "Service endpoints");
export const serviceEndpointsTable = localize('arc.serviceEndpointsTable', "Service endpoints table");
export const databases = localize('arc.databases', "Databases");
export const endpoint = localize('arc.endpoint', "Endpoint");
export const description = localize('arc.description', "Description");
@@ -207,6 +208,8 @@ export const noWorkerPods = localize('arc.noWorkerPods', "No worker pods in this
export const podsReady = localize('arc.podsReady', "pods ready");
export const podsPresent = localize('arc.podsPresent', "Pods Present");
export const podsUsedDescription = localize('arc.podsUsedDescription', "Select a pod in the dropdown below for detailed health information.");
export const podsUsedDescriptionAria = localize('arc.podsUsedDescriptionAria', "Select a pod in the dropdown below for detailed health information");
export const podConditionsTable = localize('arc.podConditionsTable', "Pod conditions table");
export const connectToPostgresDescription = localize('arc.connectToPostgresDescription', "A connection to the server is required to show and set database engine settings, which will require the PostgreSQL Extension to be installed.");
export const postgresExtension = localize('arc.postgresExtension', "microsoft.azuredatastudio-postgresql");
export const podInitialized = localize('arc.podInitialized', "Pod is initialized.");

8
extensions/arc/src/ui/dashboards/postgres/postgresOverviewPage.ts
View File

@@ -81,7 +81,8 @@ export class PostgresOverviewPage extends DashboardPage {
const titleCSS = { ...cssStyles.title, 'margin-block-start': '2em', 'margin-block-end': '0' };
content.addItem(this.modelView.modelBuilder.text().withProps({
value: loc.serviceEndpoints,
CSSStyles: titleCSS
CSSStyles: titleCSS,
headingLevel: 1
}).component());
this.kibanaLink = this.modelView.modelBuilder.hyperlink().component();
@@ -107,6 +108,7 @@ export class PostgresOverviewPage extends DashboardPage {
const endpointsTable = this.modelView.modelBuilder.declarativeTable().withProps({
width: '100%',
ariaLabel: loc.serviceEndpoints,
columns: [
{
displayName: loc.name,
@@ -148,13 +150,15 @@ export class PostgresOverviewPage extends DashboardPage {
// Server Group Nodes
content.addItem(this.modelView.modelBuilder.text().withProps({
value: loc.serverGroupNodes,
CSSStyles: titleCSS
CSSStyles: titleCSS,
headingLevel: 1
}).component());
this.podStatusTable = this.modelView.modelBuilder.declarativeTable().withProps({
width: '100%',
ariaLabel: loc.serverGroupNodes,
columns: [
{
displayName: loc.name,

6
extensions/arc/src/ui/dashboards/postgres/postgresResourceHealthPage.ts
View File

@@ -90,6 +90,7 @@ export class PostgresResourceHealthPage extends DashboardPage {
this.podConditionsContainer = this.modelView.modelBuilder.divContainer().component();
this.podConditionsTable = this.modelView.modelBuilder.declarativeTable().withProps({
width: '100%',
ariaLabel: loc.podConditionsTable,
columns: [
{
displayName: loc.condition,
@@ -122,7 +123,10 @@ export class PostgresResourceHealthPage extends DashboardPage {
dataValues: this.createPodConditionsDataValues(this.coordinatorData)
}).component();
this.podDropDown = this.modelView.modelBuilder.dropDown().withProps({ width: '150px' }).component();
this.podDropDown = this.modelView.modelBuilder.dropDown().withProps({
width: '150px',
ariaLabel: loc.podsUsedDescriptionAria
}).component();
this.disposables.push(
this.podDropDown.onValueChanged(() => {
this.podConditionsTable.setFilter(this.podConditionsTableIndexes.get(String(this.podDropDown.value)));