Patient Flags Module OWA

Index

Overview

The Patient Flags Module OWA is an Open Web Application built using React & React-Redux in order to act as a front end for the Rest API supported by the Patient Flags Module. The web application consumes the Patient Flags Module Web API and has 7 Components.

 

Installation & Build

As a Part of Patient Flags Module

The Patient Flags Module OWA is a part of the Patient Flags Module (found here), hence it is built and deployed in the same build pipeline as the rest of the module.

Independent Build

You may also build and install the OWA directly via the following steps -

  1. Download the zip file from the GitHub Repo and unzip it.

  2. In terminal, navigate to the root of the file and run the command -  'npm install'  to create the node_modules file and download the dependencies.

  3. In 'webpack.config.js' modify the 'LOCAL_OWA_FOLDER' and 'APP_ENTRY_POINT' parameters to point to your server's owa folder and the host.

  4. Run the command - 'npm run build:deploy' in order to build and deploy the OWA.

Dependencies

Major external dependencies are listed below. List of all dependencies can be found in package.json file.

Dependency

Functionality

Link

Dependency

Functionality

Link

React-table

Rendering tables.

https://www.npmjs.com/package/react-table

Reactjs-popup

Generate modals.

https://www.npmjs.com/package/reactjs-popup

React-Redux

State management.

https://www.npmjs.com/package/react-redux

Changing API Base URL

The base url is obtained by appending a URI string to the location object obtained from window.origin.location. The base URL is contained in the following location-

Path

app/js/apiContext.js

Changing CSS

All changes to css are to be made in the referenceapplication.css file.

Path

app/css/referenceapplication.css

Components

Flags

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/flag

full

DELETE /patientflags/flag/{flagName}

ref

Functions:

Function

Parameter

Description

Function

Parameter

Description

deleteFlag

rowIndex

Delete flag data at particular row of table

buttonGenerator

index, passedData

Generate edit and delete action buttons for a particular record.

tagListGenerator

passedData

Generate object containing names of associated tags - rendered in table as comma separated values

handleOptionChangeTags

 

Handler for selecting tags when filtering flags by associated tags

handleEvaluatorChange

 

Handler for selecting how to filter tags (radio button options)

handleSubmit

 

Handler containing logic for filtering table data based on tags.

editCallback

dataFromChild, index

Handles data object returned from Edit Flags modal.

Edit Flags (Modal)

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/flag/{flagName}

ref

POST /patientflags/flag/{FlagName}

ref

Functions:

Function

Parameter

Description

Function

Parameter

Description

selectionMapping

data

Maps selected tags and priorities to state objects

postFlag

 

dispatches updateFlag action to POST new/updated flag data

handleOptionChangeTags

 

Handler for multi-select box when tags associated with flag are changed.

handleOptionChangePriority

 

Handler for drop down menu when priority associated with flag is changed.

handleSubmit

 

Handler for when flag data form is submitted.

Tags

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/tag

ref

DELETE /patientflags/tag/{tagName}

ref

Functions:

Function

Parameter

Description

Function

Parameter

Description

deleteTag

rowIndex

Delete tag data at particular row of table

buttonGenerator

index, passedData

Generate edit and delete action buttons for a particular record.

editCallback

dataFromChild, index

Handles data object returned from Edit Tags modal.

Edit Tags (Modal)

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/tag/{tagName}

ref

POST /patientflags/flag/{tagName}

ref

GET /patientflags/displaypoint

ref

GET /role

ref

Functions:

Function

Parameter

Description

Function

Parameter

Description

selectionMapping

data

Maps selected tags and priorities to state objects

displayPointReferenceStore

data

Coverts displayPoint names into numeric values  - 1 for Patient Header & 2 for Patient Dashboard

postTag

 

dispatches updateTag action to POST new/updated tag data

handleOptionChangeRoles

 

Handler for multi-select box when roles associated with tag are changed.

handleOptionChangeDisplayPoint

 

Handler for multi-select box when display points associated with tag are changed.

handleSubmit

 

Handler for when tag data form is submitted.

 

Priorities

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/priority

full

DELETE /patientflags/priority/{priorityName}

def

Functions:

Function

Parameter

Description

Function

Parameter

Description

deletePriority

rowIndex

Delete priority data at particular row of table

buttonGenerator

index, passedData

Generate edit and delete action buttons for a particular record.

colorIndicator

hexCode

Converts a given hex code value into a colored circle UI element displayed in the 'Indicators' column.

editCallback

dataFromChild, index

Handles data object returned from Edit Priority modal.

Edit Priority (Modal)

API Endpoints used:

Endpoint

Ref

Endpoint

Ref

GET /patientflags/priority/{priorityName}

def

POST /patientflags/priority/{priorityName}

def

Functions:

Function

Parameter

Description

Function

Parameter

Description

postPriority

 

dispatches update Priority action to POST new/updated priority data

handleColorChange

color

Handler for color picker.

handleSubmit

 

Handler for when flag data form is submitted.

 

Find Flagged Patients

API Endpoints used:

Endpoint

Parameter

Endpoint

Parameter

GET /patientflags/eval

flag = flagName

Functions:

Function

Parameter

Description

Function

Parameter

Description

handleOptionChangeFlags

 

Handler for selecting flags when searching patients by associated flags

 

Resources

TBD