Merge branch 'release-0.2.23'

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tdm-calculator-client",
-  "version": "0.2.22",
+  "version": "0.2.23",
   "private": true,
   "proxy": "http://localhost:5000",
   "scripts": {

client/src/components/Authorization/Register.js

@@ -38,7 +38,14 @@ const Register = props => {
       .email("Invalid email address format")
       .required("Email is required"),
     password: Yup.string()
-      .min(8, "Password must be 8 characters at minimum")
+      .min(
+        12,
+        "Your password must have at least 12 characters, at least one number, one capitalization, and one special character (e.g., !@#$%&*?)"
+      )
+      .matches(
+        /^(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%&*?])[A-Za-z\d@$!%*#?&]{12,}$/,
+        "Your password must have at least 12 characters, at least one number, one capitalization, and one special character (e.g., !@#$%&*?)"
+      )
       .required("Password is required"),
     passwordConfirm: Yup.string()
       .required("Confirm your password")

client/src/components/Authorization/ResetPassword.js

@@ -12,7 +12,14 @@ import ContentContainer from "../Layout/ContentContainer";
 
 const validationSchema = Yup.object().shape({
   password: Yup.string()
-    .min(8, "Password must be atleast 8 characters")
+    .min(
+      12,
+      "Your password must have at least 12 characters, at least one number, one capitalization, and one special character (e.g., !@#$%&*?)"
+    )
+    .matches(
+      /^(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%&*?])[A-Za-z\d@$!%*#?&]{12,}$/,
+      "Your password must have at least 12 characters, at least one number, one capitalization, and one special character (e.g., !@#$%&*?)"
+    )
     .required("Password is Required"),
   passwordConfirm: Yup.string()
     .required("Confirm your password")

client/src/components/Authorization/SendEmailForm.js

@@ -18,21 +18,21 @@ export const useStyles = createUseStyles({
     width: "100%",
     marginBottom: "32px",
     display: "flex",
-    flexDirection: "column"
+    flexDirection: "column",
+    alignItems: "center"
   },
   inputField: {
     width: "403px",
     height: "30px",
     border: "1px solid #979797",
-    marginBottom: "16px"
+    marginTop: "8px"
   },
   error: {
     borderColor: "#dc3545"
   },
   errorMessage: {
-    marginTop: "10px",
-    width: "100%",
-    height: "30px",
+    margin: "8px auto",
+    width: "403px",
     color: "red"
   },
   authText: {

client/src/components/ProjectWizard/RuleInput/ParkingProvidedRuleInput.js

@@ -13,6 +13,12 @@ const useStyles = createUseStyles({
   label: {
     fontSize: "22px"
   },
+  requiredInputLabel: {
+    "&:after": {
+      content: '" *"',
+      color: "red"
+    }
+  },
   inputContainer: {
     width: "100%",
     textAlign: "center"
@@ -34,10 +40,20 @@ const useStyles = createUseStyles({
 });
 
 const ParkingProvidedRuleInput = ({
-  rule: { code, name, value, units, minValue, maxValue, validationErrors },
+  rule: {
+    code,
+    name,
+    value,
+    units,
+    minValue,
+    maxValue,
+    validationErrors,
+    required
+  },
   onInputChange
 }) => {
   const classes = useStyles();
+  const requiredStyle = required && classes.requiredInputLabel;
   const [showValidationErrors, setShowValidationErrors] = useState(false);
 
   const handleChange = e => {
@@ -51,7 +67,7 @@ const ParkingProvidedRuleInput = ({
 
   return (
     <div className={classes.parkingProvidedWrapper}>
-      <label htmlFor={code} className={classes.label}>
+      <label htmlFor={code} className={clsx(classes.label, requiredStyle)}>
         {name}
       </label>
       <div className={classes.inputContainer}>
@@ -85,7 +101,8 @@ ParkingProvidedRuleInput.propTypes = {
     units: PropTypes.string,
     minValue: PropTypes.number,
     maxValue: PropTypes.number,
-    validationErrors: PropTypes.array
+    validationErrors: PropTypes.array,
+    required: PropTypes.bool.isRequired
   }),
   onInputChange: PropTypes.func.isRequired
 };

client/src/components/ProjectWizard/RuleInput/RuleInputLabel.js

@@ -1,6 +1,8 @@
 import React from "react";
 import ToolTipLabel from "../../ToolTip/ToolTipLabel";
 import PropTypes from "prop-types";
+import { faLink } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 const RuleInputLabel = ({
   id,
@@ -22,6 +24,7 @@ const RuleInputLabel = ({
       {link ? (
         <a href={link} target="_blank" rel="noopener noreferrer">
           {name}
+          <FontAwesomeIcon icon={faLink} color="black" transform="shrink-5" />
         </a>
       ) : (
         name

client/src/components/ProjectWizard/WizardFooter.js

@@ -72,6 +72,7 @@ const WizardFooter = ({
                 }}
               />
             </div>
+
             <Button
               type="input"
               color="colorPrimary"

client/src/components/ProjectWizard/WizardPages/ProjectDescriptions.js

@@ -19,6 +19,10 @@ function ProjectDescriptions(props) {
           suppressHeader={true}
         />
       </form>
+      <div className="tdm-wizard-page-disclaimer">
+        <span className="tdm-wizard-page-disclaimer-asterisk">*</span>{" "}
+        designates required fields
+      </div>
     </div>
   );
 }

client/src/components/TdmCalculationContainer.js

@@ -290,9 +290,24 @@ export function TdmCalculationContainer({
       ...formInputs,
       [e.target.name]: value
     };
+    applySideEffects(newFormInputs, ruleCode, value);
+
     recalculate(newFormInputs);
   };
 
+  // If selecting a particular value for a particular rule needs to cause
+  // a change to another input...
+  const applySideEffects = (formInputs, ruleCode, value) => {
+    switch (ruleCode) {
+      case "STRATEGY_CAR_SHARE_3":
+        // When Car Share membership is set to "Blue LA", automatically select
+        // Car Sharing Electric Vehicle Bonus (issue #791)
+        if (value === "2") {
+          formInputs["STRATEGY_CAR_SHARE_ELECTRIC"] = true;
+        }
+    }
+  };
+
   const onCommentChange = e => {
     let ruleCode = e.target.name;
     let value =

client/src/styles/AuthForms.scss

@@ -1,8 +1,7 @@
 @import "./_partials.scss";
 
 .auth-form {
-  max-width: 600px;
-  min-width: 500px;
+  width: 500px;
   display: flex;
   justify-content: center;
   flex-direction: column;
@@ -11,11 +10,13 @@
   .form-control .is-invalid,
   .invalid-feedback {
     border-color: #dc3545;
-    padding-right: calc(1.5em + 0.75rem);
     background-repeat: no-repeat;
     background-position: center right calc(0.375em + 0.1875rem);
     background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
     color: red;
+    max-width: 500px;
+    margin-top: -5px;
+    text-align: center;
   }
   .form-control {
     @extend %form-inputs;

client/src/styles/Calculation.scss

@@ -47,6 +47,18 @@
   font-style: normal;
 }
 
+.tdm-wizard-page-disclaimer {
+  position: relative;
+  top: 20px;
+  text-align: center;
+  font-weight: normal;
+  font-style: normal;
+}
+
+.tdm-wizard-page-disclaimer-asterisk {
+  color: red;
+}
+
 @media print {
   #all-buttons-wrapper {
     display: none;

cypress/cypress/integration/project-calculations-no-auths/beatrice-building.spec.js

@@ -59,7 +59,7 @@ describe("Beatrice Building", () => {
     cy.get("#STRATEGY_PARKING_2").check();
 
     // Transit Passes
-    cy.get("#STRATEGY_TRANSIT_ACCESS_3").select("25% of monthly fare");
+    cy.get("#STRATEGY_TRANSIT_ACCESS_3").select("25%-49% of monthly fare");
 
     // Advance to Summary Page
     cy.findByTestId("rightNavArrow").click();

cypress/cypress/integration/project-calculations-no-auths/victory-hotel.spec.js

@@ -52,7 +52,7 @@ describe("Victory Hotel", () => {
     // Encouragement Program
     cy.get("#STRATEGY_INFO_3").select("Education, Marketing & Outreach");
 
-    cy.get("#STRATEGY_TRANSIT_ACCESS_3").select("25% of monthly fare");
+    cy.get("#STRATEGY_TRANSIT_ACCESS_3").select("25%-49% of monthly fare");
 
     // Go to Summary Page
     cy.findByTestId("rightNavArrow").click();

package.json

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