random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-04-30 13:35:07 +01:00
Code Issues Packages Projects Releases Wiki Activity

screenreader content changed to announce the entire alert

Browse Source
This commit is contained in:
Sampath 2023-05-31 14:41:19 +05:30
parent 85bd63f1a4
commit e267b5c1cc
2 changed files with 6 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/Explorer/Panes/PanelInfoErrorComponent.tsx
View File

@ -32,14 +32,8 @@ export const PanelInfoErrorComponent: React.FunctionComponent<PanelInfoErrorProp
return ( return (
<Stack className="panelInfoErrorContainer" horizontal verticalAlign="center"> <Stack className="panelInfoErrorContainer" horizontal verticalAlign="center">
{icon} {icon}
<span className="panelWarningErrorDetailsLinkContainer"> <span className="panelWarningErrorDetailsLinkContainer" role="alert" aria-live="assertive">
<Text <Text aria-label={message} className="panelWarningErrorMessage" variant="small">
role="alert"
aria-live="assertive"
aria-label={message}
className="panelWarningErrorMessage"
variant="small"
>
{message} {message}
{link && linkText && ( {link && linkText && (
<Link target="_blank" href={link}> <Link target="_blank" href={link}>

4
src/Explorer/Panes/RightPaneForm/RightPaneForm.tsx
View File

@ -1,3 +1,4 @@
import { useNotificationConsole } from "hooks/useNotificationConsole";
import React, { FunctionComponent, ReactNode } from "react"; import React, { FunctionComponent, ReactNode } from "react";
import { PanelFooterComponent } from "../PanelFooterComponent"; import { PanelFooterComponent } from "../PanelFooterComponent";
import { PanelInfoErrorComponent } from "../PanelInfoErrorComponent"; import { PanelInfoErrorComponent } from "../PanelInfoErrorComponent";
@ -22,9 +23,12 @@ export const RightPaneForm: FunctionComponent<RightPaneFormProps> = ({
isSubmitButtonDisabled = false, isSubmitButtonDisabled = false,
children, children,
}: RightPaneFormProps) => { }: RightPaneFormProps) => {
const expandConsole = useNotificationConsole((state) => state.expandConsole);
const handleOnSubmit = (event: React.FormEvent<HTMLFormElement>) => { const handleOnSubmit = (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault(); event.preventDefault();
console.log("right pane form clicked");
onSubmit(); onSubmit();
expandConsole();
}; };
return ( return (