Merge branch 'release-0.2.44'

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tdm-calculator-client",
-  "version": "0.2.43",
+  "version": "0.2.44",
   "private": true,
   "proxy": "http://localhost:5001",
   "scripts": {

client/src/components/InapplicableStrategiesModal.js

@@ -0,0 +1,89 @@
+import React from "react";
+import PropTypes from "prop-types";
+import Modal from "react-modal";
+import Button from "./Button/Button";
+import { createUseStyles } from "react-jss";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faTriangleExclamation } from "@fortawesome/free-solid-svg-icons";
+
+const useStyles = createUseStyles({
+  overlay: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    backgroundColor: "rgba(255, 255, 255, 0.5)",
+
+    zIndex: "100",
+    position: "fixed",
+    top: "0px",
+    left: "0px",
+    right: "0px",
+    bottom: "0px"
+  },
+  content: {
+    padding: "50px",
+    backgroundColor: "#ffffff",
+    boxShadow: "0px 5px 10px rgba(0, 46, 109, 0.2)",
+    width: "47%",
+    borderRadius: "5px"
+  },
+  title: {
+    textAlign: "center"
+  },
+  deselectedWrapper: {
+    textAlign: "center"
+  },
+  deselectedAlign: {
+    lineHeight: "40px"
+  },
+  modalActions: {
+    display: "flex",
+    justifyContent: "center"
+  }
+});
+const InapplicableStrategiesModal = props => {
+  const { inapplicableStrategiesModal, closeStrategiesModal } = props;
+
+  const classes = useStyles();
+
+  return (
+    <Modal
+      isOpen={inapplicableStrategiesModal}
+      onRequestClose={closeStrategiesModal}
+      contentLabel="Inapplicable Strategies"
+      overlayClassName={classes.overlay}
+      className={classes.content}
+      shouldFocusAfterRender={false}
+    >
+      <div className={classes.deselectedWrapper}>
+        <FontAwesomeIcon
+          icon={faTriangleExclamation}
+          style={{ color: "#E46247", height: "80px" }}
+          alt="Warning"
+        />
+        <h2 className={classes.deselectedAlign}>
+          Due to changes made to the project specifications, one or more TDM
+          strategies are no longer applicable and have been automatically
+          de-selected
+        </h2>
+      </div>
+      <div className={classes.modalActions}>
+        <Button
+          color="colorDeselect"
+          id="modalProceed"
+          data-testid="transitionProceed"
+          onClick={closeStrategiesModal}
+        >
+          Okay, I Understand
+        </Button>
+      </div>
+    </Modal>
+  );
+};
+
+InapplicableStrategiesModal.propTypes = {
+  inapplicableStrategiesModal: PropTypes.bool.isRequired,
+  closeStrategiesModal: PropTypes.func
+};
+
+export default InapplicableStrategiesModal;

client/src/components/ProjectWizard/TdmCalculationWizard.js

@@ -8,6 +8,7 @@ import CalculationWizardRoutes from "./CalculationWizardRoutes";
 import WizardFooter from "./WizardFooter";
 import WizardSidebar from "./WizardSidebar/WizardSidebar";
 import ContentContainer from "../Layout/ContentContainer";
