Aidbox React Sample App

This is a sample frontend application that uses Aidbox as backend.

The project includes

• SMART On FHIR Patient Portal module

Development Stack

• Aidbox - FHIR server
• TypeScript
• React - UI framework
• Effector - state management

Requirements

• NodeJS >=14
• Docker latest
• Docker Compose latest
• Make latest
• yarn latest

Installation

1. Prepare environment

   make install
   
   make prepare

2. Acquire devbox license (https://license-ui.aidbox.app/)

3. Fill AIDBOX_LICENSE_ID and AIDBOX_LICENSE_KEY with the acquired credentials in ./.env

4. Acquire a Mailgun API Key (https://documentation.mailgun.com/en/latest/api-intro.html#authentication)

5. Fill MAILGUN_API_KEY with your key in ./.env

6. Start the application

   make up

7. Go to http://localhost:3000/ in your browser

   If everything works, you should see an Aidbox login page.

   Credentials

   Portal admin

   Go to http://localhost:3000/ (you will be redirected to login form) and log in using: portal-admin / password

   Aidbox admin

   Go to http://localhost:8888/auth/login and log in using: admin / secret

8. You might want to load some data to display on UI. For that, log in as Aidbox admin, then select REST Console in the menu on the left, enter the following snippet and press Ctrl + Enter or "Send" button

POST /fhir/$import
Accept: text/yaml
Content-Type: text/yaml

id: synthea
inputFormat: application/fhir+ndjson
contentEncoding: gzip
mode: bulk
inputs:
- resourceType: AllergyIntolerance
  url: https://storage.googleapis.com/aidbox-public/synthea/100/AllergyIntolerance.ndjson.gz
- resourceType: CarePlan
  url: https://storage.googleapis.com/aidbox-public/synthea/100/CarePlan.ndjson.gz
- resourceType: Claim
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Claim.ndjson.gz
- resourceType: Condition
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Condition.ndjson.gz
- resourceType: DiagnosticReport
  url: https://storage.googleapis.com/aidbox-public/synthea/100/DiagnosticReport.ndjson.gz
- resourceType: Encounter
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Encounter.ndjson.gz
- resourceType: ExplanationOfBenefit
  url: https://storage.googleapis.com/aidbox-public/synthea/100/ExplanationOfBenefit.ndjson.gz
- resourceType: Goal
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Goal.ndjson.gz
- resourceType: ImagingStudy
  url: https://storage.googleapis.com/aidbox-public/synthea/100/ImagingStudy.ndjson.gz
- resourceType: Immunization
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Immunization.ndjson.gz
- resourceType: MedicationAdministration
  url: https://storage.googleapis.com/aidbox-public/synthea/100/MedicationAdministration.ndjson.gz
- resourceType: MedicationRequest
  url: https://storage.googleapis.com/aidbox-public/synthea/100/MedicationRequest.ndjson.gz
- resourceType: Observation
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Observation.ndjson.gz
- resourceType: Organization
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Organization.ndjson.gz
- resourceType: Patient
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Patient.ndjson.gz
- resourceType: Practitioner
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Practitioner.ndjson.gz
- resourceType: Procedure
  url: https://storage.googleapis.com/aidbox-public/synthea/100/Procedure.ndjson.gz

After you have loaded the sample data, you should be able to see patients and practitioners on the Patient Portal running on localhost:3000 when logged in as a Portal admin (don't forget to log out of your Aidbox admin session!).

Monitoring

To view database logs run:

docker logs aidbox-react-app_devbox-db_1

To view Aidbox logs run:

docker logs aidbox-react-app_devbox_1