fix: add backend url validation for url fields (bloom-housing#3568)

* fix: add backend url validation for url fields * fix: validate only if externalUrl should be URL * fix: use form values for application types on failed form submit * fix: hide url field when no digital application * fix: set proper default value to common digital application choice * fix: add hasHttps decorator for second error variant
housingbayarea · Sep 5, 2023 · 5a348e0 · 5a348e0
1 parent 04b7695
commit 5a348e0
Show file tree

Hide file tree

Showing 8 changed files with 85 additions and 10 deletions.
diff --git a/backend/core/src/application-methods/entities/application-method.entity.ts b/backend/core/src/application-methods/entities/application-method.entity.ts
@@ -1,12 +1,22 @@
 import { Column, Entity, ManyToOne, OneToMany } from "typeorm"
 import { Expose, Type } from "class-transformer"
-import { IsBoolean, IsEnum, IsOptional, IsString, MaxLength, ValidateNested } from "class-validator"
+import {
+  IsBoolean,
+  IsEnum,
+  IsOptional,
+  IsString,
+  IsUrl,
+  MaxLength,
+  ValidateIf,
+  ValidateNested,
+} from "class-validator"
 import { ValidationsGroupsEnum } from "../../shared/types/validations-groups-enum"
 import { AbstractEntity } from "../../shared/entities/abstract.entity"
 import { ApiProperty } from "@nestjs/swagger"
 import { Listing } from "../../listings/entities/listing.entity"
 import { ApplicationMethodType } from "../types/application-method-type-enum"
 import { PaperApplication } from "../../paper-applications/entities/paper-application.entity"
+import { hasHttps } from "../../shared/decorators/hasHttps.decorator"
 
 @Entity({ name: "application_methods" })
 export class ApplicationMethod extends AbstractEntity {
@@ -29,6 +39,11 @@ export class ApplicationMethod extends AbstractEntity {
   @IsOptional({ groups: [ValidationsGroupsEnum.default] })
   @IsString({ groups: [ValidationsGroupsEnum.default] })
   @MaxLength(4096, { groups: [ValidationsGroupsEnum.default] })
+  @ValidateIf((o) => o.type === ApplicationMethodType.ExternalLink, {
+    groups: [ValidationsGroupsEnum.default],
+  })
+  @hasHttps({ groups: [ValidationsGroupsEnum.default] })
+  @IsUrl({ require_protocol: true }, { groups: [ValidationsGroupsEnum.default] })
   externalReference?: string | null
 
   @Column({ type: "bool", nullable: true })

diff --git a/backend/core/src/listings/entities/listing-event.entity.ts b/backend/core/src/listings/entities/listing-event.entity.ts
@@ -1,5 +1,13 @@
 import { Expose, Type } from "class-transformer"
-import { IsDate, IsDefined, IsEnum, IsOptional, IsString, ValidateNested } from "class-validator"
+import {
+  IsDate,
+  IsDefined,
+  IsEnum,
+  IsOptional,
+  IsString,
+  IsUrl,
+  ValidateNested,
+} from "class-validator"
 import { ValidationsGroupsEnum } from "../../shared/types/validations-groups-enum"
 import { ListingEventType } from "../types/listing-event-type-enum"
 import { ApiProperty } from "@nestjs/swagger"
@@ -42,6 +50,7 @@ export class ListingEvent extends AbstractEntity {
   @Expose()
   @IsOptional({ groups: [ValidationsGroupsEnum.default] })
   @IsString({ groups: [ValidationsGroupsEnum.default] })
+  @IsUrl({ require_protocol: true }, { groups: [ValidationsGroupsEnum.default] })
   url?: string | null
 
   @Column({ type: "text", nullable: true })

diff --git a/backend/core/src/listings/entities/listing.entity.ts b/backend/core/src/listings/entities/listing.entity.ts
@@ -28,6 +28,7 @@ import {
   IsUUID,
   MaxLength,
   ValidateNested,
+  IsUrl,
 } from "class-validator"
 import { ApiProperty, ApiPropertyOptional } from "@nestjs/swagger"
 import { ValidationsGroupsEnum } from "../../shared/types/validations-groups-enum"
@@ -334,6 +335,7 @@ class Listing extends BaseEntity {
   @Expose()
   @IsOptional({ groups: [ValidationsGroupsEnum.default] })
   @IsString({ groups: [ValidationsGroupsEnum.default] })
+  @IsUrl({ require_protocol: true }, { groups: [ValidationsGroupsEnum.default] })
   buildingSelectionCriteria?: string | null
 
   @ManyToOne(() => Asset, { eager: true, nullable: true, cascade: true })

diff --git a/backend/core/src/multiselect-question/types/multiselect-link.ts b/backend/core/src/multiselect-question/types/multiselect-link.ts
@@ -1,5 +1,5 @@
 import { Expose } from "class-transformer"
-import { IsString } from "class-validator"
+import { IsString, IsUrl } from "class-validator"
 import { ValidationsGroupsEnum } from "../../shared/types/validations-groups-enum"
 import { ApiProperty } from "@nestjs/swagger"
 
@@ -12,5 +12,6 @@ export class MultiselectLink {
   @Expose()
   @IsString({ groups: [ValidationsGroupsEnum.default] })
   @ApiProperty()
+  @IsUrl({ require_protocol: true }, { groups: [ValidationsGroupsEnum.default] })
   url: string
 }
diff --git a/backend/core/src/shared/decorators/hasHttps.decorator.ts b/backend/core/src/shared/decorators/hasHttps.decorator.ts
@@ -0,0 +1,31 @@
+import {
+  registerDecorator,
+  ValidationArguments,
+  ValidationOptions,
+  ValidatorConstraint,
+  ValidatorConstraintInterface,
+} from "class-validator"
+
+export function hasHttps(validationOptions?: ValidationOptions) {
+  return function (object: unknown, propertyName: string) {
+    registerDecorator({
+      target: object.constructor,
+      propertyName,
+      options: validationOptions,
+      constraints: [],
+      validator: hasHttpsConstraint,
+    })
+  }
+}
+
+@ValidatorConstraint({ name: "hasHttps" })
+export class hasHttpsConstraint implements ValidatorConstraintInterface {
+  validate(url: string) {
+    const httpsRegex = /^https?:\/\//i
+    return httpsRegex.test(url)
+  }
+
+  defaultMessage(args: ValidationArguments) {
+    return `${args.property} must have https://`
+  }
+}
diff --git a/backend/core/test/listings/listings.e2e-spec.ts b/backend/core/test/listings/listings.e2e-spec.ts
@@ -289,7 +289,7 @@ describe("Listings", () => {
       type: ListingEventType.openHouse,
       startTime: new Date(),
       endTime: new Date(),
-      url: "testurl",
+      url: "https://www.testurl.com",
       note: "testnote",
       label: "testlabel",
       file: {

diff --git a/sites/partners/src/components/listings/PaperListingDetails/sections/helpers.tsx b/sites/partners/src/components/listings/PaperListingDetails/sections/helpers.tsx
@@ -25,9 +25,15 @@ export const getDetailBoolean = (listingBool: boolean) => {
 }
 
 export const getReadableErrorMessage = (errorMessage: string | undefined) => {
-  const errorDetails = errorMessage.substr(errorMessage.indexOf(" ") + 1)
+  const errorDetails = errorMessage.substring(errorMessage.indexOf(" ") + 1)
   let readableMessage = null
   switch (errorDetails) {
+    case "must have https://":
+      readableMessage = t("errors.urlHttpsError")
+      break
+    case "must be a URL address":
+      readableMessage = t("errors.urlError")
+      break
     case "must be an email":
       readableMessage = t("errors.emailAddressError")
       break

diff --git a/sites/partners/src/components/listings/PaperListingForm/sections/ApplicationTypes.tsx b/sites/partners/src/components/listings/PaperListingForm/sections/ApplicationTypes.tsx
@@ -39,7 +39,7 @@ interface Methods {
 
 const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
   // eslint-disable-next-line @typescript-eslint/unbound-method
-  const { register, setValue, watch, errors } = useFormContext()
+  const { register, setValue, watch, errors, getValues } = useFormContext()
   // watch fields
   const digitalApplicationChoice = watch("digitalApplicationChoice")
   const commonDigitalApplicationChoice = watch("commonDigitalApplicationChoice")
@@ -150,7 +150,12 @@ const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
       paper: null,
       referral: null,
     }
-    listing?.applicationMethods?.forEach((method) => {
+    const applicationMethods =
+      getValues()?.applicationMethods?.length > 0
+        ? getValues().applicationMethods
+        : listing?.applicationMethods
+
+    applicationMethods?.forEach((method) => {
       switch (method.type) {
         case ApplicationMethodType.Internal:
         case ApplicationMethodType.ExternalLink:
@@ -256,7 +261,8 @@ const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
                   {
                     ...yesNoRadioOptions[0],
                     id: "commonDigitalApplicationChoiceYes",
-                    defaultChecked: listing?.commonDigitalApplication === true ?? null,
+                    defaultChecked:
+                      methods?.digital?.type === ApplicationMethodType.Internal ?? null,
                     inputProps: {
                       onChange: () => {
                         setMethods({
@@ -272,7 +278,8 @@ const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
                   {
                     ...yesNoRadioOptions[1],
                     id: "commonDigitalApplicationChoiceNo",
-                    defaultChecked: listing?.commonDigitalApplication === false ?? null,
+                    defaultChecked:
+                      methods?.digital?.type === ApplicationMethodType.ExternalLink ?? null,
                     inputProps: {
                       onChange: () => {
                         setMethods({
@@ -290,7 +297,9 @@ const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
             </GridCell>
           )}
         </GridSection>
-        {((commonDigitalApplicationChoice && commonDigitalApplicationChoice === YesNoAnswer.No) ||
+        {((commonDigitalApplicationChoice &&
+          commonDigitalApplicationChoice === YesNoAnswer.No &&
+          digitalApplicationChoice === YesNoAnswer.Yes) ||
           (digitalApplicationChoice === YesNoAnswer.Yes &&
             !commonDigitalApplicationChoice &&
             listing?.commonDigitalApplication === false)) && (
@@ -315,6 +324,8 @@ const ApplicationTypes = ({ listing }: { listing: FormListing }) => {
                     })
                   },
                 }}
+                error={fieldHasError(errors?.applicationMethods?.[0]?.externalReference)}
+                errorMessage={fieldMessage(errors?.applicationMethods?.[0]?.externalReference)}
               />
             </GridCell>
           </GridSection>