aria labels added to add table row dialog elements appropriately

This commit is contained in:
Sampath 2023-06-07 20:23:17 +05:30
parent 75176550f0
commit 437a9835f8
2 changed files with 6 additions and 0 deletions

View File

@ -1,5 +1,6 @@
import { DatePicker, TextField } from "@fluentui/react"; import { DatePicker, TextField } from "@fluentui/react";
import React, { FunctionComponent } from "react"; import React, { FunctionComponent } from "react";
import { attributeValueLabel } from "../Explorer/Panes/Tables/Validators/EntityTableHelper";
export interface TableEntityProps { export interface TableEntityProps {
entityValueLabel?: string; entityValueLabel?: string;
@ -55,11 +56,13 @@ export const EntityValue: FunctionComponent<TableEntityProps> = ({
label={entityValueLabel && entityValueLabel} label={entityValueLabel && entityValueLabel}
className="addEntityTextField" className="addEntityTextField"
id="entityValueId" id="entityValueId"
autoFocus
disabled={isEntityValueDisable} disabled={isEntityValueDisable}
type={entityValueType} type={entityValueType}
placeholder={entityValuePlaceholder} placeholder={entityValuePlaceholder}
value={typeof entityValue === "string" ? entityValue : ""} value={typeof entityValue === "string" ? entityValue : ""}
onChange={onEntityValueChange} onChange={onEntityValueChange}
ariaLabel={attributeValueLabel}
/> />
); );
}; };

View File

@ -12,6 +12,7 @@ import {
import React, { FunctionComponent } from "react"; import React, { FunctionComponent } from "react";
import DeleteIcon from "../../images/delete.svg"; import DeleteIcon from "../../images/delete.svg";
import EditIcon from "../../images/Edit_entity.svg"; import EditIcon from "../../images/Edit_entity.svg";
import { attributeNameLabel, dataTypeLabel } from "../Explorer/Panes/Tables/Validators/EntityTableHelper";
import { CassandraType, TableType } from "../Explorer/Tables/Constants"; import { CassandraType, TableType } from "../Explorer/Tables/Constants";
import { userContext } from "../UserContext"; import { userContext } from "../UserContext";
import { EntityValue } from "./EntityValue"; import { EntityValue } from "./EntityValue";
@ -113,6 +114,7 @@ export const TableEntity: FunctionComponent<TableEntityProps> = ({
value={entityProperty} value={entityProperty}
onChange={onEntityPropertyChange} onChange={onEntityPropertyChange}
required required
ariaLabel={attributeNameLabel}
/> />
<Dropdown <Dropdown
label={entityTypeLabel && entityTypeLabel} label={entityTypeLabel && entityTypeLabel}
@ -122,6 +124,7 @@ export const TableEntity: FunctionComponent<TableEntityProps> = ({
disabled={isPropertyTypeDisable} disabled={isPropertyTypeDisable}
id="entityTypeId" id="entityTypeId"
styles={dropdownStyles} styles={dropdownStyles}
ariaLabel={dataTypeLabel}
/> />
<EntityValue <EntityValue
entityValueLabel={entityValueLabel} entityValueLabel={entityValueLabel}