@openmrs/esm-home-app 4.0.2 → 4.0.3-pre.196

package/src/dashboard/home-dashboard.test.tsx

@@ -11,57 +11,6 @@ function renderHomeDashboard() {
   return renderWithRouter(<HomeDashboard />);
 }
 describe('Home Dashboard', () => {
-  it('renders buttons declared in config', () => {
-    mockedUseConfig.mockReturnValue({
-      buttons: {
-        enabled: true,
-        list: [
-          {
-            label: 'Foo',
-            link: '/some/route',
-          },
-        ],
-      },
-    });
-
-    renderHomeDashboard();
-
-    expect(screen.getByRole('link', { name: /Foo/i })).toBeInTheDocument();
-  });
-
-  it('renders selectively based on privileges', () => {
-    mockedUserHasAccess.mockImplementation((props) => {
-      if (['View Patients', 'Can Foo'].includes(props.privilege)) {
-        return props.children;
-      } else {
-        return null;
-      }
-    });
-
-    mockedUseConfig.mockReturnValueOnce({
-      buttons: {
-        enabled: true,
-        list: [
-          {
-            label: 'Foo',
-            link: 'foo',
-            requiredPrivilege: 'Can Foo',
-          },
-          {
-            label: 'Bar',
-            link: 'bar',
-            requiredPrivilege: 'Can Bar',
-          },
-        ],
-      },
-    });
-
-    renderHomeDashboard();
-
-    expect(screen.getByRole('link', { name: /Foo/i })).toBeInTheDocument();
-    expect(screen.queryByRole('link', { name: /Bar/i })).not.toBeInTheDocument();
-  });
-
   it('should hide OpenMRS logo,when config is set to `false`', () => {
     mockedUseConfig.mockReturnValueOnce({ showOpenMRSLogo: false, buttons: { list: [] } });
     const { container } = renderHomeDashboard();

package/src/dashboard.meta.ts

@@ -0,0 +1,5 @@
+export const homeWidgetDashboardMeta = {
+  name: 'Home',
+  slot: 'home-dashboard-slot',
+  title: '',
+};

package/src/home-page-widgets/home-page-widgets.component.tsx

@@ -0,0 +1,11 @@
+import { ExtensionSlot } from '@openmrs/esm-framework';
+import React from 'react';
+import styles from './home-page-widgets.scss';
+
+interface HomePageWidgetsProps {}
+
+const HomePageWidgets: React.FC<HomePageWidgetsProps> = () => {
+  return <ExtensionSlot className={styles.homePageWidget} extensionSlotName="homepage-widgets-slot" />;
+};
+
+export default HomePageWidgets;

package/src/home-page-widgets/home-page-widgets.scss

@@ -0,0 +1,5 @@
+@use '@carbon/styles/scss/spacing';
+
+.homePageWidget {
+  padding: spacing.$spacing-05;
+}

package/src/index.ts

@@ -1,4 +1,6 @@
-import { registerBreadcrumbs, defineConfigSchema, getAsyncLifecycle } from '@openmrs/esm-framework';
+import { registerBreadcrumbs, defineConfigSchema, getAsyncLifecycle, getSyncLifecycle } from '@openmrs/esm-framework';
+import { createDashboardLink } from './createDashboardLink';
+import { homeWidgetDashboardMeta } from './dashboard.meta';
 import { esmHomeSchema } from './openmrs-esm-home-schema';
 
 declare var __VERSION__: string;
@@ -93,6 +95,28 @@ function setupOpenMRS() {
         online: true,
         offline: false,
       },
+      {
+        id: 'home-sidebar-slot-ext',
+        slot: 'home-sidebar-slot',
+        load: getAsyncLifecycle(() => import('./side-menu/side-menu.component'), options),
+        online: true,
+        offline: true,
+      },
+      {
+        id: 'home-widget-db-link',
+        slot: 'homepage-dashboard-slot',
+        load: getSyncLifecycle(createDashboardLink(homeWidgetDashboardMeta), options),
+        meta: homeWidgetDashboardMeta,
+        online: true,
+        offline: true,
+      },
+      {
+        id: 'home-widget-dashboard',
+        slot: 'home-dashboard-slot',
+        load: getAsyncLifecycle(() => import('./home-page-widgets/home-page-widgets.component'), options),
+        online: true,
+        offline: true,
+      },
     ],
   };
 }

package/src/root.component.tsx

@@ -1,15 +1,27 @@
-import React from 'react';
+import { setLeftNav, unsetLeftNav } from '@openmrs/esm-framework';
+import React, { useEffect } from 'react';
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import HomeDashboard from './dashboard/home-dashboard.component';
 
-const Root: React.FC = () => (
-  <BrowserRouter basename={window.spaBase}>
-    <main className="omrs-main-content">
-      <Routes>
-        <Route path="/home" element={<HomeDashboard />} />
-      </Routes>
-    </main>
-  </BrowserRouter>
-);
+export const spaBasePath = `${window.spaBase}`;
+
+const Root: React.FC = () => {
+  useEffect(() => {
+    setLeftNav({ name: 'homepage-dashboard-slot', basePath: spaBasePath });
+    return () => unsetLeftNav('homepage-dashboard-slot');
+  }, []);
+  return (
+    <BrowserRouter basename={window.spaBase}>
+      <main className="omrs-main-content">
+        <Routes>
+          <Route path="home">
+            <Route index element={<HomeDashboard />} />
+            <Route path=":view" element={<HomeDashboard />} />
+          </Route>
+        </Routes>
+      </main>
+    </BrowserRouter>
+  );
+};
 
 export default Root;

package/src/side-menu/side-menu.component.tsx

@@ -0,0 +1,7 @@
+import React from 'react';
+import { LeftNavMenu } from '@openmrs/esm-framework';
+import styles from './side-menu.scss';
+
+const SideMenu = () => <LeftNavMenu className={styles.sideMenu} isFixedNav expanded isChildOfHeader={true} />;
+
+export default SideMenu;

package/src/side-menu/side-menu.scss

@@ -0,0 +1,7 @@
+@use '@carbon/colors';
+@use '@carbon/styles/scss/spacing';
+
+.sideMenu {
+  padding-top: spacing.$spacing-05;
+  border-right: 1px solid colors.$cool-gray-10;
+}

package/src/types/index.ts

@@ -0,0 +1,5 @@
+export interface DashboardConfig {
+  name: string;
+  slot: string;
+  title: string;
+}

package/dist/347.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_openmrs_esm_home_app=self.webpackChunk_openmrs_esm_home_app||[]).push([[347],{49:(e,n,t)=>{t.d(n,{Z:()=>i});var a=t(601),o=t.n(a),r=t(609),s=t.n(r)()(o());s.push([e.id,"/* Variables defined in home-dashboard.component.css */\n\n.-esm-home__dashboard-button__link___a89I_ {\n  height: 7rem;\n  width: var(--dashboard-button-width);\n  margin: var(--dashboard-button-margin);\n  justify-content: center;\n}\n\n.-esm-home__dashboard-button__textContainer___g1M9g {\n  display: inline-flex;\n  min-width: 0;\n  white-space: normal;\n  line-height: 1.5;\n}\n",""]),s.locals={link:"-esm-home__dashboard-button__link___a89I_",textContainer:"-esm-home__dashboard-button__textContainer___g1M9g"};const i=s},383:(e,n,t)=>{t.d(n,{Z:()=>i});var a=t(601),o=t.n(a),r=t(609),s=t.n(r)()(o());s.push([e.id,":root {\n  --dashboard-button-width: 10rem;\n  --dashboard-button-margin: 0.25rem;\n}\n\n.-esm-home__home-dashboard__homeDashboard___fxD3u {\n  display: flex;\n  justify-content: center;\n  margin: 0 auto;\n}\n\n.omrs-breakpoint-gt-phone .-esm-home__home-dashboard__homeDashboard___fxD3u {\n  height: calc(100vh - var(--omrs-topnav-height) - 10rem);\n}\n\n.-esm-home__home-dashboard__mainSection___JfWoi {\n  min-height: 1vh;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  align-content: flex-start;\n  flex-grow: 1;\n}\n\n.-esm-home__home-dashboard__searchLinkArea___W2wl7 {\n  display: flex;\n  flex-basis: 100%;\n  justify-content: center;\n  margin: 2rem auto;\n}\n\n.-esm-home__home-dashboard__buttonArea___fK5dM > div {\n  min-height: 1vh;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: left;\n  align-items: center;\n  flex-grow: 1;\n}\n\n.-esm-home__home-dashboard__label___NEMEO {\n  color: var(--omrs-color-interaction);\n  margin-left: 0.25rem;\n  text-align: center;\n}\n\n.-esm-home__home-dashboard__logoSection___qqnVq {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n}\n\n.-esm-home__home-dashboard__break___KIoe2 {\n  height: 0;\n  flex-basis: 100%;\n}\n\n.omrs-breakpoint-lt-tablet .-esm-home__home-dashboard__dashboardLink___xeBLc {\n  width: 80%;\n}\n\n.omrs-breakpoint-gt-phone .-esm-home__home-dashboard__dashboardLink___xeBLc {\n  width: 22rem;\n}\n\n.omrs-breakpoint-lt-tablet .-esm-home__home-dashboard__buttonArea___fK5dM {\n  max-width: calc(\n    var(--dashboard-button-width) * 2 + var(--dashboard-button-margin) * 4\n  );\n}\n\n.omrs-breakpoint-gt-phone .-esm-home__home-dashboard__buttonArea___fK5dM {\n  max-width: calc(\n    var(--dashboard-button-width) * 3 + var(--dashboard-button-margin) * 6\n  );\n}\n\n.omrs-breakpoint-gt-tablet .-esm-home__home-dashboard__buttonArea___fK5dM {\n  max-width: calc(\n    var(--dashboard-button-width) * 4 + var(--dashboard-button-margin) * 8\n  );\n}\n\n.-esm-home__home-dashboard__homeButton___ETeeR a {\n  height: 7rem;\n  width: var(--dashboard-button-width);\n  margin: var(--dashboard-button-margin);\n  justify-content: center;\n  white-space: normal;\n}\n\n.-esm-home__home-dashboard__widgetsArea___t0cZt {\n  margin-top: 2rem;\n  padding: 0 1rem;\n  width: 100%;\n}",""]),s.locals={homeDashboard:"-esm-home__home-dashboard__homeDashboard___fxD3u",mainSection:"-esm-home__home-dashboard__mainSection___JfWoi",searchLinkArea:"-esm-home__home-dashboard__searchLinkArea___W2wl7",buttonArea:"-esm-home__home-dashboard__buttonArea___fK5dM",label:"-esm-home__home-dashboard__label___NEMEO",logoSection:"-esm-home__home-dashboard__logoSection___qqnVq",break:"-esm-home__home-dashboard__break___KIoe2",dashboardLink:"-esm-home__home-dashboard__dashboardLink___xeBLc",homeButton:"-esm-home__home-dashboard__homeButton___ETeeR",widgetsArea:"-esm-home__home-dashboard__widgetsArea___t0cZt"};const i=s},609:e=>{e.exports=function(e){var n=[];return n.toString=function(){return this.map((function(n){var t="",a=void 0!==n[5];return n[4]&&(t+="@supports (".concat(n[4],") {")),n[2]&&(t+="@media ".concat(n[2]," {")),a&&(t+="@layer".concat(n[5].length>0?" ".concat(n[5]):""," {")),t+=e(n),a&&(t+="}"),n[2]&&(t+="}"),n[4]&&(t+="}"),t})).join("")},n.i=function(e,t,a,o,r){"string"==typeof e&&(e=[[null,e,void 0]]);var s={};if(a)for(var i=0;i<this.length;i++){var m=this[i][0];null!=m&&(s[m]=!0)}for(var _=0;_<e.length;_++){var d=[].concat(e[_]);a&&s[d[0]]||(void 0!==r&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=r),t&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=t):d[2]=t),o&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=o):d[4]="".concat(o)),n.push(d))}},n}},601:e=>{e.exports=function(e){return e[1]}},354:e=>{var n=[];function t(e){for(var t=-1,a=0;a<n.length;a++)if(n[a].identifier===e){t=a;break}return t}function a(e,a){for(var r={},s=[],i=0;i<e.length;i++){var m=e[i],_=a.base?m[0]+a.base:m[0],d=r[_]||0,h="".concat(_," ").concat(d);r[_]=d+1;var l=t(h),c={css:m[1],media:m[2],sourceMap:m[3],supports:m[4],layer:m[5]};if(-1!==l)n[l].references++,n[l].updater(c);else{var u=o(c,a);a.byIndex=i,n.splice(i,0,{identifier:h,updater:u,references:1})}s.push(h)}return s}function o(e,n){var t=n.domAPI(n);return t.update(e),function(n){if(n){if(n.css===e.css&&n.media===e.media&&n.sourceMap===e.sourceMap&&n.supports===e.supports&&n.layer===e.layer)return;t.update(e=n)}else t.remove()}}e.exports=function(e,o){var r=a(e=e||[],o=o||{});return function(e){e=e||[];for(var s=0;s<r.length;s++){var i=t(r[s]);n[i].references--}for(var m=a(e,o),_=0;_<r.length;_++){var d=t(r[_]);0===n[d].references&&(n[d].updater(),n.splice(d,1))}r=m}}},378:e=>{var n={};e.exports=function(e,t){var a=function(e){if(void 0===n[e]){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}n[e]=t}return n[e]}(e);if(!a)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");a.appendChild(t)}},154:e=>{e.exports=function(e){var n=document.createElement("style");return e.setAttributes(n,e.attributes),e.insert(n,e.options),n}},993:(e,n,t)=>{e.exports=function(e){var n=t.nc;n&&e.setAttribute("nonce",n)}},583:e=>{e.exports=function(e){var n=e.insertStyleElement(e);return{update:function(t){!function(e,n,t){var a="";t.supports&&(a+="@supports (".concat(t.supports,") {")),t.media&&(a+="@media ".concat(t.media," {"));var o=void 0!==t.layer;o&&(a+="@layer".concat(t.layer.length>0?" ".concat(t.layer):""," {")),a+=t.css,o&&(a+="}"),t.media&&(a+="}"),t.supports&&(a+="}");var r=t.sourceMap;r&&"undefined"!=typeof btoa&&(a+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(r))))," */")),n.styleTagTransform(a,e,n.options)}(n,e,t)},remove:function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(n)}}}},141:e=>{e.exports=function(e,n){if(n.styleSheet)n.styleSheet.cssText=e;else{for(;n.firstChild;)n.removeChild(n.firstChild);n.appendChild(document.createTextNode(e))}}},347:(e,n,t)=>{t.r(n),t.d(n,{default:()=>N});var a=t(268),o=t.n(a),r=t(744),s=t(906),i=t(354),m=t.n(i),_=t(583),d=t.n(_),h=t(378),l=t.n(h),c=t(993),u=t.n(c),b=t(154),p=t.n(b),f=t(141),v=t.n(f),g=t(49),x={};x.styleTagTransform=v(),x.setAttributes=u(),x.insert=l().bind(null,"head"),x.domAPI=d(),x.insertStyleElement=p(),m()(g.Z,x);const w=g.Z&&g.Z.locals?g.Z.locals:void 0;function y(e){var n="omrs-link omrs-filled-neutral ".concat(w.link),t=o().createElement("div",{className:w.textContainer},e.label),a=o().createElement(s.ConfigurableLink,{className:n,to:e.link},t);return e.requiredPrivilege?o().createElement(s.UserHasAccess,{privilege:e.requiredPrivilege},a):a}var E=t(383),k={};k.styleTagTransform=v(),k.setAttributes=u(),k.insert=l().bind(null,"head"),k.domAPI=d(),k.insertStyleElement=p(),m()(E.Z,k);const A=E.Z&&E.Z.locals?E.Z.locals:void 0;function S(){return S=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},S.apply(this,arguments)}function M(){var e=(0,s.useConfig)();return o().createElement(o().Fragment,null,o().createElement("div",{className:A.homeDashboard},o().createElement("section",{className:A.mainSection},o().createElement("div",{className:A.buttonArea},o().createElement(s.ExtensionSlot,{extensionSlotName:"homepage-dashboard-slot"},o().createElement("div",{className:A.homeButton},o().createElement(s.Extension,null))),e.buttons.list.map((function(e){return o().createElement(y,S({},e,{key:e.label}))}))),o().createElement("div",{className:A.widgetsArea},o().createElement(s.ExtensionSlot,{extensionSlotName:"homepage-widgets-slot"})))),e.showOpenMRSLogo&&o().createElement("section",{className:A.logoSection},o().createElement("svg",null,o().createElement("use",{xlinkHref:"#omrs-logo-full-mono"}))))}const N=function(){return o().createElement(r.BrowserRouter,{basename:window.spaBase},o().createElement("main",{className:"omrs-main-content"},o().createElement(r.Routes,null,o().createElement(r.Route,{path:"/home",element:o().createElement(M,null)}))))}}}]);

package/dist/928.js

@@ -1 +0,0 @@
-(self.webpackChunk_openmrs_esm_home_app=self.webpackChunk_openmrs_esm_home_app||[]).push([[928],{928:(e,n,i)=>{"use strict";i.r(n),i.d(n,{backendDependencies:()=>r,importTranslation:()=>l,setupOpenMRS:()=>s,version:()=>a});var t=i(906),o={buttons:{enabled:{_type:t.Type.Boolean,_default:!0,_description:"Whether to show big buttons on the home page (including extensions)"},list:{_type:t.Type.Array,_elements:{label:{_type:t.Type.String},link:{_type:t.Type.String,_validators:[t.validators.isUrl]},requiredPrivilege:{_type:t.Type.String},spa:{_type:t.Type.Boolean,_default:!1}},_default:[],_description:"Custom buttons to add, which will come after the button extensions"}},search:{patientResultUrl:{_type:t.Type.String,_default:"${openmrsSpaBase}/patient/${patientUuid}/chart",_description:"Where clicking a patient result takes the user. Accepts template parameter ${patientUuid}",_validators:[t.validators.isUrlWithTemplateParameters(["patientUuid"])]}},showOpenMRSLogo:{_type:t.Type.Boolean,_description:"Whether to display OpenMRS logo on home dashboard",_default:!0}},a="4.0.2",r={"webservices.rest":"^2.24.0"},l=i(979);function s(){var e="@openmrs/esm-home-app",n="home",a={featureName:n,moduleName:e};return(0,t.defineConfigSchema)(e,o),(0,t.registerBreadcrumbs)([{path:"".concat(window.spaBase,"/").concat(n),title:"Home"}]),{pages:[{load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(347)]).then(i.bind(i,347))}),a),route:n,online:{canSearch:!0},offline:{canSearch:!1}}],extensions:[{id:"active-visits-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(631)]).then(i.bind(i,631))}),a),privilege:"App: coreapps.activeVisits",online:!0,offline:!0},{id:"capture-vitals-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(444)]).then(i.bind(i,106))}),a),privilege:"App: referenceapplication.vitals",online:!0,offline:!1},{id:"appointment-scheduling-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(572)]).then(i.bind(i,572))}),a),privilege:"App: appointmentschedulingui.home",online:!0,offline:!1},{id:"reports-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(423)]).then(i.bind(i,423))}),a),privilege:"View Reports",online:!0,offline:!1},{id:"data-management-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(787)]).then(i.bind(i,787))}),a),privilege:"App: coreapps.dataManagement",online:!0,offline:!1},{id:"configure-metadata-link",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(193)]).then(i.bind(i,193))}),a),privilege:"App: coreapps.configuremetadata",online:!0,offline:!1},{id:"system-administration-link",slot:"app-menu-slot",load:(0,t.getAsyncLifecycle)((function(){return Promise.all([i.e(268),i.e(924),i.e(81)]).then(i.bind(i,81))}),a),privilege:"App: coreapps.systemAdministration",online:!0,offline:!1}]}}},979:(e,n,i)=>{var t={"./en.json":[574,574],"./es.json":[319,319],"./fr.json":[757,757]};function o(e){if(!i.o(t,e))return Promise.resolve().then((()=>{var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}));var n=t[e],o=n[0];return i.e(n[1]).then((()=>i(o)))}o.keys=()=>Object.keys(t),o.id=979,e.exports=o}}]);

package/src/dashboard/home-dashboard.css

@@ -1,97 +0,0 @@
-:root {
-  --dashboard-button-width: 10rem;
-  --dashboard-button-margin: 0.25rem;
-}
-
-.homeDashboard {
-  display: flex;
-  justify-content: center;
-  margin: 0 auto;
-}
-
-:global(.omrs-breakpoint-gt-phone) .homeDashboard {
-  height: calc(100vh - var(--omrs-topnav-height) - 10rem);
-}
-
-.mainSection {
-  min-height: 1vh;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  align-content: flex-start;
-  flex-grow: 1;
-}
-
-.searchLinkArea {
-  display: flex;
-  flex-basis: 100%;
-  justify-content: center;
-  margin: 2rem auto;
-}
-
-.buttonArea > div {
-  min-height: 1vh;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: left;
-  align-items: center;
-  flex-grow: 1;
-}
-
-.label {
-  color: var(--omrs-color-interaction);
-  margin-left: 0.25rem;
-  text-align: center;
-}
-
-.logoSection {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-}
-
-.break {
-  height: 0;
-  flex-basis: 100%;
-}
-
-:global(.omrs-breakpoint-lt-tablet) .dashboardLink {
-  width: 80%;
-}
-
-:global(.omrs-breakpoint-gt-phone) .dashboardLink {
-  width: 22rem;
-}
-
-:global(.omrs-breakpoint-lt-tablet) .buttonArea {
-  max-width: calc(
-    var(--dashboard-button-width) * 2 + var(--dashboard-button-margin) * 4
-  );
-}
-
-:global(.omrs-breakpoint-gt-phone) .buttonArea {
-  max-width: calc(
-    var(--dashboard-button-width) * 3 + var(--dashboard-button-margin) * 6
-  );
-}
-
-:global(.omrs-breakpoint-gt-tablet) .buttonArea {
-  max-width: calc(
-    var(--dashboard-button-width) * 4 + var(--dashboard-button-margin) * 8
-  );
-}
-
-.homeButton a {
-  height: 7rem;
-  width: var(--dashboard-button-width);
-  margin: var(--dashboard-button-margin);
-  justify-content: center;
-  white-space: normal;
-}
-
-.widgetsArea {
-  margin-top: 2rem;
-  padding: 0 1rem;
-  width: 100%;
-}