♻️ [open-formulieren/open-forms#180] Make the abortion button an actu…

…al button
open-formulieren · Jan 17, 2024 · e6bbcc6 · e6bbcc6
1 parent 8300e5a
commit e6bbcc6
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 21 deletions.
diff --git a/src/components/AbortionButton/AbortionButton.js b/src/components/AbortionButton/AbortionButton.js
@@ -4,7 +4,6 @@ import {FormattedMessage, useIntl} from 'react-intl';
 
 import {AnalyticsToolsConfigContext} from 'Context';
 import {OFButton} from 'components/Button';
-import {Toolbar, ToolbarList} from 'components/Toolbar';
 import {buildGovMetricUrl} from 'components/analytics/utils';
 import useFormContext from 'hooks/useFormContext';
 
@@ -31,13 +30,13 @@ const AbortionButton = ({isAuthenticated, onDestroySession}) => {
 
     await onDestroySession();
 
-    const govmetricUrl = buildGovMetricUrl(
-      analyticsToolsConfig.govmetricSourceId,
-      form.slug,
-      analyticsToolsConfig.govmetricSecureGuid
-    );
-
     if (analyticsToolsConfig.enableGovmetricAnalytics) {
+      const govmetricUrl = buildGovMetricUrl(
+        analyticsToolsConfig.govmetricSourceId,
+        form.slug,
+        analyticsToolsConfig.govmetricSecureGuid
+      );
+
       window.open(govmetricUrl);
     }
   };
@@ -54,13 +53,9 @@ const AbortionButton = ({isAuthenticated, onDestroySession}) => {
   if (!isAuthenticated && !analyticsToolsConfig.enableGovmetricAnalytics) return null;
 
   return (
-    <Toolbar modifiers={['bottom', 'reverse']}>
-      <ToolbarList>
-        <OFButton appearance="primary-action-button" hint="danger" name="abort" onClick={callback}>
-          {message}
-        </OFButton>
-      </ToolbarList>
-    </Toolbar>
+    <OFButton appearance="primary-action-button" hint="danger" name="abort" onClick={callback}>
+      {message}
+    </OFButton>
   );
 };
 

diff --git a/src/components/FormStep/index.js b/src/components/FormStep/index.js
@@ -40,6 +40,7 @@ import ButtonsToolbar from 'components/ButtonsToolbar';
 import Card, {CardTitle} from 'components/Card';
 import FormStepDebug from 'components/FormStepDebug';
 import Loader from 'components/Loader';
+import {Toolbar, ToolbarList} from 'components/Toolbar';
 import FormStepSaveModal from 'components/modals/FormStepSaveModal';
 import {
   eventTriggeredBySubmitButton,
@@ -878,10 +879,14 @@ const FormStep = ({
                 onNavigatePrevPage={onPrevPage}
                 previousPage={getPreviousPageHref()}
               />
-              <AbortionButton
-                isAuthenticated={submission.isAuthenticated}
-                onDestroySession={onDestroySession}
-              />
+              <Toolbar modifiers={['bottom', 'reverse']}>
+                <ToolbarList>
+                  <AbortionButton
+                    isAuthenticated={submission.isAuthenticated}
+                    onDestroySession={onDestroySession}
+                  />
+                </ToolbarList>
+              </Toolbar>
             </form>
           </>
         ) : null}

diff --git a/src/components/Summary/GenericSummary.js b/src/components/Summary/GenericSummary.js
@@ -9,6 +9,7 @@ import FormStepSummary from 'components/FormStepSummary';
 import Loader from 'components/Loader';
 import Price from 'components/Price';
 import SummaryConfirmation from 'components/SummaryConfirmation';
+import {Toolbar, ToolbarList} from 'components/Toolbar';
 import {SUBMISSION_ALLOWED} from 'components/constants';
 
 const GenericSummary = ({
@@ -60,7 +61,14 @@ const GenericSummary = ({
             prevPage={prevPage}
             onPrevPage={onPrevPage}
           />
-          <AbortionButton isAuthenticated={isAuthenticated} onDestroySession={onDestroySession} />
+          <Toolbar modifiers={['bottom', 'reverse']}>
+            <ToolbarList>
+              <AbortionButton
+                isAuthenticated={isAuthenticated}
+                onDestroySession={onDestroySession}
+              />
+            </ToolbarList>
+          </Toolbar>
         </Wrapper>
       </Formik>
     </Card>

diff --git a/src/components/analytics/GovMetricSnippet.js b/src/components/analytics/GovMetricSnippet.js
@@ -13,14 +13,14 @@ const GovMetricSnippet = () => {
   const form = useFormContext();
   const intl = useIntl();
 
+  if (!analyticsToolsConfig.enableGovmetricAnalytics) return null;
+
   const govmetricUrl = buildGovMetricUrl(
     analyticsToolsConfig.govmetricSourceId,
     form.slug,
     analyticsToolsConfig.govmetricSecureGuid
   );
 
-  if (!analyticsToolsConfig.enableGovmetricAnalytics) return null;
-
   return (
     <Toolbar modifiers={['bottom', 'reverse']}>
       <ToolbarList>