feat(client): ask for confirmation when resetting a resume

This commit is contained in:
Amruth Pillai
2022-07-30 12:56:40 +02:00
parent f7363ccdd7
commit 4d43f6a642
2 changed files with 17 additions and 5 deletions

View File

@ -23,6 +23,7 @@
"i18n-ally.sortKeys": true, "i18n-ally.sortKeys": true,
"scss.validate": false, "scss.validate": false,
"conventionalCommits.scopes": [ "conventionalCommits.scopes": [
"client" "client",
"docker"
] ]
} }

View File

@ -15,7 +15,7 @@ import dayjs from 'dayjs';
import get from 'lodash/get'; import get from 'lodash/get';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useTranslation } from 'next-i18next'; import { useTranslation } from 'next-i18next';
import { useMemo } from 'react'; import { useMemo, useState } from 'react';
import { useMutation } from 'react-query'; import { useMutation } from 'react-query';
import Heading from '@/components/shared/Heading'; import Heading from '@/components/shared/Heading';
@ -36,6 +36,8 @@ const Settings = () => {
const { locale, ...router } = useRouter(); const { locale, ...router } = useRouter();
const [confirmReset, setConfirmReset] = useState(false);
const resume = useAppSelector((state) => state.resume); const resume = useAppSelector((state) => state.resume);
const theme = useAppSelector((state) => state.build.theme); const theme = useAppSelector((state) => state.build.theme);
const pages = useAppSelector((state) => state.resume.metadata.layout); const pages = useAppSelector((state) => state.resume.metadata.layout);
@ -78,9 +80,14 @@ const Settings = () => {
}; };
const handleResetResume = async () => { const handleResetResume = async () => {
await resetResumeMutation({ id }); if (!confirmReset) {
return setConfirmReset(true);
}
queryClient.invalidateQueries(`resume/${username}/${slug}`); await resetResumeMutation({ id });
await queryClient.invalidateQueries(`resume/${username}/${slug}`);
setConfirmReset(false);
}; };
return ( return (
@ -202,7 +209,11 @@ const Settings = () => {
<DeleteForever /> <DeleteForever />
</ListItemIcon> </ListItemIcon>
<ListItemText <ListItemText
primary={t<string>('builder.rightSidebar.sections.settings.resume.reset.primary')} primary={
confirmReset
? 'Are you sure?'
: t<string>('builder.rightSidebar.sections.settings.resume.reset.primary')
}
secondary={t<string>('builder.rightSidebar.sections.settings.resume.reset.secondary')} secondary={t<string>('builder.rightSidebar.sections.settings.resume.reset.secondary')}
/> />
</ListItemButton> </ListItemButton>