feat: support plugin wrappers [LIBS-397] (#823)

* feat: plugin wrapper handling [LIBS-397] --------- Co-authored-by: Kai Vandivier <[email protected]>
dhis2 · Jan 4, 2024 · f779e13 · f779e13
1 parent d696ab2
commit f779e13
Show file tree

Hide file tree

Showing 19 changed files with 609 additions and 1,064 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,17 +1,56 @@
+# [10.4.0-alpha.6](https://github.com/dhis2/app-platform/compare/v10.4.0-alpha.5...v10.4.0-alpha.6) (2023-12-21)
+
+
+### Bug Fixes
+
+* don't open browser for plugins on start [LIBS-503] ([#821](https://github.com/dhis2/app-platform/issues/821)) ([7db7a69](https://github.com/dhis2/app-platform/commit/7db7a69b55d88f681e14e49d4b774e75d7289776))
+* update alpha ([e66a8ea](https://github.com/dhis2/app-platform/commit/e66a8ea62c7b30c929f7b5cebab08df3fa4cbf62))
+* update alpha [skip release] ([ec772f6](https://github.com/dhis2/app-platform/commit/ec772f655f3160446ab74f523e147d3e129b94a9))
+
 ## [10.3.11](https://github.com/dhis2/app-platform/compare/v10.3.10...v10.3.11) (2023-12-11)
 
 
 ### Bug Fixes
 
 * don't open browser for plugins on start [LIBS-503] ([#821](https://github.com/dhis2/app-platform/issues/821)) ([7db7a69](https://github.com/dhis2/app-platform/commit/7db7a69b55d88f681e14e49d4b774e75d7289776))
 
-## [10.3.10](https://github.com/dhis2/app-platform/compare/v10.3.9...v10.3.10) (2023-08-21)
+# [10.4.0-alpha.5](https://github.com/dhis2/app-platform/compare/v10.4.0-alpha.4...v10.4.0-alpha.5) (2023-09-28)
+
+
+### Bug Fixes
+
+* auto width adjustment ([a80ea56](https://github.com/dhis2/app-platform/commit/a80ea56f1cd887e3458af8b6995f3136017fa9c2))
+* clean up dependencies ([9863ae0](https://github.com/dhis2/app-platform/commit/9863ae09c72b65e11ce69ba03034ecd2737dacb3))
+* use useRef for previous width ([f6c07cf](https://github.com/dhis2/app-platform/commit/f6c07cf222254379c5e7574087a9364507e9cdd1))
+
+
+### Features
+
+* auto resizing for height ([74bbe00](https://github.com/dhis2/app-platform/commit/74bbe00c0f64364b96b2b5b4fb68830b1d91a016))
+
+# [10.4.0-alpha.4](https://github.com/dhis2/app-platform/compare/v10.4.0-alpha.3...v10.4.0-alpha.4) (2023-08-22)
 
 
 ### Bug Fixes
 
 * support yarn.lock discovery on non-unix ([#811](https://github.com/dhis2/app-platform/issues/811)) ([22a6863](https://github.com/dhis2/app-platform/commit/22a6863c1b4a5d9c6c026c502a1b77dded318be7))
 
+# [10.4.0-alpha.3](https://github.com/dhis2/app-platform/compare/v10.4.0-alpha.2...v10.4.0-alpha.3) (2023-08-10)
+
+
+### Bug Fixes
+
+* support yarn.lock discovery on non-unix ([#811](https://github.com/dhis2/app-platform/issues/811)) ([22a6863](https://github.com/dhis2/app-platform/commit/22a6863c1b4a5d9c6c026c502a1b77dded318be7))
+* move precache route to reenable navigation handler on login redirects [LIBS-473] ([#809](https://github.com/dhis2/app-platform/issues/809)) ([1ff29b6](https://github.com/dhis2/app-platform/commit/1ff29b645ec07e0bcce76efedbc08f1b76014a42))
+* **pwa:** avoid crashing when SW is not available [LIBS-499] ([#807](https://github.com/dhis2/app-platform/issues/807)) ([b681022](https://github.com/dhis2/app-platform/commit/b68102248fad98303dd2c01d954f4430b1934a25))
+* omit `moment-locales` from precache ([#806](https://github.com/dhis2/app-platform/issues/806)) ([c8d5494](https://github.com/dhis2/app-platform/commit/c8d5494c5eaf6a2f021166d208a1cc289701a47a))
+* **cli:** fix envs to fix plugins in dev ([#799](https://github.com/dhis2/app-platform/issues/799)) ([ba29cea](https://github.com/dhis2/app-platform/commit/ba29ceacfe5a25d42a406f80a9896ccbc7bc82f8))
+* **plugins:** omit launch paths when unused [LIBS-477] ([#791](https://github.com/dhis2/app-platform/issues/791)) ([e49a51f](https://github.com/dhis2/app-platform/commit/e49a51fec39a323350c71d4e09caff836aab2262))
+* **pwa:** bump ui version for headerbar connection status [LIBS-315] ([#797](https://github.com/dhis2/app-platform/issues/797)) ([61ff0a4](https://github.com/dhis2/app-platform/commit/61ff0a49e63189d892403db8df24c57e170dac0a))
+* make loading placeholders transparent ([#795](https://github.com/dhis2/app-platform/issues/795)) ([6e64756](https://github.com/dhis2/app-platform/commit/6e64756325b366b413acbdce8dd0d6b70632d118))
+* **plugins:** inject precache manifest correctly ([#792](https://github.com/dhis2/app-platform/issues/792)) ([c0d172e](https://github.com/dhis2/app-platform/commit/c0d172ec362182ce978e43b16e9c411ec61e5039))
+* **pwa:** add config option to omit files from precache [LIBS-482] ([#793](https://github.com/dhis2/app-platform/issues/793)) ([d089dda](https://github.com/dhis2/app-platform/commit/d089dda25433ca52f84c42c9369fce95419e4f83))
+
 ## [10.3.9](https://github.com/dhis2/app-platform/compare/v10.3.8...v10.3.9) (2023-05-16)
 
 

diff --git a/adapter/i18n/en.pot b/adapter/i18n/en.pot
@@ -5,8 +5,8 @@ msgstr ""
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2022-09-22T19:11:17.660Z\n"
-"PO-Revision-Date: 2022-09-22T19:11:17.660Z\n"
+"POT-Creation-Date: 2023-02-08T14:36:41.461Z\n"
+"PO-Revision-Date: 2023-02-08T14:36:41.461Z\n"
 
 msgid "Save your data"
 msgstr "Save your data"
@@ -39,12 +39,12 @@ msgstr "An error occurred in the DHIS2 application."
 msgid "Technical details copied to clipboard"
 msgstr "Technical details copied to clipboard"
 
-msgid "Something went wrong"
-msgstr "Something went wrong"
-
 msgid "Try again"
 msgstr "Try again"
 
+msgid "Something went wrong"
+msgstr "Something went wrong"
+
 msgid "Hide technical details"
 msgstr "Hide technical details"
 

diff --git a/adapter/package.json b/adapter/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@dhis2/app-adapter",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "repository": {
         "type": "git",
         "url": "https://github.com/amcgee/dhis2-app-platform",
@@ -21,11 +21,11 @@
         "build"
     ],
     "dependencies": {
-        "@dhis2/pwa": "10.3.11",
+        "@dhis2/pwa": "10.4.0-alpha.6",
         "moment": "^2.24.0"
     },
     "devDependencies": {
-        "@dhis2/cli-app-scripts": "10.3.11",
+        "@dhis2/cli-app-scripts": "10.4.0-alpha.6",
         "@testing-library/react": "^12.0.0",
         "enzyme": "^3.11.0",
         "enzyme-adapter-react-16": "^1.15.5",
@@ -37,7 +37,7 @@
         "test": "d2-app-scripts test"
     },
     "peerDependencies": {
-        "@dhis2/app-runtime": "^3.5",
+        "@dhis2/app-runtime": "^3.10.0-alpha.2",
         "@dhis2/d2-i18n": "^1",
         "@dhis2/ui": ">=8.5",
         "classnames": "^2",

diff --git a/adapter/src/components/AppWrapper.js b/adapter/src/components/AppWrapper.js
@@ -8,18 +8,39 @@ import { ErrorBoundary } from './ErrorBoundary.js'
 import { LoadingMask } from './LoadingMask.js'
 import { styles } from './styles/AppWrapper.style.js'
 
-export const AppWrapper = ({ children, plugin }) => {
+const AppWrapper = ({ children, plugin, onPluginError, clearPluginError }) => {
     const { loading: localeLoading } = useCurrentUserLocale()
     const { loading: latestUserLoading } = useVerifyLatestUser()
 
     if (localeLoading || latestUserLoading) {
         return <LoadingMask />
     }
 
+    if (plugin) {
+        return (
+            <div className="app-shell-adapter">
+                <style jsx>{styles}</style>
+                <div className="app-shell-app">
+                    <ErrorBoundary
+                        plugin={true}
+                        onPluginError={onPluginError}
+                        onRetry={() => {
+                            clearPluginError()
+                            window.location.reload()
+                        }}
+                    >
+                        {children}
+                    </ErrorBoundary>
+                </div>
+                <Alerts />
+            </div>
+        )
+    }
+
     return (
         <div className="app-shell-adapter">
             <style jsx>{styles}</style>
-            {!plugin && <ConnectedHeaderBar />}
+            <ConnectedHeaderBar />
             <div className="app-shell-app">
                 <ErrorBoundary onRetry={() => window.location.reload()}>
                     {children}
@@ -32,5 +53,9 @@ export const AppWrapper = ({ children, plugin }) => {
 
 AppWrapper.propTypes = {
     children: PropTypes.node,
+    clearPluginError: PropTypes.func,
     plugin: PropTypes.bool,
+    onPluginError: PropTypes.func,
 }
+
+export { AppWrapper }
diff --git a/adapter/src/components/ErrorBoundary.js b/adapter/src/components/ErrorBoundary.js
@@ -36,6 +36,12 @@ export class ErrorBoundary extends Component {
     }
 
     componentDidCatch(error, errorInfo) {
+        if (this.props.plugin) {
+            if (this.props.onPluginError) {
+                console.error(error)
+                this.props.onPluginError(error)
+            }
+        }
         this.setState({
             error,
             errorInfo,
@@ -58,6 +64,23 @@ export class ErrorBoundary extends Component {
     render() {
         const { children, fullscreen, onRetry } = this.props
         if (this.state.error) {
+            if (this.props.plugin) {
+                return (
+                    <>
+                        <style jsx>{styles}</style>
+                        <div className="pluginBoundary">
+                            <span>I am the default plugin boundary</span>
+                            {onRetry && (
+                                <div className="retry">
+                                    <UIButton onClick={onRetry}>
+                                        {i18n.t('Try again')}
+                                    </UIButton>
+                                </div>
+                            )}
+                        </div>
+                    </>
+                )
+            }
             return (
                 <div className={cx('mask', { fullscreen })}>
                     <style jsx>{styles}</style>
@@ -119,5 +142,7 @@ export class ErrorBoundary extends Component {
 ErrorBoundary.propTypes = {
     children: PropTypes.node.isRequired,
     fullscreen: PropTypes.bool,
+    plugin: PropTypes.bool,
+    onPluginError: PropTypes.func,
     onRetry: PropTypes.func,
 }
diff --git a/adapter/src/components/ServerVersionProvider.js b/adapter/src/components/ServerVersionProvider.js
@@ -14,6 +14,9 @@ export const ServerVersionProvider = ({
     url, // url from env vars
     apiVersion,
     pwaEnabled,
+    plugin,
+    parentAlertsAdd,
+    showAlertsInPlugin,
     children,
 }) => {
     const offlineInterface = useOfflineInterface()
@@ -160,6 +163,9 @@ export const ServerVersionProvider = ({
                 pwaEnabled,
             }}
             offlineInterface={offlineInterface}
+            plugin={plugin}
+            parentAlertsAdd={parentAlertsAdd}
+            showAlertsInPlugin={showAlertsInPlugin}
         >
             {children}
         </Provider>
@@ -171,6 +177,9 @@ ServerVersionProvider.propTypes = {
     appVersion: PropTypes.string.isRequired,
     apiVersion: PropTypes.number,
     children: PropTypes.element,
+    parentAlertsAdd: PropTypes.func,
+    plugin: PropTypes.bool,
     pwaEnabled: PropTypes.bool,
+    showAlertsInPlugin: PropTypes.bool,
     url: PropTypes.string,
 }
diff --git a/adapter/src/components/styles/ErrorBoundary.style.js b/adapter/src/components/styles/ErrorBoundary.style.js
@@ -5,7 +5,8 @@ const bgColor = '#F4F6F8',
     primaryTextColor = '#000000',
     secondaryTextColor = '#494949',
     errorColor = '#D32F2F',
-    grey050 = '#FBFCFD'
+    grey050 = '#FBFCFD',
+    red200 = '#ffcdd2'
 
 export default css`
     .mask {
@@ -100,4 +101,12 @@ export default css`
         color: ${errorColor};
         font-family: Menlo, Courier, monospace !important;
     }
+
+    .pluginBoundary {
+        background-color: ${red200};
+    }
+
+    .pluginBoundary span {
+        display: inline-block;
+    }
 `
diff --git a/adapter/src/index.js b/adapter/src/index.js
@@ -14,9 +14,17 @@ const AppAdapter = ({
     apiVersion,
     pwaEnabled,
     plugin,
+    parentAlertsAdd,
+    showAlertsInPlugin,
+    onPluginError,
+    clearPluginError,
     children,
 }) => (
-    <ErrorBoundary fullscreen onRetry={checkForSWUpdateAndReload}>
+    <ErrorBoundary
+        plugin={plugin}
+        fullscreen
+        onRetry={checkForSWUpdateAndReload}
+    >
         <OfflineInterfaceProvider>
             <PWALoadingBoundary>
                 <ServerVersionProvider
@@ -25,8 +33,17 @@ const AppAdapter = ({
                     url={url}
                     apiVersion={apiVersion}
                     pwaEnabled={pwaEnabled}
+                    plugin={plugin}
+                    parentAlertsAdd={parentAlertsAdd}
+                    showAlertsInPlugin={showAlertsInPlugin}
                 >
-                    <AppWrapper plugin={plugin}>{children}</AppWrapper>
+                    <AppWrapper
+                        plugin={plugin}
+                        onPluginError={onPluginError}
+                        clearPluginError={clearPluginError}
+                    >
+                        {children}
+                    </AppWrapper>
                 </ServerVersionProvider>
             </PWALoadingBoundary>
         </OfflineInterfaceProvider>
@@ -38,9 +55,13 @@ AppAdapter.propTypes = {
     appVersion: PropTypes.string.isRequired,
     apiVersion: PropTypes.number,
     children: PropTypes.element,
+    clearPluginError: PropTypes.func,
+    parentAlertsAdd: PropTypes.func,
     plugin: PropTypes.bool,
     pwaEnabled: PropTypes.bool,
+    showAlertsInPlugin: PropTypes.func,
     url: PropTypes.string,
+    onPluginError: PropTypes.func,
 }
 
 export default AppAdapter
diff --git a/cli/config/plugin.webpack.config.js b/cli/config/plugin.webpack.config.js
@@ -35,6 +35,7 @@ module.exports = ({ env: webpackEnv, config, paths }) => {
 
     const shellEnv = getShellEnv({
         plugin: 'true',
+        requiredProps: config.requiredProps ? config.requiredProps.join() : '',
         name: config.title,
         ...getPWAEnvVars(config),
     })

diff --git a/cli/package.json b/cli/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@dhis2/cli-app-scripts",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "engines": {
         "node": ">=14"
     },
@@ -28,7 +28,7 @@
         "@babel/preset-env": "^7.14.7",
         "@babel/preset-react": "^7.0.0",
         "@babel/preset-typescript": "^7.6.0",
-        "@dhis2/app-shell": "10.3.11",
+        "@dhis2/app-shell": "10.4.0-alpha.6",
         "@dhis2/cli-helpers-engine": "^3.2.0",
         "@jest/core": "^27.0.6",
         "@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",

diff --git a/examples/pwa-app/package.json b/examples/pwa-app/package.json
@@ -1,6 +1,6 @@
 {
     "name": "pwa-app",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "description": "",
     "license": "BSD-3-Clause",
     "private": true,
@@ -13,7 +13,7 @@
         "demo": "yarn build --force --standalone --debug && yarn serve"
     },
     "peerDependencies": {
-        "@dhis2/app-runtime": "*",
+        "@dhis2/app-runtime": "^3.10.0-alpha.2",
         "@dhis2/d2-i18n": "*",
         "react": "^16.8",
         "react-dom": "^16.8"

diff --git a/examples/simple-app/package.json b/examples/simple-app/package.json
@@ -1,6 +1,6 @@
 {
     "name": "simple-app",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "repository": "https://github.com/amcgee/dhis2-app-platform",
     "author": "Austin McGee <[email protected]>",
     "license": "BSD-3-Clause",

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "root",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "private": true,
     "repository": {
         "type": "git",

diff --git a/pwa/package.json b/pwa/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@dhis2/pwa",
-    "version": "10.3.11",
+    "version": "10.4.0-alpha.6",
     "description": "",
     "license": "BSD-3-Clause",
     "publishConfig": {
@@ -13,7 +13,7 @@
         "deploy": "d2-app-scripts deploy"
     },
     "devDependencies": {
-        "@dhis2/cli-app-scripts": "10.3.11"
+        "@dhis2/cli-app-scripts": "10.4.0-alpha.6"
     },
     "dependencies": {
         "idb": "^6.0.0",