Updated to the latest app shell

Author: FlorianRappl

.travis.yml

@@ -30,7 +30,7 @@ after_deploy:
   - >
     if [[ "$TRAVIS_BRANCH" == "master" ]]; then
       echo "Updating import map to point to new version of @openmrs/esm-drugorder-app"
-      statuscode=$(curl --output /dev/null --write-out %{http_code} -u $DEPLOYER_USERNAME:$DEPLOYER_PASSWORD -d '{ "service":"@openmrs/esm-drugorder-app","url":"https://spa-modules.nyc3.digitaloceanspaces.com/@openmrs/esm-drugorder-app/'$TRAVIS_COMMIT'/openmrs-esm-drugorder.js" }' -X PATCH $DEPLOYER_HOST/services\?env=prod -H "Accept:application/json" -H "Content-Type:application/json")
+      statuscode=$(curl --output /dev/null --write-out %{http_code} -u $DEPLOYER_USERNAME:$DEPLOYER_PASSWORD -d '{ "service":"@openmrs/esm-drugorder-app","url":"https://spa-modules.nyc3.digitaloceanspaces.com/@openmrs/esm-drugorder-app/'$TRAVIS_COMMIT'/openmrs-esm-drugorder-app.js" }' -X PATCH $DEPLOYER_HOST/services\?env=prod -H "Accept:application/json" -H "Content-Type:application/json")
       echo "Deployment Status Code --> ${statuscode}"
       if [ "$statuscode" -ne 200 ]; then travis_terminate "$statuscode"; fi
     fi

package-lock.json

