GSoC 2019 with OpenMRS: Patient Flags Module OWA

Project: Patient Flags Module OWA

Rishav Rakshit
Aug 25 · 8 min read

Introduction

When diagnosing a patient, it is important to know about any current ailment or critical condition the patient might be facing — for example HIV positive, High BP, CD count > 200). The module Patient Flags Module provides a way to highlight or flag patients matching certain criteria (ex: High Risk, CD4 below 200, HIV Positive, Diabetic, etc).

The UI of this module was previously a standard JSP based one. The primary object of this project is to develop an Open Web Application or OWA as a front-end for the module.

The OWA has been developed in React (with Redux for state management), which consumes the Web API which was previously developed by Manimoona Kausar and team.

The Objectives for the Project are:

Primary Goals —

  • Build an Open Web Application in React modeled on the current JSP based UI. ☑️
  • The OWA should consume the provided Web API and successfully perform GET, POST and DELETE requests. ☑️
  • OWA should have an intuitive UI that can display the data fetched from the API and post data to the API.☑️
  • Make additional changes to the Web API to enable the above objective. ☑️
  • UI should follow OpenMRS style guidelines. ☑️

☑️ — Objective Achieved

Tasks Undertaken to Achieve these goals

  • Initial Project Structure setup, generating scaffolding with Yeoman Generator and upgrading packages ✅
  • Manage Patient Flags Component✅
  • Edit Flags Modal✅
  • Manage Patient Tags Component✅
  • Edit Tags Modal✅
  • Manage Patient Priorities Component✅
  • Edit Priorities Modal✅
  • Find Flagged Patients Component✅
  • Manage Global Flag Properties — REMOVED
  • Use React-Redux for state management✅
  • Use openmrs-react components for common components✅
  • Use state management to reduce number of API Calls Made✅
  • UI Enhancements according to Reference Application style guide✅
  • Modify API to meet fetched data requirements✅
  • Add UI Element — Page Header with user and location data ⚠️ BUG
  • Fix Soft Delete (When trying to delete record from table) ⚠️BUG
  • Add UI Element — Breadcrumb 🔴 PENDING

Extra Credit Tasks —

  • Add color swatch in Edit Tags Modal ✅
  • Add glyphicon support in Tags/Priorities Modal 🏁 PENDING (New Feature)

✅ — Task Completed

🔴 — Task Incomplete

⚠️ — Bug

🏁 — Pending New Feature for future Updates

It gives me great pleasure to acknowledge the fact that in 12 weeks we’ve been able to deliver a working application from scratch. Ultimately we have 2 bugs and a missing UI element which we were unable to implement/fix due to a shortage of time — but we have also planned to fix them before the release of Patient Flags Module version 3.2.0 ( of which the OWA is a part)

Mid Term Demonstration

The following demonstration was presented by me during the Mid-Term evaluation period. It explains the app architecture, project structure, tasks undertaken, Sprint cycles and a demonstration of the application (till then).


Implementation

Planning

The following diagram represents a brief overview of the plan of action undertaken:

Plan of Action

Initial Steps

The first step to creating the project was to create a basic scaffolding using the Yeoman Generator for OpenMRS. Next we had to update the core dependencies in order to conform to preferred versions required for our project (view package.json file)

Since I was relatively new to React, initially we planned to create the application using vanilla React and after Evaluation 2, incorporate —

openmrs-react-components
Redux
openmrs-styleguide for css

Application Architecture

The application primarily has 7 components, which we have split as:
1. Component — The tabbed page viewed by the end user.
2. Modal — A corresponding popup window that is used to input new data or modify existing data.

This resulted in creating a total of 4 Component Sets or 4 Pages.
Each Page has the following associated files —

The overall application architecture has been designed in the following manner:

Application Architecture

Major Dependencies

Although the application has several dependencies, a few major ones are listed below for future reference

Major dependencies

Application Screenshots

Flag Component
Edit Flag Modal
Manage Tags Component
Edit Tags Modal
Manage Priorities Component
Edit Priorities Modal
Find Flagged Patients Component
Table Data after search


Discussions

OpenMRS Talk Thread

We’ve used the OpenMRS Talk thread for the project in order to discuss general and non-sprint related issues and have documented milestones.

Weekly Blog Posts

The following are the weekly blog posts regarding the project. They act to serve as a guide as well — especially for sticky situations such as configuring webpack and the Yeoman generator.


Contributions

OpenMRS Jira Tickets

The following tickets have been created, claimed and worked on in this project —

Code Repositories

  1. Local GitHub Repository containing latest build — link
  2. Branch 3.2.0 of OpenMRS Flag Module — link

Pull Requests

Only a single PR has been made till now — we’ve been commiting to the same PR and plan to squash all the commits before request approval. Currently we’ve been having some issues with the Travis CI build though.


Resources

Documentation

As a part of the project, we’ve prepared a User Guide and a Developer Guide which can be found in the links below —

Future Works

The following future works have been envisioned for the project —

  • Fixing of existing bugs/issues (marked in Overview section)
  • Creating a better alert generation service.
  • Adding support for Managing Global Flag Properties.
  • Adding more filter options — filter by Priority color etc.
  • Adding glyphicon support in Tags or Priorities.

Thoughts on GSoC

Being a final year student, this was the first and (maybe ?) the last time I’ve participated in GSoC. This was truly a once-in-a-lifetime experience and I’ve never ever faced something as exciting!

OpenMRS has not only shown me that ‘Writing code does indeed saves lives’ but has also given me platform to prove myself. For this, I shall always be indebted to a highly welcoming a nurturing community and especially my mentors, Maimoona Kausar, Jude Niroshan as well as the coordinators, Suthagar and Irene!

Thank you GSoC and OpenMRS! 😄

Rishav Rakshit

Written by

GSoC 2019 @ OpenMRS | I’m a software developer with ❤ for NLP and UIs. You can see my ML & NLP blog here — https://rishavr.github.io/

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade