Merged in bugfix/labels-dialog-text (pull request #38)

Fix add label message too long and add error display

* Fix add label message too long and add error display


Approved-by: Paulo Veiga
This commit is contained in:
Matias Arriola 2022-02-17 19:27:29 +00:00 committed by Paulo Veiga
parent df7d53eacd
commit 481a6ff7dd

View File

@ -23,6 +23,7 @@ const LabelDialog = ({ mapsId, onClose }: MultiDialogProps): React.ReactElement
const { data } = useQuery<unknown, ErrorInfo, MapInfo[]>('maps', () => {
return client.fetchAllMaps();
});
const [error, setError] = React.useState<ErrorInfo>();
const maps = data.filter(m => mapsId.includes(m.id));
@ -34,12 +35,13 @@ const LabelDialog = ({ mapsId, onClose }: MultiDialogProps): React.ReactElement
queryClient.invalidateQueries('labels');
},
onError: (error) => {
console.error(error);
setError(error);
}
}
);
const handleChangesInLabels = (label: Label, checked: boolean) => {
setError(undefined);
changeLabelMutation.mutate({
maps,
label,
@ -61,11 +63,19 @@ const LabelDialog = ({ mapsId, onClose }: MultiDialogProps): React.ReactElement
'Use labels to organize your maps.',
})}
PaperProps={{ classes: { root: classes.paper } }}
error={error}
>
<>
<Typography variant="body2" marginTop="10px">
<FormattedMessage id="label.add-for" defaultMessage="Editing labels for maps: " />
{ maps.map(m => m.title).join(', ') }
<FormattedMessage id="label.add-for" defaultMessage="Editing labels for " />
{
maps.length > 1 ?
<FormattedMessage id="label.maps-count"
defaultMessage="{count} maps"
values={{ count: maps.length }}
/> :
maps.map(m => m.title).join(', ')
}
</Typography>
<LabelSelector onChange={handleChangesInLabels} maps={maps} />
</>