feat: More obvious loading state when submitting a post (#35153)

This commit is contained in:
diondiondion authored and GitHub committed 2025-06-24 14:08:48 +00:00
1 parent fb5b8ae0a5
commit 644da36336
5 files changed
+120 -28

No files matched your search

@@ -6,15 +6,34 @@ const messages = defineMessages({
loading: { id: 'loading_indicator.label', defaultMessage: 'Loading…' },
});
export const LoadingIndicator: React.FC = () => {
interface LoadingIndicatorProps {
/**
* Use role='none' to opt out of the current default role 'progressbar'
* and aria attributes which we should re-visit to check if they're appropriate.
* In Firefox the aria-label is not applied, instead an implied value of `50` is
* used as the label.
*/
role?: string;
}
export const LoadingIndicator: React.FC<LoadingIndicatorProps> = ({
role = 'progressbar',
}) => {
const intl = useIntl();
const a11yProps =
role === 'progressbar'
? ({
role,
'aria-busy': true,
'aria-live': 'polite',
} as const)
: undefined;
return (
<div
className='loading-indicator'
role='progressbar'
aria-busy
aria-live='polite'
{...a11yProps}
aria-label={intl.formatMessage(messages.loading)}
>
<CircularProgress size={50} strokeWidth={6} />