ORV2-3262 - Remove all instances of fax from frontend (#1746)

Co-authored-by: Krishnan Subramanian <[email protected]>
bcgov · Jan 21, 2025 · 7fe0fd0 · 7fe0fd0
1 parent 59188b8
commit 7fe0fd0
Show file tree

Hide file tree

Showing 40 changed files with 37 additions and 241 deletions.
diff --git a/frontend/src/common/authentication/OnRouteBCContext.tsx b/frontend/src/common/authentication/OnRouteBCContext.tsx
@@ -31,7 +31,6 @@ export interface BCeIDUserDetailContext {
   phone2?: string;
   phone2Extension?: string;
   email: string;
-  fax?: string;
   userRole: BCeIDUserRoleType;
 }
 

diff --git a/frontend/src/common/authentication/types.ts b/frontend/src/common/authentication/types.ts
@@ -29,7 +29,6 @@ export type PartialCompanyProfile = {
   };
   email: string;
   phone: string;
-  fax?: Nullable<string>;
   extension?: Nullable<string>;
   primaryContact?: Nullable<Contact>;
 };
@@ -55,7 +54,6 @@ export type BCeIDUserContextType = {
     lastName?: string;
     phone1?: string;
     phone2?: string;
-    fax?: string;
     email?: string;
     city?: string;
     provinceCode?: string;

diff --git a/frontend/src/common/constants/bannerMessages.ts b/frontend/src/common/constants/bannerMessages.ts
@@ -6,7 +6,7 @@ export const BANNER_MESSAGES = {
   ALL_FIELDS_MANDATORY:
     "Please note, unless stated otherwise, all fields are mandatory.",
   PERMIT_SEND_TO:
-    "The permit will be sent to the email on your onRouteBC Company Information, in addition to any email listed below. If you would also like to receive the permit by Fax, please enter a fax number.",
+    "The permit will be sent to the email on your onRouteBC Company Information, in addition to any email listed below.",
   PERMIT_REFUND_REQUEST: `Refunds and amendments can be requested over the phone by calling the Provincial Permit Centre at Toll-free: ${TOLL_FREE_NUMBER}. Please have your permit number ready.`,
   POLICY_REMINDER:
     "The applicant is responsible for ensuring they are following Legislation, policies, standards and guidelines in the operation of a commercial transportation business in British Columbia.",

diff --git a/frontend/src/features/idir/company/IDIRCreateCompany.tsx b/frontend/src/features/idir/company/IDIRCreateCompany.tsx
@@ -71,7 +71,6 @@ export const IDIRCreateCompany = React.memo(() => {
       email: getDefaultRequiredVal("", migratedClient?.email),
       phone: getDefaultRequiredVal("", migratedClient?.phone),
       extension: getDefaultRequiredVal("", migratedClient?.extension),
-      fax: getDefaultRequiredVal("", migratedClient?.fax),
       // A migrated but unclaimed company will not have primaryContact.
       primaryContact: {
         firstName: "",

diff --git a/frontend/src/features/idir/search/components/IDIRCompanySearchResults.tsx b/frontend/src/features/idir/search/components/IDIRCompanySearchResults.tsx
@@ -93,7 +93,6 @@ export const IDIRCompanySearchResults = memo(
             migratedClientHash,
             mailingAddress,
             email,
-            fax,
             alternateName,
             phone,
             extension,
@@ -109,7 +108,6 @@ export const IDIRCompanySearchResults = memo(
             email,
             phone,
             extension,
-            fax,
             alternateName,
             isSuspended,
           };

diff --git a/frontend/src/features/idir/search/components/IDIRPermitSearchRowActions.tsx b/frontend/src/features/idir/search/components/IDIRPermitSearchRowActions.tsx
@@ -143,13 +143,11 @@ export const IDIRPermitSearchRowActions = ({
   const handleResend = async (
     permitId: string,
     email: string,
-    fax: string,
     notificationTypes: EmailNotificationType[],
   ) => {
     const response = await resendPermitMutation.mutateAsync({
       permitId,
       email,
-      fax,
       notificationTypes,
     });
 

diff --git a/frontend/src/features/idir/search/components/PermitResendDialog.tsx b/frontend/src/features/idir/search/components/PermitResendDialog.tsx
@@ -13,7 +13,6 @@ import {
 import "./PermitResendDialog.scss";
 import { getDefaultRequiredVal } from "../../../../common/helpers/util";
 import { Optional } from "../../../../common/types/common";
-import { validateOptionalPhoneNumber } from "../../../../common/helpers/phone/validateOptionalPhoneNumber";
 import {
   requiredMessage,
   selectionRequired,
@@ -32,7 +31,6 @@ import {
 interface PermitResendFormData {
   permitId: string;
   email: string;
-  fax: string;
   notificationTypes: {
     EMAIL_PERMIT: boolean;
     EMAIL_RECEIPT: boolean;
@@ -55,7 +53,7 @@ const notificationTypesRules = {
 };
 
 /**
- *  A dialog box for resending permit by email or fax.
+ *  A dialog box for resending permit by email.
  */
 export default function PermitResendDialog({
   shouldOpen,
@@ -64,20 +62,17 @@ export default function PermitResendDialog({
   permitId,
   permitNumber,
   email,
-  fax,
 }: Readonly<{
   shouldOpen: boolean;
   onResend: (
     permitId: string,
     email: string,
-    fax: string,
     notificationTypes: EmailNotificationType[],
   ) => Promise<void>;
   onCancel: () => void;
   permitId: string;
   permitNumber: string;
   email?: string;
-  fax?: string;
 }>) {
   const [notificationTypes, setNotificationTypes] = useState({
     EMAIL_PERMIT: false,
@@ -88,7 +83,6 @@ export default function PermitResendDialog({
     defaultValues: {
       permitId,
       email: getDefaultRequiredVal("", email),
-      fax: getDefaultRequiredVal("", fax),
       notificationTypes,
     },
     mode: "onSubmit",
@@ -114,18 +108,13 @@ export default function PermitResendDialog({
     onCancel();
   };
 
-  const unformatFax = (fax: string) => {
-    return fax.replace(/[+()-\s]/g, "");
-  };
-
   const handleResend = (formData: PermitResendFormData) => {
-    const { permitId, email, fax: formattedFax, notificationTypes } = formData;
-    const fax = unformatFax(formattedFax);
+    const { permitId, email, notificationTypes } = formData;
     const selectedNotificationTypes = Object.keys(notificationTypes).filter(
       (type) => notificationTypes[type as EmailNotificationType],
     ) as EmailNotificationType[];
 
-    onResend(permitId, email, fax, selectedNotificationTypes);
+    onResend(permitId, email, selectedNotificationTypes);
   };
 
   const toggleNotificationType = (type: EmailNotificationType) => {
@@ -219,24 +208,6 @@ export default function PermitResendDialog({
               label: "Email",
             }}
           />
-
-          <CustomFormComponent
-            type="phone"
-            feature={FEATURE}
-            options={{
-              name: "fax",
-              label: "Fax",
-              rules: {
-                required: false,
-                validate: {
-                  validateFax: (fax?: string) => {
-                    return validateOptionalPhoneNumber(fax);
-                  },
-                },
-              },
-            }}
-            className="permit-resend-info__input permit-resend-info__input--fax"
-          />
         </div>
 
         <div className="permit-resend-dialog__actions">

diff --git a/frontend/src/features/manageProfile/apiManager/hooks.ts b/frontend/src/features/manageProfile/apiManager/hooks.ts
@@ -151,7 +151,6 @@ export const useUserContext = (
           phone2: user.phone2,
           phone2Extension: user.phone2Extension,
           email: user.email,
-          fax: user.fax,
           userRole: user.userRole as BCeIDUserRoleType,
         } as BCeIDUserDetailContext;
 

diff --git a/frontend/src/features/manageProfile/components/forms/common/ReusableUserInfoForm.tsx b/frontend/src/features/manageProfile/components/forms/common/ReusableUserInfoForm.tsx
@@ -152,24 +152,6 @@ export const ReusableUserInfoForm = ({
         />
       </div>
 
-      <CustomFormComponent
-        type="phone"
-        feature={FEATURE}
-        options={{
-          name: "fax",
-          rules: {
-            required: false,
-            validate: {
-              validateFax: (fax?: string) => {
-                return validateOptionalPhoneNumber(fax);
-              },
-            },
-          },
-          label: "Fax",
-        }}
-        className="my-info-form__input my-info-form__input--left"
-      />
-
       <CountryAndProvince
         feature={FEATURE}
         countryField="countryCode"

diff --git a/frontend/src/features/manageProfile/components/forms/companyInfo/CompanyInfoForm.tsx b/frontend/src/features/manageProfile/components/forms/companyInfo/CompanyInfoForm.tsx
@@ -75,7 +75,6 @@ export const CompanyInfoForm = memo(
         email: getDefaultRequiredVal("", companyInfo?.email, userEmail),
         phone: applyWhenNotNullable(getFormattedPhoneNumber, companyInfo?.phone, ""),
         extension: getDefaultRequiredVal("", companyInfo?.extension),
-        fax: applyWhenNotNullable(getFormattedPhoneNumber, companyInfo?.fax, ""),
         primaryContact: {
           firstName: getDefaultRequiredVal(
             "",

diff --git a/...eatures/manageProfile/components/forms/companyInfo/subForms/CompanyContactDetailsForm.tsx b/...eatures/manageProfile/components/forms/companyInfo/subForms/CompanyContactDetailsForm.tsx
@@ -4,7 +4,6 @@ import "./CompanyContactDetailsForm.scss";
 import { CustomFormComponent } from "../../../../../../common/components/form/CustomFormComponents";
 import { validatePhoneNumber } from "../../../../../../common/helpers/phone/validatePhoneNumber";
 import { validatePhoneExtension } from "../../../../../../common/helpers/phone/validatePhoneExtension";
-import { validateOptionalPhoneNumber } from "../../../../../../common/helpers/phone/validateOptionalPhoneNumber";
 import { invalidEmail, requiredMessage } from "../../../../../../common/helpers/validationMessages";
 
 export const CompanyContactDetailsForm = ({
@@ -74,21 +73,5 @@ export const CompanyContactDetailsForm = ({
         className="company-contact-details-form__input company-contact-details-form__input--right"
       />
     </div>
-
-    <CustomFormComponent
-      type="phone"
-      feature={feature}
-      options={{
-        name: "fax",
-        rules: {
-          required: false,
-          validate: {
-            validateFax: (fax?: string) => validateOptionalPhoneNumber(fax),
-          },
-        },
-        label: "Fax",
-      }}
-      className="company-contact-details-form__input company-contact-details-form__input--left"
-    />
   </div>
 );
diff --git a/frontend/src/features/manageProfile/components/forms/myInfo/MyInfoForm.tsx b/frontend/src/features/manageProfile/components/forms/myInfo/MyInfoForm.tsx
@@ -25,6 +25,8 @@ import {
   BCeID_USER_ROLE,
 } from "../../../../../common/authentication/types";
 
+const FEATURE = "my-info-form";
+
 export const MyInfoForm = memo(
   ({
     myInfo,
@@ -44,7 +46,6 @@ export const MyInfoForm = memo(
         phone1Extension: getDefaultRequiredVal("", myInfo?.phone1Extension),
         phone2: applyWhenNotNullable(getFormattedPhoneNumber, myInfo?.phone2, ""),
         phone2Extension: getDefaultRequiredVal("", myInfo?.phone2Extension),
-        fax: applyWhenNotNullable(getFormattedPhoneNumber, myInfo?.fax, ""),
         countryCode: getDefaultRequiredVal("", myInfo?.countryCode),
         provinceCode: getDefaultRequiredVal("", myInfo?.provinceCode),
         city: getDefaultRequiredVal("", myInfo?.city),
@@ -80,13 +81,12 @@ export const MyInfoForm = memo(
       });
     };
 
-    const FEATURE = "my-info-form";
-
     return (
       <div className="my-info-form">
         <FormProvider {...formMethods}>
           <ReusableUserInfoForm feature={FEATURE} />
         </FormProvider>
+
         <div className="my-info-form__submission">
           <Button
             key="update-my-info-cancel-button"
@@ -98,6 +98,7 @@ export const MyInfoForm = memo(
           >
             Cancel
           </Button>
+
           <Button
             key="update-my-info-button"
             className="submit-btn"

diff --git a/frontend/src/features/manageProfile/components/forms/userManagement/EditUser.tsx b/frontend/src/features/manageProfile/components/forms/userManagement/EditUser.tsx
@@ -28,6 +28,8 @@ import {
   getDefaultRequiredVal,
 } from "../../../../../common/helpers/util";
 
+const FEATURE = "user-info-form";
+
 /**
  * Edit User form for User Management.
  */
@@ -46,7 +48,6 @@ export const EditUserForm = memo(
         phone1Extension: getDefaultRequiredVal("", userInfo?.phone1Extension),
         phone2: applyWhenNotNullable(getFormattedPhoneNumber, userInfo?.phone2, ""),
         phone2Extension: getDefaultRequiredVal("", userInfo?.phone2Extension),
-        fax: applyWhenNotNullable(getFormattedPhoneNumber, userInfo?.fax, ""),
         countryCode: getDefaultRequiredVal("", userInfo?.countryCode),
         provinceCode: getDefaultRequiredVal("", userInfo?.provinceCode),
         city: getDefaultRequiredVal("", userInfo?.city),
@@ -56,15 +57,12 @@ export const EditUserForm = memo(
         ),
       },
     });
-    const { handleSubmit } = formMethods;
-    const FEATURE = "user-info-form";
 
+    const { handleSubmit } = formMethods;
+
     const [isUserGroupsModalOpen, setIsUserGroupsModalOpen] =
       useState<boolean>(false);
 
-    /**
-     * On click handler for the breadcrumbs. Navigates to the parent pages.
-     */
     const onClickBreadcrumb = () => {
       navigate(PROFILE_ROUTES.MANAGE, {
         state: {
@@ -73,9 +71,6 @@ export const EditUserForm = memo(
       });
     };
 
-    /**
-     * Updates the user info.
-     */
     const updateUserInfoMutation = useMutation({
       mutationFn: updateUserInfo,
       onError: (error: AxiosError) => {
@@ -105,10 +100,6 @@ export const EditUserForm = memo(
       },
     });
 
-    /**
-     * On click handler for Save button.
-     * @param data The edit user form data.
-     */
     const onUpdateUserInfo = (data: UserInfoRequest) => {
       updateUserInfoMutation.mutate({
         userInfo: data,
@@ -138,8 +129,10 @@ export const EditUserForm = memo(
               >
                 User Details
               </Typography>
+
               <ReusableUserInfoForm feature={FEATURE} />
             </Stack>
+
             <Stack direction="row">
               <Stack>
                 <Typography
@@ -153,6 +146,7 @@ export const EditUserForm = memo(
                 >
                   Assign User Group
                 </Typography>
+
                 <Typography
                   variant={"h2"}
                   sx={{
@@ -169,6 +163,7 @@ export const EditUserForm = memo(
                   </CustomActionLink>
                 </Typography>
               </Stack>
+
               <Stack spacing={2}>
                 <Controller
                   name="userRole"
@@ -179,6 +174,7 @@ export const EditUserForm = memo(
                     <UserAuthRadioGroup field={field} fieldState={fieldState} />
                   )}
                 ></Controller>
+
                 <Stack direction="row" spacing={2}>
                   <Button
                     key="update-my-info-cancel-button"
@@ -189,6 +185,7 @@ export const EditUserForm = memo(
                   >
                     Cancel
                   </Button>
+
                   <Button
                     key="update-my-info-button"
                     aria-label="Update My Info"
@@ -202,7 +199,9 @@ export const EditUserForm = memo(
               </Stack>
             </Stack>
           </Stack>
+
           <br />
+
           <UserGroupsAndPermissionsModal
             isOpen={isUserGroupsModalOpen}
             onClickClose={() => setIsUserGroupsModalOpen(() => false)}