fix(image): enforce visit field when create image

package.json

@@ -5,7 +5,7 @@
   "private": false,
   "license": "MIT",
   "dependencies": {
-    "@hospitalrun/components": "~3.3.0",
+    "@hospitalrun/components": "~3.4.0",
     "@reduxjs/toolkit": "~1.5.0",
     "@types/escape-string-regexp": "~2.0.1",
     "@types/json2csv": "~5.0.1",

src/__tests__/imagings/util/validate-imaging-request.test.ts

@@ -8,6 +8,8 @@ describe('imaging request validator', () => {
       patient: 'imagings.requests.error.patientRequired',
       status: 'imagings.requests.error.statusRequired',
       type: 'imagings.requests.error.typeRequired',
+      visit: 'imagings.requests.error.visitRequired',
+      message: 'imagings.requests.error.unableToRequest',
     }
 
     const actualError = validateImagingRequest(newImagingRequest)

src/imagings/requests/NewImagingRequest.tsx

@@ -162,6 +162,8 @@ const NewImagingRequest = () => {
                 isEditable={newImagingRequest.patient !== undefined}
                 options={visitOption || []}
                 defaultSelected={defaultSelectedVisitsOption()}
+                isInvalid={!!error?.visit}
+                feedback={t(error?.visit)}
                 onChange={(values) => {
                   onVisitChange(values[0])
                 }}

src/imagings/util/validate-imaging-request.ts

@@ -1,3 +1,5 @@
+import { isEmpty } from 'lodash'
+
 import Imaging from '../../shared/model/Imaging'
 
 const statusType: string[] = ['requested', 'completed', 'canceled']
@@ -9,21 +11,27 @@ export class ImagingRequestError extends Error {
 
   status?: string
 
-  constructor(message: string, patient?: string, type?: string, status?: string) {
+  visit?: string
+
+  constructor(message: string, patient?: string, type?: string, status?: string, visit?: string) {
     super(message)
     this.patient = patient
     this.type = type
     this.status = status
+    this.visit = visit
     Object.setPrototypeOf(this, ImagingRequestError.prototype)
   }
 }
 
-export default function validateImagingRequest(request: Partial<Imaging>) {
-  const imagingRequestError = {} as any
+export default function validateImagingRequest(request: Partial<Imaging>): ImagingRequestError {
+  const imagingRequestError = {} as ImagingRequestError
+
   if (!request.patient) {
     imagingRequestError.patient = 'imagings.requests.error.patientRequired'
   }
-
+  if (!request.visitId) {
+    imagingRequestError.visit = 'imagings.requests.error.visitRequired'
+  }
   if (!request.type) {
     imagingRequestError.type = 'imagings.requests.error.typeRequired'
   }
@@ -34,5 +42,9 @@ export default function validateImagingRequest(request: Partial<Imaging>) {
     imagingRequestError.status = 'imagings.requests.error.incorrectStatus'
   }
 
+  if (!isEmpty(imagingRequestError)) {
+    imagingRequestError.message = 'imagings.requests.error.unableToRequest'
+  }
+
   return imagingRequestError
 }

src/shared/components/input/SelectWithLabelFormGroup.tsx

@@ -18,6 +18,7 @@ interface Props {
   multiple?: boolean
   isEditable?: boolean
   isInvalid?: boolean
+  feedback?: string
 }
 
 const SelectWithLabelFormGroup = (props: Props) => {
@@ -32,6 +33,7 @@ const SelectWithLabelFormGroup = (props: Props) => {
     multiple,
     isEditable,
     isInvalid,
+    feedback,
   } = props
   const id = `${name}Select`
   return (
@@ -46,6 +48,7 @@ const SelectWithLabelFormGroup = (props: Props) => {
         multiple={multiple}
         disabled={!isEditable}
         isInvalid={isInvalid}
+        feedback={feedback}
       />
     </div>
   )

src/shared/locales/enUs/translations/imagings/index.ts

@@ -19,6 +19,7 @@ export default {
         typeRequired: 'Type is required.',
         statusRequired: 'Status is required.',
         patientRequired: 'Patient name is required.',
+        visitRequired: 'Visit is required.',
       },
     },
     imaging: {