@@ -1,8 +1,8 @@
 {
   "name": "@openmrs/esm-drugorder-app",
-  "version": "0.3.2",
+  "version": "0.4.0",
   "description": "Drug order microfrontend for the OpenMRS SPA",
-  "main": "dist/openmrs-esm-drugorder.js",
+  "main": "dist/openmrs-esm-drugorder-app.js",
   "types": "src/index.ts",
   "license": "MIT",
   "homepage": "https://github.com/openmrs/openmrs-esm-drugorder#readme",
@@ -38,21 +38,18 @@
   },
   "dependencies": {
     "@carbon/icons-react": "^10.18.0",
-    "@openmrs/react-root-decorator": "^3.3.1",
     "carbon-components-react": "^7.19.0",
     "dayjs": "^1.8.16",
-    "lodash": "^4.17.19",
     "lodash-es": "^4.17.15",
-    "single-spa-react": "^2.10.2",
     "systemjs-webpack-interop": "^1.1.0"
   },
   "peerDependencies": {
-    "@openmrs/esm-api": "^3.0.8",
-    "@openmrs/esm-config": "^3.0.8",
-    "@openmrs/esm-context": "^3.0.8",
-    "@openmrs/esm-error-handling": "^3.0.8",
-    "@openmrs/esm-extensions": "^3.0.8",
-    "@openmrs/esm-styleguide": "^3.0.8",
+    "@openmrs/esm-api": "^3.1.5",
+    "@openmrs/esm-config": "^3.1.5",
+    "@openmrs/esm-error-handling": "^3.1.5",
+    "@openmrs/esm-extensions": "^3.1.5",
+    "@openmrs/esm-react-utils": "^3.1.5",
+    "@openmrs/esm-styleguide": "^3.1.5",
     "carbon-components": "^10.19.0",
     "carbon-icons": "^7.0.7",
     "i18next": "^19.4.2",
@@ -67,12 +64,12 @@
     "@babel/preset-env": "^7.5.5",
     "@babel/preset-react": "^7.0.0",
     "@babel/preset-typescript": "^7.3.3",
-    "@openmrs/esm-api": "^3.0.8",
-    "@openmrs/esm-config": "^3.0.8",
-    "@openmrs/esm-context": "^3.0.8",
-    "@openmrs/esm-error-handling": "^3.0.8",
-    "@openmrs/esm-extensions": "^3.0.8",
-    "@openmrs/esm-styleguide": "^3.0.8",
+    "@openmrs/esm-api": "^3.1.5",
+    "@openmrs/esm-config": "^3.1.5",
+    "@openmrs/esm-error-handling": "^3.1.5",
+    "@openmrs/esm-extensions": "^3.1.5",
+    "@openmrs/esm-react-utils": "^3.1.5",
+    "@openmrs/esm-styleguide": "^3.1.5",
     "@testing-library/jest-dom": "^5.7.0",
     "@testing-library/react": "^9.5.0",
     "@types/carbon-components-react": "^7.10.9",
@@ -103,7 +100,7 @@
     "jest": "^24.9.0",
     "jest-cli": "^24.9.0",
     "node-sass": "^4.14.1",
-    "openmrs": "^3.0.8",
+    "openmrs": "^3.1.5",
     "prettier": "^1.18.2",
     "pretty-quick": "^1.11.1",
     "react": "^16.9.0",

package.json

@@ -1,25 +1,31 @@
+import { getAsyncLifecycle } from '@openmrs/esm-react-utils';
 import { backendDependencies } from './openmrs-backend-dependencies';
 
 const importTranslation = require.context('../translations', false, /.json$/, 'lazy');
 
+const options = {
+  featureName: 'drugorder',
+  moduleName: '@openmrs/esm-drugorder-app',
+};
+
 function setupOpenMRS() {
   return {
     pages: [
       {
-        load: () => import('./spa-order-basket-app'),
+        load: getAsyncLifecycle(() => import('./root-order-basket'), options),
         route: /^patient\/.+\/drugorder\/basket/,
       },
     ],
     extensions: [
       {
         id: 'drugorder-widget',
         slot: 'patient-chart-dashboard-medications',
-        load: () => import('./spa-medication-summary-extension'),
+        load: getAsyncLifecycle(() => import('./root-medication-summary'), options),
       },
       {
         id: 'order-basket-workspace',
         slot: '/patient/:patientUuid/drugorder/basket',
-        load: () => import('./spa-order-basket-extension'),
+        load: getAsyncLifecycle(() => import('./root-order-basket'), options),
       },
     ],
   };

src/index.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BrowserRouter, Route, Switch } from 'react-router-dom';
 import { defineConfigSchema } from '@openmrs/esm-config';
-import openmrsRootDecorator from '@openmrs/react-root-decorator';
 import MedicationsSummary from './medications-summary/medications-summary.component';
 import styles from './root.scss';
 import { Provider } from 'unistore/react';
@@ -13,7 +12,7 @@ export interface RootMedicationSummaryProps {
   patientUuid: string;
 }
 
-function RootMedicationSummary({ patientUuid }: RootMedicationSummaryProps) {
+export default function RootMedicationSummary({ patientUuid }: RootMedicationSummaryProps) {
   return (
     <div className={styles.resetPatientChartWidgetContainer}>
       <BrowserRouter basename={window['getOpenmrsSpaBase']()}>
@@ -28,8 +27,3 @@ function RootMedicationSummary({ patientUuid }: RootMedicationSummaryProps) {
     </div>
   );
 }
-
-export default openmrsRootDecorator({
-  featureName: 'drugorder',
-  moduleName: '@openmrs/esm-drugorder-app',
-})(RootMedicationSummary);

src/root-medication-summary.tsx

@@ -1,12 +1,11 @@
 import React from 'react';
 import { defineConfigSchema } from '@openmrs/esm-config';
-import openmrsRootDecorator from '@openmrs/react-root-decorator';
 import { BrowserRouter } from 'react-router-dom';
 import { Provider } from 'unistore/react';
 import { orderBasketStore } from './order-basket-store';
 import OrderBasket from './order-basket/order-basket.component';
 import { switchTo } from '@openmrs/esm-extensions';
-import { useCurrentPatient } from '@openmrs/esm-api';
+import { useCurrentPatient } from '@openmrs/esm-react-utils';
 
 defineConfigSchema('@openmrs/esm-drugorder-app', {});
 
@@ -15,7 +14,7 @@ export interface RootOrderBasketProps {
   closeWorkspace?: () => void;
 }
 
-function RootOrderBasket({ patientUuid, closeWorkspace: closeWorkspace }: RootOrderBasketProps) {
+export default function RootOrderBasket({ patientUuid, closeWorkspace: closeWorkspace }: RootOrderBasketProps) {
   const [, , fallbackPatientUuid] = useCurrentPatient();
   patientUuid = patientUuid ?? fallbackPatientUuid;
   closeWorkspace = closeWorkspace ?? (() => switchTo('link', ''));
@@ -28,8 +27,3 @@ function RootOrderBasket({ patientUuid, closeWorkspace: closeWorkspace }: RootOr
     </BrowserRouter>
   );
 }
-
-export default openmrsRootDecorator({
-  featureName: 'drugorder',
-  moduleName: '@openmrs/esm-drugorder-app',
-})(RootOrderBasket);

src/root-order-basket.tsx

@@ -18,7 +18,7 @@ module.exports = {
     path.resolve(__dirname, "src/index.ts"),
   ],
   output: {
-    filename: 'openmrs-esm-drugorder.js',
+    filename: 'openmrs-esm-drugorder-app.js',
     libraryTarget: 'system',
     path: path.resolve(__dirname, 'dist'),
     jsonpFunction: 'webpackJsonp_openmrs_esm_drugorder',