feat: update means of transport state machine and forms (#373)

* Update state machine and forms. * Extend API with submitMeansOfTransportForm endpoint. * Remove unused condition from commonInputValidator. * remove console.log. * Add missing context properties. * Update src/page-modules/contact/means-of-transport/means-of-transport-form-machine.ts Co-authored-by: Morten Nordseth <[email protected]> --------- Co-authored-by: Morten Nordseth <[email protected]>
AtB-AS · Oct 1, 2024 · 489a7db · 489a7db
1 parent 576515c
commit 489a7db
Show file tree

Hide file tree

Showing 12 changed files with 243 additions and 236 deletions.
diff --git a/src/page-modules/contact/means-of-transport/events.ts b/src/page-modules/contact/means-of-transport/events.ts
@@ -1,12 +1,13 @@
 import { TranslatedString } from '@atb/translations';
 import { commonEvents } from '../commoneEvents';
+import { Line } from '..';
 
 export type Area = { id: string; name: TranslatedString };
 
 const meansOfTransportSpecificFormEvents = {} as {
   type: 'ON_INPUT_CHANGE';
-  inputName: 'area' | 'formType' | 'wantsToBeContacted';
-  value: Area | string | boolean;
+  inputName: 'area' | 'formType' | 'isResponseWanted' | 'stop';
+  value: Area | string | boolean | Line['quays'][0];
 };
 
 export const meansOfTransportFormEvents = {} as

diff --git a/src/page-modules/contact/means-of-transport/forms/delayForm.tsx b/src/page-modules/contact/means-of-transport/forms/delayForm.tsx
@@ -172,7 +172,7 @@ export const DelayForm = ({ state, send }: DelayFormProps) => {
           {t(PageText.Contact.input.feedback.description)}
         </Typo.p>
         <Textarea
-          value={state.context.feedback}
+          value={state.context.feedback || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -203,7 +203,7 @@ export const DelayForm = ({ state, send }: DelayFormProps) => {
           label={PageText.Contact.input.firstName.label}
           type="text"
           name="firstName"
-          value={state.context.firstName}
+          value={state.context.firstName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -217,7 +217,7 @@ export const DelayForm = ({ state, send }: DelayFormProps) => {
           label={PageText.Contact.input.lastName.label}
           type="text"
           name="lastName"
-          value={state.context.lastName}
+          value={state.context.lastName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -231,7 +231,7 @@ export const DelayForm = ({ state, send }: DelayFormProps) => {
           label={PageText.Contact.input.email.label}
           type="email"
           name="email"
-          value={state.context.email}
+          value={state.context.email || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',

diff --git a/src/page-modules/contact/means-of-transport/forms/driverForm.tsx b/src/page-modules/contact/means-of-transport/forms/driverForm.tsx
@@ -10,7 +10,6 @@ import { TransportModeType } from '@atb-as/config-specs';
 import { Line } from '../..';
 import { FileInput } from '../../components/input/file';
 import { Textarea } from '../../components/input/textarea';
-import { RadioInput } from '../../components/input/radio';
 import { meansOfTransportFormEvents } from '../events';
 
 type DriverFormProps = {
@@ -195,7 +194,7 @@ export const DriverForm = ({ state, send }: DriverFormProps) => {
           {t(PageText.Contact.input.feedback.description)}
         </Typo.p>
         <Textarea
-          value={state.context.feedback}
+          value={state.context.feedback || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -226,7 +225,7 @@ export const DriverForm = ({ state, send }: DriverFormProps) => {
           label={PageText.Contact.input.firstName.label}
           type="text"
           name="firstName"
-          value={state.context.firstName}
+          value={state.context.firstName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -240,7 +239,7 @@ export const DriverForm = ({ state, send }: DriverFormProps) => {
           label={PageText.Contact.input.lastName.label}
           type="text"
           name="lastName"
-          value={state.context.lastName}
+          value={state.context.lastName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -250,49 +249,19 @@ export const DriverForm = ({ state, send }: DriverFormProps) => {
           }
         />
 
-        <Typo.p textType="body__primary">
-          {t(PageText.Contact.input.email.wantsToBeContacted.question)}
-        </Typo.p>
-
-        <RadioInput
-          label={t(PageText.Contact.input.email.wantsToBeContacted.yes)}
-          name="wantsToBeContacted"
-          checked={state.context.wantsToBeContacted}
-          onChange={() =>
-            send({
-              type: 'ON_INPUT_CHANGE',
-              inputName: 'wantsToBeContacted',
-              value: !state.context.wantsToBeContacted,
-            })
-          }
-        />
-        <RadioInput
-          label={t(PageText.Contact.input.email.wantsToBeContacted.no)}
-          name="wantsToBeContacted"
-          checked={!state.context.wantsToBeContacted}
-          onChange={() =>
+        <Input
+          label={PageText.Contact.input.email.label}
+          type="email"
+          name="email"
+          value={state.context.email || ''}
+          onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
-              inputName: 'wantsToBeContacted',
-              value: !state.context.wantsToBeContacted,
+              inputName: 'email',
+              value: e.target.value,
             })
           }
         />
-        {state.context.wantsToBeContacted && (
-          <Input
-            label={PageText.Contact.input.email.wantsToBeContacted.label}
-            type="email"
-            name="email"
-            value={state.context.email}
-            onChange={(e) =>
-              send({
-                type: 'ON_INPUT_CHANGE',
-                inputName: 'email',
-                value: e.target.value,
-              })
-            }
-          />
-        )}
       </SectionCard>
     </div>
   );

diff --git a/src/page-modules/contact/means-of-transport/forms/injuryForm.tsx b/src/page-modules/contact/means-of-transport/forms/injuryForm.tsx
@@ -10,7 +10,6 @@ import { TransportModeType } from '@atb-as/config-specs';
 import { Line } from '../..';
 import { FileInput } from '../../components/input/file';
 import { Textarea } from '../../components/input/textarea';
-import { RadioInput } from '../../components/input/radio';
 import { meansOfTransportFormEvents } from '../events';
 
 type InjuryFormProps = {
@@ -194,7 +193,7 @@ export const InjuryForm = ({ state, send }: InjuryFormProps) => {
           {t(PageText.Contact.input.feedback.description)}
         </Typo.p>
         <Textarea
-          value={state.context.feedback}
+          value={state.context.feedback || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -225,7 +224,7 @@ export const InjuryForm = ({ state, send }: InjuryFormProps) => {
           label={PageText.Contact.input.firstName.label}
           type="text"
           name="firstName"
-          value={state.context.firstName}
+          value={state.context.firstName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -239,7 +238,7 @@ export const InjuryForm = ({ state, send }: InjuryFormProps) => {
           label={PageText.Contact.input.lastName.label}
           type="text"
           name="lastName"
-          value={state.context.lastName}
+          value={state.context.lastName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -249,49 +248,19 @@ export const InjuryForm = ({ state, send }: InjuryFormProps) => {
           }
         />
 
-        <Typo.p textType="body__primary">
-          {t(PageText.Contact.input.email.wantsToBeContacted.question)}
-        </Typo.p>
-
-        <RadioInput
-          label={t(PageText.Contact.input.email.wantsToBeContacted.yes)}
-          name="wantsToBeContacted"
-          checked={state.context.wantsToBeContacted}
-          onChange={() =>
-            send({
-              type: 'ON_INPUT_CHANGE',
-              inputName: 'wantsToBeContacted',
-              value: !state.context.wantsToBeContacted,
-            })
-          }
-        />
-        <RadioInput
-          label={t(PageText.Contact.input.email.wantsToBeContacted.no)}
-          name="wantsToBeContacted"
-          checked={!state.context.wantsToBeContacted}
-          onChange={() =>
+        <Input
+          label={PageText.Contact.input.email.label}
+          type="email"
+          name="email"
+          value={state.context.email || ''}
+          onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
-              inputName: 'wantsToBeContacted',
-              value: !state.context.wantsToBeContacted,
+              inputName: 'email',
+              value: e.target.value,
             })
           }
         />
-        {state.context.wantsToBeContacted && (
-          <Input
-            label={PageText.Contact.input.email.wantsToBeContacted.label}
-            type="email"
-            name="email"
-            value={state.context.email}
-            onChange={(e) =>
-              send({
-                type: 'ON_INPUT_CHANGE',
-                inputName: 'email',
-                value: e.target.value,
-              })
-            }
-          />
-        )}
       </SectionCard>
     </div>
   );

diff --git a/src/page-modules/contact/means-of-transport/forms/serviceOfferingForm.tsx b/src/page-modules/contact/means-of-transport/forms/serviceOfferingForm.tsx
@@ -22,7 +22,7 @@ export const ServiceOfferingForm = ({
   send,
 }: ServiceOfferingFormProps) => {
   const { t } = useTranslation();
-  const { getLinesByMode, getQuaysByLine } = useLines();
+  const { getLinesByMode } = useLines();
 
   return (
     <div>
@@ -117,7 +117,7 @@ export const ServiceOfferingForm = ({
           {t(PageText.Contact.input.feedback.description)}
         </Typo.p>
         <Textarea
-          value={state.context.feedback}
+          value={state.context.feedback || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -148,7 +148,7 @@ export const ServiceOfferingForm = ({
           label={PageText.Contact.input.firstName.label}
           type="text"
           name="firstName"
-          value={state.context.firstName}
+          value={state.context.firstName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -162,7 +162,7 @@ export const ServiceOfferingForm = ({
           label={PageText.Contact.input.lastName.label}
           type="text"
           name="lastName"
-          value={state.context.lastName}
+          value={state.context.lastName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',

diff --git a/src/page-modules/contact/means-of-transport/forms/stopForm.tsx b/src/page-modules/contact/means-of-transport/forms/stopForm.tsx
@@ -81,14 +81,14 @@ export const StopForm = ({ state, send }: StopFormProps) => {
         />
 
         <Select
-          label={t(PageText.Contact.input.fromStop.labelWhitoutSpecification)}
-          value={state.context.fromStop}
+          label={t(PageText.Contact.input.stop.label)}
+          value={state.context.stop}
           disabled={!state.context.line}
           onChange={(value) => {
             if (!value) return;
             send({
               type: 'ON_INPUT_CHANGE',
-              inputName: 'fromStop',
+              inputName: 'stop',
               value: value,
             });
           }}
@@ -126,7 +126,7 @@ export const StopForm = ({ state, send }: StopFormProps) => {
           {t(PageText.Contact.input.feedback.description)}
         </Typo.p>
         <Textarea
-          value={state.context.feedback}
+          value={state.context.feedback || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -157,7 +157,7 @@ export const StopForm = ({ state, send }: StopFormProps) => {
           label={PageText.Contact.input.firstName.label}
           type="text"
           name="firstName"
-          value={state.context.firstName}
+          value={state.context.firstName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -171,7 +171,7 @@ export const StopForm = ({ state, send }: StopFormProps) => {
           label={PageText.Contact.input.lastName.label}
           type="text"
           name="lastName"
-          value={state.context.lastName}
+          value={state.context.lastName || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',
@@ -185,7 +185,7 @@ export const StopForm = ({ state, send }: StopFormProps) => {
           label={PageText.Contact.input.email.label}
           type="email"
           name="email"
-          value={state.context.email}
+          value={state.context.email || ''}
           onChange={(e) =>
             send({
               type: 'ON_INPUT_CHANGE',