(BREAKING) Retire concept of ConnectedExtension (#1154)

packages/apps/esm-help-menu-app/src/help-menu/help-popup.component.tsx

@@ -1,6 +1,6 @@
-import React, { useState } from 'react';
-import styles from './help-popup.styles.scss';
+import React from 'react';
 import { ExtensionSlot } from '@openmrs/esm-framework';
+import styles from './help-popup.styles.scss';
 
 export default function HelpMenuPopup() {
   return (

packages/apps/esm-help-menu-app/src/help-menu/help.component.tsx

@@ -1,8 +1,8 @@
 import React, { useState, useEffect, useRef } from 'react';
 import classNames from 'classnames';
+import { Help } from '@carbon/react/icons';
 import HelpMenuPopup from './help-popup.component';
 import styles from './help.styles.scss';
-import { Help } from '@carbon/react/icons';
 
 export default function HelpMenu() {
   const [helpMenuOpen, setHelpMenuOpen] = useState(false);
@@ -14,7 +14,7 @@ export default function HelpMenu() {
   };
 
   useEffect(() => {
-    const handleClickOutside = (event) => {
+    const handleClickOutside = (event: MouseEvent) => {
       if (
         helpMenuButtonRef.current &&
         !helpMenuButtonRef.current.contains(event.target) &&
@@ -24,12 +24,14 @@ export default function HelpMenu() {
         setHelpMenuOpen(false);
       }
     };
-    document.addEventListener('click', handleClickOutside);
 
+    window.addEventListener(`mousedown`, handleClickOutside);
+    window.addEventListener(`touchstart`, handleClickOutside);
     return () => {
-      document.removeEventListener('click', handleClickOutside);
+      window.removeEventListener(`mousedown`, handleClickOutside);
+      window.removeEventListener(`touchstart`, handleClickOutside);
     };
-  }, [helpMenuOpen]);
+  }, []);
 
   return (
     <>

packages/apps/esm-help-menu-app/src/root.component.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import Root from './root.component';
 import { render } from '@testing-library/react';
+import Root from './root.component';
 
 describe(`<Root />`, () => {
   it(`renders without dying`, () => {

packages/apps/esm-implementer-tools-app/jest.config.js

@@ -7,7 +7,8 @@ module.exports = {
   },
   setupFilesAfterEnv: ['<rootDir>/setup-tests.ts'],
   moduleNameMapper: {
-    'lodash-es': 'lodash',
+    '^lodash-es$': 'lodash',
+    '^lodash-es/(.*)$': 'lodash/$1',
     '\\.(s?css)$': 'identity-obj-proxy',
     '@openmrs/esm-framework': '@openmrs/esm-framework/mock.tsx',
     dexie: require.resolve('dexie'),

packages/apps/esm-implementer-tools-app/src/configuration/configuration.test.tsx

@@ -9,7 +9,6 @@ import { useConceptLookup, useGetConceptByUuid } from './interactive-editor/valu
 const mockUseConceptLookup = useConceptLookup as jest.Mock;
 const mockUseGetConceptByUuid = useGetConceptByUuid as jest.Mock;
 
-jest.mock('lodash-es/debounce', () => jest.fn((fn) => fn));
 jest.mock('./interactive-editor/value-editors/concept-search.resource', () => ({
   useConceptLookup: jest.fn().mockImplementation(() => ({
     concepts: [],

packages/apps/esm-offline-tools-app/jest.config.js

@@ -3,6 +3,8 @@ module.exports = {
     '^.+\\.tsx?$': ['@swc/jest'],
   },
   moduleNameMapper: {
+    '^lodash-es$': 'lodash',
+    '^lodash-es/(.*)$': 'lodash/$1',
     '\\.(s?css)$': 'identity-obj-proxy',
   },
   setupFiles: ['<rootDir>/src/setup-tests.js'],

packages/apps/esm-primary-navigation-app/src/components/navbar/navbar.component.tsx

@@ -8,7 +8,7 @@ import {
   ExtensionSlot,
   ConfigurableLink,
   useSession,
-  useConnectedExtensions,
+  useAssignedExtensions,
   useConfig,
   CloseIcon,
   UserAvatarIcon,
@@ -28,9 +28,9 @@ const HeaderItems: React.FC = () => {
   const config = useConfig();
   const [activeHeaderPanel, setActiveHeaderPanel] = useState<string>(null);
   const layout = useLayoutType();
-  const navMenuItems = useConnectedExtensions('patient-chart-dashboard-slot').map((e) => e.id);
-  const appMenuItems = useConnectedExtensions('app-menu-slot');
-  const userMenuItems = useConnectedExtensions('user-panel-slot');
+  const navMenuItems = useAssignedExtensions('patient-chart-dashboard-slot').map((e) => e.id);
+  const appMenuItems = useAssignedExtensions('app-menu-slot');
+  const userMenuItems = useAssignedExtensions('user-panel-slot');
   const isActivePanel = useCallback((panelName: string) => activeHeaderPanel === panelName, [activeHeaderPanel]);
 
   const togglePanel = useCallback((panelName: string) => {

packages/apps/esm-primary-navigation-app/src/root.component.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { of } from 'rxjs';
 import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { useConfig, useConnectedExtensions, useSession } from '@openmrs/esm-framework';
+import { useConfig, useAssignedExtensions, useSession } from '@openmrs/esm-framework';
 import { isDesktop } from './utils';
 import { mockUser } from '../__mocks__/mock-user';
 import { mockSession } from '../__mocks__/mock-session';
@@ -13,13 +13,13 @@ const mockSessionObservable = of({ data: mockSession });
 const mockIsDesktop = jest.mocked(isDesktop);
 
 const mockedUseConfig = useConfig as jest.Mock;
-const mockedUseConnectedExtensions = useConnectedExtensions as jest.Mock;
+const mockedUseAssignedExtensions = useAssignedExtensions as jest.Mock;
 const mockedUseSession = useSession as jest.Mock;
 
 mockedUseConfig.mockReturnValue({
   logo: { src: null, alt: null, name: 'Mock EMR', link: 'Mock EMR' },
 });
-mockedUseConnectedExtensions.mockReturnValue(['mock-extension']);
+mockedUseAssignedExtensions.mockReturnValue(['mock-extension']);
 mockedUseSession.mockReturnValue(mockSession);
 
 jest.mock('./root.resource', () => ({

packages/framework/esm-api/src/openmrs-fetch.ts

@@ -1,6 +1,6 @@
 /** @module @category API */
 import { Observable } from 'rxjs';
-import isPlainObject from 'lodash-es/isPlainObject';
+import { isPlainObject } from 'lodash-es';
 import { getConfig } from '@openmrs/esm-config';
 import { navigate } from '@openmrs/esm-navigation';
 import { clearHistory } from '@openmrs/esm-navigation/src/index';

packages/framework/esm-api/src/public.ts

@@ -1,8 +1,21 @@
 export * from './types';
 export * from './openmrs-fetch';
 export * from './attachments';
-
-export * from './shared-api-objects/current-user';
+export {
+  clearCurrentUser,
+  getCurrentUser,
+  getLoggedInUser,
+  getSessionStore,
+  getSessionLocation,
+  refetchCurrentUser,
+  setSessionLocation,
+  setUserLanguage,
+  setUserProperties,
+  userHasAccess,
+  type LoadedSessionStore,
+  type SessionStore,
+  type UnloadedSessionStore,
+} from './shared-api-objects/current-user';
 export * from './shared-api-objects/current-patient';
 export * from './shared-api-objects/visit-utils';
 export * from './shared-api-objects/visit-type';

packages/framework/esm-api/src/shared-api-objects/current-user.ts

@@ -1,7 +1,7 @@
 /** @module @category API */
 import { reportError } from '@openmrs/esm-error-handling';
 import { createGlobalStore } from '@openmrs/esm-state';
-import isUndefined from 'lodash-es/isUndefined';
+import { isUndefined } from 'lodash-es';
 import { Observable } from 'rxjs';
 import { openmrsFetch, restBaseUrl, sessionEndpoint } from '../openmrs-fetch';
 import type { LoggedInUser, SessionLocation, Privilege, Role, Session, FetchResponse } from '../types';
@@ -18,7 +18,8 @@ export type UnloadedSessionStore = {
   session: null;
 };
 
-const sessionStore = createGlobalStore<SessionStore>('session', {
+/** @internal */
+export const sessionStore = createGlobalStore<SessionStore>('session', {
   loaded: false,
   session: null,
 });

packages/framework/esm-config/jest.config.js

@@ -4,6 +4,7 @@ module.exports = {
   },
   setupFiles: ['<rootDir>/src/setup-tests.js'],
   moduleNameMapper: {
+    '^lodash-es$': 'lodash',
     '@openmrs/esm-context': '<rootDir>/__mocks__/openmrs-esm-context.mock.tsx',
     '@openmrs/esm-globals': '<rootDir>/__mocks__/openmrs-esm-globals.mock.tsx',
     '@openmrs/esm-state': '@openmrs/esm-state/mock',

packages/framework/esm-extensions/src/extensions.test.ts

@@ -1,13 +1,11 @@
 import { createGlobalStore } from '@openmrs/esm-state';
 import { attach, registerExtensionSlot } from './extensions';
 
-const mockSessionStore = createGlobalStore('mock-session-store', {
-  loaded: false,
-  session: null,
-});
-
 jest.mock('@openmrs/esm-api', () => ({
-  getSessionStore: jest.fn(() => mockSessionStore),
+  sessionStore: createGlobalStore('mock-session-store', {
+    loaded: false,
+    session: null,
+  }),
 }));
 
 describe('extensions system', () => {