Add medical supply order type flow to the order basket

.github/workflows/node.js.yml

@@ -11,7 +11,7 @@ on:
 
 env:
   ESM_NAME: "@openmrs/esm-template-app"
-  JS_NAME: "openmrs-esm-template-app.js"
+  JS_NAME: "openmrs-esm-patient-medical-supply-orders-app.js"
 
 jobs:
   build:

README.md

@@ -1,14 +1,8 @@
-![Node.js CI](https://github.com/openmrs/openmrs-esm-template-app/workflows/Node.js%20CI/badge.svg)
+![Node.js CI](https://github.com/openmrs/openmrs-esm-patient-medical-supply-orders-app/workflows/Node.js%20CI/badge.svg)
 
-# OpenMRS ESM Template App
+# Patient Medical Supply Orders App
 
-This repository provides a starting point for creating your own
-[OpenMRS Microfrontend](https://wiki.openmrs.org/display/projects/OpenMRS+3.0%3A+A+Frontend+Framework+that+enables+collaboration+and+better+User+Experience).
-
-For more information, please see the
-[OpenMRS Frontend Developer Documentation](https://o3-docs.openmrs.org/#/).
-
-In particular, the [Setup](https://o3-docs.openmrs.org/docs/frontend-modules/setup) section can help you get started developing microfrontends in general. The [Creating a microfrontend](https://o3-docs.openmrs.org/docs/recipes/create-a-frontend-module) section provides information about how to use this repository to create your own microfrontend.
+This repository adds a new Patient Medical Supply order type to the Patient Chart Order Basket. The users will be able to place Medical Supply Orders and define the quantity and the Quantity Units for the order placed.
 
 ## Running this code
 
@@ -18,28 +12,7 @@ yarn start  # to run the dev server
 ```
 
 Once it is running, a browser window
-should open with the OpenMRS 3 application. Log in and then navigate to `/openmrs/spa/root`.
-
-## Adapting the code
-
-1. Start by finding and replacing all instances of "template" with the name
-  of your microfrontend.
-2. Update `index.ts` as appropriate, at least changing the feature name and the page name and route.
-3. Rename the `root.*` family of files to have the name of your first page.
-4. Delete the contents of the objects in `config-schema`. Start filling them back in once you have a clear idea what will need to be configured.
-5. Delete the `greeter` and `patient-getter` directories, and the contents of `root.component.tsx`.
-6. Delete the contents of `translations/en.json`.
-7. Open up `.github/workflows` and adapt it to your needs. If you're writing
- a microfrontend that will be managed by the community, you might be able to
-  just replace all instances of `template` with your microfrontend's name.
-  However, if you're writing a microfrontend for a specific organization or
-  implementation, you will probably need to configure GitHub Actions differently.
-8. Delete the contents of this README and write a short explanation of what
-  you intend to build. Links to planning or design documents can be very helpful.
-
-At this point, you should be able to write your first page as a React application.
-
-Check out the [Medication dispensing app](https://github.com/openmrs/openmrs-esm-dispensing-app) for an example of a non-trivial app built using the Template.
+should open with the OpenMRS 3 application.
 
 ## Integrating it into your application
 

package.json

@@ -1,9 +1,9 @@
 {
-  "name": "@openmrs/esm-template-app",
+  "name": "@openmrs/esm-patient-medical-supply-orders-app",
   "version": "4.0.0",
   "license": "MPL-2.0",
   "description": "An OpenMRS seed application for building microfrontends",
-  "browser": "dist/openmrs-esm-template-app.js",
+  "browser": "dist/openmrs-esm-patient-medical-supply-orders-app.js",
   "main": "src/index.ts",
   "source": true,
   "scripts": {
@@ -30,29 +30,36 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/openmrs/openmrs-esm-template-app.git"
+    "url": "git+https://github.com/openmrs/openmrsesm-patient-medical-supply-orders-app.git"
   },
-  "homepage": "https://github.com/openmrs/openmrs-esm-template-app#readme",
+  "homepage": "https://github.com/openmrs/openmrsesm-patient-medical-supply-orders-app#readme",
   "publishConfig": {
     "access": "public"
   },
   "bugs": {
-    "url": "https://github.com/openmrs/openmrs-esm-template-app/issues"
+    "url": "https://github.com/openmrs/openmrsesm-patient-medical-supply-orders-app/issues"
   },
   "dependencies": {
-    "@carbon/react": "^1.68.0",
-    "lodash-es": "^4.17.21"
+    "@hookform/resolvers": "^3.9.1",
+    "lodash-es": "^4.17.21",
+    "react-hook-form": "^7.53.2",
+    "zod": "^3.23.8"
   },
   "peerDependencies": {
-    "@openmrs/esm-framework": "*",
+    "@carbon/react": "^1.x",
+    "@openmrs/esm-framework": "5.x",
+    "@openmrs/esm-patient-common-lib": "8.x",
     "dayjs": "1.x",
     "react": "18.x",
     "react-i18next": "11.x",
     "react-router-dom": "6.x",
-    "rxjs": "6.x"
+    "rxjs": "6.x",
+    "swr": "2.x"
   },
   "devDependencies": {
+    "@carbon/react": "^1.71.0",
     "@openmrs/esm-framework": "next",
+    "@openmrs/esm-patient-common-lib": "next",
     "@openmrs/esm-styleguide": "next",
     "@playwright/test": "^1.42.1",
     "@swc/cli": "^0.3.12",
@@ -93,6 +100,7 @@
     "react-router-dom": "^6.14.1",
     "rxjs": "^6.6.7",
     "swc-loader": "^0.2.3",
+    "swr": "^2.2.5",
     "turbo": "^2.2.3",
     "typescript": "^4.9.5",
     "webpack": "^5.88.1",
@@ -102,5 +110,8 @@
     "packages/**/src/**/*.{ts,tsx}": "eslint --cache --fix --max-warnings 0",
     "*.{css,scss,ts,tsx}": "prettier --write --list-different"
   },
-  "packageManager": "[email protected]"
+  "packageManager": "[email protected]",
+  "resolutions": {
+    "@openmrs/esm-patient-common-lib": "portal:/Users/vasharma05/Projects/patient-chart/packages/esm-patient-common-lib"
+  }
 }

src/config-schema.ts

@@ -1,43 +1,72 @@
-import { Type, validator } from '@openmrs/esm-framework';
+import { Type, validator, validators } from '@openmrs/esm-framework';
+import _default from 'react-hook-form/dist/utils/createSubject';
 
-/**
- * This is the config schema. It expects a configuration object which
- * looks like this:
- *
- * ```json
- * { "casualGreeting": true, "whoToGreet": ["Mom"] }
- * ```
- *
- * In OpenMRS Microfrontends, all config parameters are optional. Thus,
- * all elements must have a reasonable default. A good default is one
- * that works well with the reference application.
- *
- * To understand the schema below, please read the configuration system
- * documentation:
- *   https://openmrs.github.io/openmrs-esm-core/#/main/config
- * Note especially the section "How do I make my module configurable?"
- *   https://openmrs.github.io/openmrs-esm-core/#/main/config?id=im-developing-an-esm-module-how-do-i-make-it-configurable
- * and the Schema Reference
- *   https://openmrs.github.io/openmrs-esm-core/#/main/config?id=schema-reference
- */
 export const configSchema = {
-  casualGreeting: {
-    _type: Type.Boolean,
-    _default: false,
-    _description: 'Whether to use a casual greeting (or a formal one).',
-  },
-  whoToGreet: {
+  orderTypes: {
     _type: Type.Array,
-    _default: ['World'],
-    _description: 'Who should be greeted. Names will be separated by a comma and space.',
     _elements: {
-      _type: Type.String,
+      _type: Type.Object,
+      orderTypeUuid: {
+        _type: Type.UUID,
+        _description: 'The UUID of the order type with the listed in the order basket',
+      },
+      orderableConceptClasses: {
+        _type: Type.Array,
+        _description:
+          'The concept class of the orderable concepts. By default it will look for concept class in the order type response',
+        _elements: {
+          _type: Type.UUID,
+        },
+      },
+      orderableConceptSets: {
+        _type: Type.Array,
+        _description:
+          "UUIDs of concepts that represent orderable concepts. Either the `conceptClass` should be given, or the `orderableConcepts`. If the orderableConcepts are not given, then it'll search concepts by concept class.",
+        _elements: {
+          _type: Type.UUID,
+        },
+      },
+    },
+    _default: [
+      {
+        orderTypeUuid: '67a92bd6-0f88-11ea-8d71-362b9e155667',
+        orderableConceptClasses: [],
+        orderableConceptSets: [],
+      },
+    ],
+  },
+  quantityUnits: {
+    _type: Type.Object,
+    _description: 'Concept to be used for fetching quantity units',
+    _default: {
+      conceptUuid: '162402AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+      map: 'setMembers',
+    },
+    // _elements: {
+    conceptUuid: {
+      _type: Type.UUID,
+      _description: 'UUID for the quantity units concepts',
+      _default: '162402AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+    },
+    map: {
+      _type: Type.UUID,
+      _description:
+        "Whether to use the concept answers of the setMembers of the concept. One of 'answers' or 'setMembers'.",
+      _default: 'setMembers',
+      _validators: [validators.oneOf(['answers', 'setMembers'])],
     },
-    _validators: [validator((v) => v.length > 0, 'At least one person must be greeted.')],
   },
+  // },
 };
 
-export type Config = {
-  casualGreeting: boolean;
-  whoToGreet: Array<string>;
+export type ConfigObject = {
+  orderTypes: Array<{
+    orderTypeUuid: string;
+    orderableConceptClasses: Array<string>;
+    orderableConceptSets: Array<string>;
+  }>;
+  quantityUnits: {
+    conceptUuid: string;
+    map: 'answers' | 'setMembers';
+  };
 };

src/constants.ts

@@ -0,0 +1 @@
+export const moduleName = '@openmrs/esm-patient-medical-supply-orders-app';