HAI-1881 Save hanke form in summary page

src/domain/hanke/edit/HankeForm.test.tsx

@@ -4,6 +4,7 @@ import HankeForm from './HankeForm';
 import HankeFormContainer from './HankeFormContainer';
 import { HANKE_VAIHE, HANKE_TYOMAATYYPPI } from '../../types/hanke';
 import { render, cleanup, fireEvent, waitFor, screen } from '../../../testUtils/render';
+import hankkeet from '../../mocks/data/hankkeet-data';
 
 afterEach(cleanup);
 
@@ -36,6 +37,36 @@ const hankeData: HankeDataDraft = {
 };
 */
 
+function fillBasicInformation(
+  options: {
+    name?: string;
+    description?: string;
+    address?: string;
+    phase?: 'Ohjelmointi' | 'Suunnittelu' | 'Rakentaminen';
+    isYKT?: boolean;
+  } = {},
+) {
+  const {
+    name = nimi,
+    description = hankkeenKuvaus,
+    address = hankkeenOsoite,
+    phase = 'Ohjelmointi',
+    isYKT = false,
+  } = options;
+
+  fireEvent.change(screen.getByLabelText(/hankkeen nimi/i), {
+    target: { value: name },
+  });
+  fireEvent.change(screen.getByLabelText(/hankkeen kuvaus/i), { target: { value: description } });
+  fireEvent.change(screen.getByLabelText(/katuosoite/i), {
+    target: { value: address },
+  });
+  fireEvent.click(screen.getByRole('radio', { name: phase }));
+  if (isYKT) {
+    fireEvent.click(screen.getByRole('checkbox', { name: 'Hanke on YKT-hanke' }));
+  }
+}
+
 const formData: HankeDataFormState = {
   vaihe: HANKE_VAIHE.OHJELMOINTI,
   rakennuttajat: [],
@@ -195,4 +226,37 @@ describe('HankeForm', () => {
     await user.click(screen.getByText(/toteuttajan tiedot/i));
     await user.click(screen.getByText(/muiden tahojen tiedot/i));
   });
+
+  test('Should be able to save and quit', async () => {
+    const { user } = render(<HankeFormContainer />);
+
+    fillBasicInformation();
+
+    await user.click(screen.getByRole('button', { name: 'Tallenna ja keskeytä' }));
+
+    expect(window.location.pathname).toBe('/fi/hankesalkku/HAI22-13');
+    expect(screen.getByText(`Hanke ${nimi} (HAI22-13) tallennettu omiin hankkeisiin.`));
+  });
+
+  test('Should be able to save hanke in the last page', async () => {
+    const hanke = hankkeet[1];
+
+    const { user } = render(
+      <HankeForm
+        formData={hanke as HankeDataFormState}
+        onIsDirtyChange={() => ({})}
+        onFormClose={() => ({})}
+      >
+        children
+      </HankeForm>,
+    );
+
+    await user.click(screen.getByRole('button', { name: /yhteenveto/i }));
+    await user.click(screen.getByRole('button', { name: 'Tallenna' }));
+
+    expect(window.location.pathname).toBe(`/fi/hankesalkku/${hanke.hankeTunnus}`);
+    expect(
+      screen.getByText(`Hanke ${hanke.nimi} (${hanke.hankeTunnus}) tallennettu omiin hankkeisiin.`),
+    );
+  });
 });

src/domain/hanke/edit/HankeForm.tsx

@@ -21,8 +21,9 @@ import MultipageForm from '../../forms/MultipageForm';
 import FormActions from '../../forms/components/FormActions';
 import { useLocalizedRoutes } from '../../../common/hooks/useLocalizedRoutes';
 import ApplicationAddDialog from '../../application/components/ApplicationAddDialog';
+import { useGlobalNotification } from '../../../common/components/globalNotification/GlobalNotificationContext';
 
