Merge pull request #6546 from uktrade/form-flash-message-type

Allow flash message type to be specified in Form

src/client/components/Form/index.jsx

@@ -468,12 +468,25 @@ const dispatchToProps = (dispatch) => ({
       type: 'FORM__STEP_DEREGISTER',
       stepName,
     }),
-  writeFlashMessage: (message) =>
+  writeFlashMessage: (message) => {
+    if (!message) return
+
+    if (typeof message === 'string') {
+      dispatch({
+        type: 'FLASH_MESSAGE__WRITE_TO_SESSION',
+        messageType: 'success',
+        message,
+      })
+      return
+    }
+
+    const [heading, body, messageType] = message
     dispatch({
       type: 'FLASH_MESSAGE__WRITE_TO_SESSION',
-      messageType: 'success',
-      message,
-    }),
+      messageType,
+      message: [heading, body],
+    })
+  },
 })
 
 /**
@@ -520,7 +533,7 @@ const dispatchToProps = (dispatch) => ({
  * `window.location.href`, the _soft_ mode uses React-Router.
  * @param {Props['flashMessage']} [props.flashMessage] - A function which should
  * convert the result of the submission task and the submitted form values into
- * a flash message text or a tuple of `[heading, body]`, which will be used as
+ * a flash message text or a tuple of `[heading, body, type]`, which will be used as
  * a flash message when the submission task resolves.
  * @param {Props['initialValues']} [props.initialValues] - An object mapping
  * field names to their initial values.

src/client/components/Form/types.d.ts

@@ -6,7 +6,8 @@ type Values = Record<string, string>
 type Errors = Record<string, string>
 type FlashMessageHeading = string
 type FlashMessageBody = string
-type FlashMessage = FlashMessageBody | [FlashMessageHeading, FlashMessageBody]
+type FlashMessageType = 'info' | 'success' | 'warning' | 'error' | 'muted'
+type FlashMessage = FlashMessageBody | [FlashMessageHeading, FlashMessageBody, FlashMessageType?]
 
 type ChildFn = ({
   errors: Errors,