+import InapplicableStrategiesModal from "../InapplicableStrategiesModal";
 
 const TdmCalculationWizard = props => {
   const {
@@ -37,7 +38,9 @@ const TdmCalculationWizard = props => {
     dateModified,
     contentContainerRef,
     checklistModalOpen,
-    toggleChecklistModal
+    toggleChecklistModal,
+    inapplicableStrategiesModal,
+    closeStrategiesModal
   } = props;
   const context = useContext(ToastContext);
   const page = Number(match.params.page || 1);
@@ -170,6 +173,10 @@ const TdmCalculationWizard = props => {
   return (
     <React.Fragment>
       <TermsAndConditionsModal />
+      <InapplicableStrategiesModal
+        inapplicableStrategiesModal={inapplicableStrategiesModal}
+        closeStrategiesModal={closeStrategiesModal}
+      />
       <ChecklistModal
         checklistModalOpen={checklistModalOpen}
         toggleChecklistModal={toggleChecklistModal}
@@ -281,7 +288,9 @@ TdmCalculationWizard.propTypes = {
   projectIsValid: PropTypes.func,
   dateModified: PropTypes.string,
   checklistModalOpen: PropTypes.bool,
-  toggleChecklistModal: PropTypes.func
+  toggleChecklistModal: PropTypes.func,
+  inapplicableStrategiesModal: PropTypes.bool,
+  closeStrategiesModal: PropTypes.func
 };
 
 export default withRouter(TdmCalculationWizard);

client/src/components/TdmCalculationContainer.js

@@ -74,6 +74,8 @@ export function TdmCalculationContainer({
   const [formHasSaved, setFormHasSaved] = useState(true);
   const [resettingProject, setResettingProject] = useState(false);
   const [triggerInitiateEngine, setTriggerInitiateEngine] = useState(false);
+  const [inapplicableStrategiesModal, setInapplicableStrategiesModal] =
+    useState(false);
   const toast = useToast();
   const appInsights = useAppInsightsContext();
 
@@ -137,6 +139,10 @@ export function TdmCalculationContainer({
     initiateEngine();
   }, [match.params.projectId, engine, account, history, triggerInitiateEngine]);
 
+  const closeStrategiesModal = () => {
+    setInapplicableStrategiesModal(!inapplicableStrategiesModal);
+  };
+
   const recalculate = updatedFormInputs => {
     const strategiesDeselected = engine.run(updatedFormInputs, resultRuleCodes); //TODO cannot read property 'run' on null when switching from calculation to public form to create project
     const rules = engine.showRulesArray();
@@ -151,11 +157,7 @@ export function TdmCalculationContainer({
     setRules(rules);
     setFormHasSaved(false);
     if (strategiesDeselected) {
-      toast.add(
-        `Due to changes you made to the project specifications, some of 
-        the selected strategies are no longer applicable and have 
-        been automatically de-selected`
-      );
+      closeStrategiesModal();
     }
   };
 
@@ -571,6 +573,8 @@ export function TdmCalculationContainer({
           contentContainerRef={contentContainerRef}
           checklistModalOpen={checklistModalOpen}
           toggleChecklistModal={toggleChecklistModal}
+          inapplicableStrategiesModal={inapplicableStrategiesModal}
+          closeStrategiesModal={closeStrategiesModal}
         />
       ) : (
         <TdmCalculation

client/src/styles/theme.js

@@ -10,6 +10,7 @@ module.exports = {
     colorCancel: "rgba(0, 0, 0, 0.5)", //light grey, e.g. cancel button
     colorWhite: "#fff", //white
     colorError: "#E46247", //e.g. red
+    colorDeselect: "#EEF1F4", //e.g. red
     colorHighlight: "#F0E300" //yellow
   }
 };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "root",
-  "version": "0.2.43",
+  "version": "0.2.44",
   "private": true,
   "scripts": {
     "release-notes": "gren release --override",

server/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tdm-calculator-api",
-  "version": "0.2.43",
+  "version": "0.2.44",
   "description": "Traffic Data Management Calculator",
   "repository": {
     "type": "git",
@@ -16,7 +16,6 @@
     "lint": "eslint -c .eslintrc.json --ignore-path .eslintignore  \"**/*.{js,jsx}\" ",
     "lint:fix": "eslint -c .eslintrc.json --ignore-path .eslintignore --fix  \"**/*.{js,jsx}\" ",
     "flyway:migrate": "flyway -c ./db/flyway-config.js migrate",
-    "flyway:undo": "flyway -c ./db/flyway-config.js undo",
     "flyway:clean": "flyway -c ./db/flyway-config.js clean",
     "flyway:repair": "flyway -c ./db/flyway-config.js repair",
     "flyway:info": "flyway -c ./db/flyway-config.js info",