Add dynamic label to delete button located at the top toolbar

This commit is contained in:
Daniel Abrao 2024-04-14 19:19:12 -03:00 committed by psychedelicious
parent 7899149144
commit 982e255878

View File

@ -13,13 +13,17 @@ export const DeleteImageButton = memo((props: DeleteImageButtonProps) => {
const { onClick, isDisabled } = props;
const { t } = useTranslation();
const isConnected = useAppSelector((s) => s.system.isConnected);
const imageSelectionLength: number = (useAppSelector((s) => s.gallery.selection) || []).length;
const labelMessage: string = imageSelectionLength > 1 ?
t('gallery.deleteImage_plural', { 'count': imageSelectionLength }) :
t('gallery.deleteImage');
return (
<IconButton
onClick={onClick}
icon={<PiTrashSimpleBold />}
tooltip={`${t('gallery.deleteImage')} (Del)`}
aria-label={`${t('gallery.deleteImage')} (Del)`}
tooltip={labelMessage}
aria-label={labelMessage}
isDisabled={isDisabled || !isConnected}
colorScheme="error"
/>