-async function saveHanke({ data }: { data: HankeDataFormState; navigateTo?: string }) {
+async function saveHanke(data: HankeDataFormState) {
   const requestData = {
     ...convertFormStateToHankeData(data),
   };
@@ -50,6 +51,7 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
   const { t } = useTranslation();
   const { HANKEPORTFOLIO } = useLocalizedRoutes();
   const navigate = useNavigate();
+  const { setNotification } = useGlobalNotification();
   const [showNotification, setShowNotification] = useState<FormNotification | null>(null);
   const [showAddApplicationDialog, setShowAddApplicationDialog] = useState(false);
   const formContext = useForm<HankeDataFormState>({
@@ -67,7 +69,6 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
     formState: { errors, isDirty },
     getValues,
     setValue,
-    handleSubmit,
   } = formContext;
 
   const isNewHanke = !formData.hankeTunnus;
@@ -85,34 +86,41 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
     onError() {
       setShowNotification('error');
     },
-    onSuccess(data, { navigateTo }) {
+    onSuccess(data) {
       setValue('hankeTunnus', data.hankeTunnus);
       setValue('tormaystarkasteluTulos', data.tormaystarkasteluTulos);
       setValue('status', data.status);
       setShowNotification('success');
-      if (navigateTo) {
-        navigate(navigateTo);
-      }
     },
   });
 
-  function saveDraft() {
-    hankeMutation.mutate({ data: getValues() });
-  }
-
-  function saveDraftAndQuit() {
-    hankeMutation.mutate({ data: getValues(), navigateTo: HANKEPORTFOLIO.path });
+  function save() {
+    hankeMutation.mutate(getValues());
   }
 
-  function save() {
-    hankeMutation.mutate({
-      data: getValues(),
-      navigateTo: HANKEPORTFOLIO.path,
+  function saveAndQuit() {
+    hankeMutation.mutate(getValues(), {
+      onSuccess(data) {
+        setNotification(true, {
+          position: 'top-right',
+          dismissible: true,
+          autoClose: true,
+          autoCloseDuration: 8000,
+          label: t('hankeForm:saveAndQuitSuccessHeader'),
+          message: t('hankeForm:saveAndQuitSuccessText', {
+            name: data.nimi,
+            hankeTunnus: data.hankeTunnus,
+          }),
+          type: 'success',
+          closeButtonLabelText: t('common:components:notification:closeButtonLabelText'),
+        });
+        navigate(`${HANKEPORTFOLIO.path}/${data.hankeTunnus}`);
+      },
     });
   }
 
   function saveAndAddApplication() {
-    hankeMutation.mutate({ data: getValues() });
+    save();
     setShowAddApplicationDialog(true);
   }
 
@@ -161,12 +169,7 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
         hanke={getValues() as HankeData}
       />
       <div className="hankeForm">
-        <MultipageForm
-          heading={formHeading}
-          formSteps={formSteps}
-          onStepChange={saveDraft}
-          onSubmit={handleSubmit(save)}
-        >
+        <MultipageForm heading={formHeading} formSteps={formSteps} onStepChange={save}>
           {function renderFormActions(activeStepIndex, handlePrevious, handleNext) {
             const lastStep = activeStepIndex === formSteps.length - 1;
             return (
@@ -189,8 +192,10 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
                   <Button
                     variant="supplementary"
                     iconLeft={<IconSaveDiskette aria-hidden="true" />}
-                    onClick={saveDraftAndQuit}
+                    onClick={saveAndQuit}
                     data-testid="save-form-btn"
+                    isLoading={hankeMutation.isLoading}
+                    loadingText={t('common:buttons:savingText')}
                   >
                     {t('hankeForm:saveDraftButton')}
                   </Button>
@@ -209,7 +214,9 @@ const HankeForm: React.FC<React.PropsWithChildren<Props>> = ({
                     <Button
                       variant="primary"
                       iconLeft={<IconSaveDiskette aria-hidden />}
-                      type="submit"
+                      onClick={saveAndQuit}
+                      isLoading={hankeMutation.isLoading}
+                      loadingText={t('common:buttons:savingText')}
                     >
                       {t('hankeForm:saveButton')}
                     </Button>

src/locales/fi.json

@@ -462,6 +462,8 @@
     "savingSuccessText": "Luonnos on tallennettu Hankelistalle",
     "savingFailHeader": "Joku meni vikaan",
     "savingFailText": "Luonnosta ei saatu tallennettua, koita uudelleen",
+    "saveAndQuitSuccessHeader": "Hanke tallennettu",
+    "saveAndQuitSuccessText": "Hanke {{name}} ({{hankeTunnus}}) tallennettu omiin hankkeisiin.",
     "closeAriaLabel": "Poistu kaavakkeelta tallentamatta",
     "confirmIndexCalculationButton": "Jatka indeksilaskentaan",
     "cancelDialog": {