mirror of
https://github.com/Frooodle/Stirling-PDF.git
synced 2025-09-26 17:52:59 +02:00
Navigation warning
This commit is contained in:
parent
f70e45cee4
commit
99faf14929
@ -1,4 +1,10 @@
|
|||||||
{
|
{
|
||||||
|
"unsavedChanges": "You have unsaved changes to your PDF. What would you like to do?",
|
||||||
|
"unsavedChangesTitle": "Unsaved Changes",
|
||||||
|
"keepWorking": "Keep Working",
|
||||||
|
"discardChanges": "Discard Changes",
|
||||||
|
"applyAndContinue": "Apply & Continue",
|
||||||
|
"exportAndContinue": "Export & Continue",
|
||||||
"language": {
|
"language": {
|
||||||
"direction": "ltr"
|
"direction": "ltr"
|
||||||
},
|
},
|
||||||
@ -3439,4 +3445,4 @@
|
|||||||
},
|
},
|
||||||
"termsAndConditions": "Terms & Conditions",
|
"termsAndConditions": "Terms & Conditions",
|
||||||
"logOut": "Log out"
|
"logOut": "Log out"
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Modal, Text, Button, Group, Stack } from '@mantine/core';
|
import { Modal, Text, Button, Group, Stack } from '@mantine/core';
|
||||||
import { useNavigationGuard } from '../../contexts/NavigationContext';
|
import { useNavigationGuard } from '../../contexts/NavigationContext';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
interface NavigationWarningModalProps {
|
interface NavigationWarningModalProps {
|
||||||
onApplyAndContinue?: () => Promise<void>;
|
onApplyAndContinue?: () => Promise<void>;
|
||||||
@ -11,6 +12,8 @@ const NavigationWarningModal = ({
|
|||||||
onApplyAndContinue,
|
onApplyAndContinue,
|
||||||
onExportAndContinue
|
onExportAndContinue
|
||||||
}: NavigationWarningModalProps) => {
|
}: NavigationWarningModalProps) => {
|
||||||
|
|
||||||
|
const { t } = useTranslation();
|
||||||
const {
|
const {
|
||||||
showNavigationWarning,
|
showNavigationWarning,
|
||||||
hasUnsavedChanges,
|
hasUnsavedChanges,
|
||||||
@ -28,7 +31,7 @@ const NavigationWarningModal = ({
|
|||||||
confirmNavigation();
|
confirmNavigation();
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleApplyAndContinue = async () => {
|
const _handleApplyAndContinue = async () => {
|
||||||
if (onApplyAndContinue) {
|
if (onApplyAndContinue) {
|
||||||
await onApplyAndContinue();
|
await onApplyAndContinue();
|
||||||
}
|
}
|
||||||
@ -52,55 +55,59 @@ const NavigationWarningModal = ({
|
|||||||
<Modal
|
<Modal
|
||||||
opened={showNavigationWarning}
|
opened={showNavigationWarning}
|
||||||
onClose={handleKeepWorking}
|
onClose={handleKeepWorking}
|
||||||
title="Unsaved Changes"
|
title={t("unsavedChangesTitle", "Unsaved Changes")}
|
||||||
centered
|
centered
|
||||||
|
size="lg"
|
||||||
closeOnClickOutside={false}
|
closeOnClickOutside={false}
|
||||||
closeOnEscape={false}
|
closeOnEscape={false}
|
||||||
>
|
>
|
||||||
<Stack gap="md">
|
<Stack gap="md">
|
||||||
<Text>
|
<Text>
|
||||||
You have unsaved changes to your PDF. What would you like to do?
|
{t("unsavedChanges", "You have unsaved changes to your PDF. What would you like to do?")}
|
||||||
</Text>
|
</Text>
|
||||||
|
|
||||||
<Group justify="flex-end" gap="sm">
|
|
||||||
<Button
|
<Group justify="space-between" gap="sm">
|
||||||
variant="light"
|
|
||||||
color="gray"
|
|
||||||
onClick={handleKeepWorking}
|
|
||||||
>
|
|
||||||
Keep Working
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
variant="light"
|
variant="light"
|
||||||
color="red"
|
color="red"
|
||||||
onClick={handleDiscardChanges}
|
onClick={handleDiscardChanges}
|
||||||
>
|
>
|
||||||
Discard Changes
|
{t("discardChanges", "Discard Changes")}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
{onApplyAndContinue && (
|
<Group gap="sm">
|
||||||
<Button
|
<Button
|
||||||
variant="light"
|
variant="light"
|
||||||
color="blue"
|
color="var(--mantine-color-gray-8)"
|
||||||
onClick={handleApplyAndContinue}
|
onClick={handleKeepWorking}
|
||||||
>
|
>
|
||||||
Apply & Continue
|
{t("keepWorking", "Keep Working")}
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
|
||||||
|
{/* TODO:: Add this back in when it works */}
|
||||||
{onExportAndContinue && (
|
{/* {onApplyAndContinue && (
|
||||||
<Button
|
<Button
|
||||||
color="green"
|
variant="light"
|
||||||
onClick={handleExportAndContinue}
|
color="blue"
|
||||||
>
|
onClick={handleApplyAndContinue}
|
||||||
Export & Continue
|
>
|
||||||
</Button>
|
{t("applyAndContinue", "Apply & Continue")}
|
||||||
)}
|
</Button>
|
||||||
|
)} */}
|
||||||
|
|
||||||
|
{onExportAndContinue && (
|
||||||
|
<Button
|
||||||
|
onClick={handleExportAndContinue}
|
||||||
|
>
|
||||||
|
{t("exportAndContinue", "Export & Continue")}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</Group>
|
||||||
</Group>
|
</Group>
|
||||||
</Stack>
|
</Stack>
|
||||||
</Modal>
|
</Modal>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default NavigationWarningModal;
|
export default NavigationWarningModal;
|
||||||
|
Loading…
Reference in New Issue
Block a user