(
+const AppAdapter = ({
+ appName,
+ appVersion,
+ url,
+ apiVersion,
+ pwaEnabled,
+ plugin,
+ children,
+}) => (
-
-
- {children}
-
-
+
+
+
+ {children}
+
+
+
)
AppAdapter.propTypes = {
appName: PropTypes.string.isRequired,
+ appVersion: PropTypes.string.isRequired,
apiVersion: PropTypes.number,
children: PropTypes.element,
+ plugin: PropTypes.bool,
pwaEnabled: PropTypes.bool,
url: PropTypes.string,
}
diff --git a/adapter/src/utils/api.js b/adapter/src/utils/api.js
index cef437793..94e08e046 100644
--- a/adapter/src/utils/api.js
+++ b/adapter/src/utils/api.js
@@ -14,7 +14,7 @@ const request = (url, options) => {
})
.then((response) => {
if (response.status !== 200) {
- reject('Request failed', response.statusText)
+ reject('Request failed ' + response.statusText)
return
}
try {
diff --git a/adapter/src/utils/parseServerVersion.test.js b/adapter/src/utils/parseServerVersion.test.js
deleted file mode 100644
index 2addbcc76..000000000
--- a/adapter/src/utils/parseServerVersion.test.js
+++ /dev/null
@@ -1,72 +0,0 @@
-const { parseServerVersion } = require('./parseServerVersion')
-
-describe('parseServerVersion', () => {
- let originalConsoleWarn
- beforeAll(() => {
- originalConsoleWarn = console.warn
- })
- beforeEach(() => {
- // Capture console warnings
- console.warn = jest.fn()
- })
- afterAll(() => {
- console.warn = originalConsoleWarn
- })
-
- it('Should correctly parse a simple released version', () => {
- expect(parseServerVersion('2.34.3')).toMatchObject({
- major: 2,
- minor: 34,
- patch: 3,
- tag: undefined,
- })
- expect(console.warn).toHaveBeenCalledTimes(0)
- })
-
- it('Should correctly parse a snapshot version', () => {
- expect(parseServerVersion('2.34-SNAPSHOT')).toMatchObject({
- major: 2,
- minor: 34,
- patch: undefined,
- tag: 'SNAPSHOT',
- })
- expect(console.warn).toHaveBeenCalledTimes(0)
- })
-
- it('Should not break on null or undefined', () => {
- expect(parseServerVersion(null)).toMatchObject({
- major: undefined,
- minor: undefined,
- patch: undefined,
- tag: undefined,
- })
-
- expect(parseServerVersion(undefined)).toMatchObject({
- major: undefined,
- minor: undefined,
- patch: undefined,
- tag: undefined,
- })
- expect(console.warn).toHaveBeenCalledTimes(2)
- })
-
- it('Should correctly parse a future major version', () => {
- expect(parseServerVersion('6.4.2')).toMatchObject({
- major: 6,
- minor: 4,
- patch: 2,
- tag: undefined,
- })
- expect(console.warn).toHaveBeenCalledTimes(1)
- })
-
- it('Should not break on non-numeric version string', () => {
- expect(parseServerVersion('this.is.a.version-test')).toMatchObject({
- major: undefined,
- minor: undefined,
- patch: undefined,
- tag: 'test',
- })
- expect(console.warn).toHaveBeenCalledTimes(1)
- })
-})
diff --git a/adapter/src/utils/parseServerVersion.js b/adapter/src/utils/parseVersion.js
similarity index 73%
rename from adapter/src/utils/parseServerVersion.js
rename to adapter/src/utils/parseVersion.js
index 70b65e836..e23e7aca2 100644
--- a/adapter/src/utils/parseServerVersion.js
+++ b/adapter/src/utils/parseVersion.js
@@ -1,14 +1,21 @@
-export const parseServerVersion = (versionString) => {
+export const parseVersion = (versionString) => {
const [mainVersion, tag] = versionString?.split('-') || []
const [major, minor, patch] = mainVersion?.split('.') || []
const parsedVersion = {
+ full: versionString,
major: parseInt(major) || undefined, // 2
minor: parseInt(minor) || undefined, // 34
patch: parseInt(patch) || undefined, // 1
tag, // SNAPSHOT || undefined
}
+ return parsedVersion
+}
+
+export const parseDHIS2ServerVersion = (versionString) => {
+ const parsedVersion = parseVersion(versionString)
+
if (
!parsedVersion.major ||
!parsedVersion.minor ||
diff --git a/adapter/src/utils/parseVersion.test.js b/adapter/src/utils/parseVersion.test.js
new file mode 100644
index 000000000..a88331865
--- /dev/null
+++ b/adapter/src/utils/parseVersion.test.js
@@ -0,0 +1,113 @@
+const { parseVersion, parseDHIS2ServerVersion } = require('./parseVersion')
+
+describe('parseVersion', () => {
+ let originalConsoleWarn
+ beforeAll(() => {
+ originalConsoleWarn = console.warn
+ })
+ beforeEach(() => {
+ // Capture console warnings
+ console.warn = jest.fn()
+ })
+ afterAll(() => {
+ console.warn = originalConsoleWarn
+ })
+
+ it('Should correctly parse a simple released version', () => {
+ expect(parseVersion('2.34.3')).toMatchObject({
+ full: '2.34.3',
+ major: 2,
+ minor: 34,
+ patch: 3,
+ tag: undefined,
+ })
+ expect(console.warn).toHaveBeenCalledTimes(0)
+ })
+
+ it('Should correctly parse a snapshot version', () => {
+ expect(parseVersion('2.34-SNAPSHOT')).toMatchObject({
+ full: '2.34-SNAPSHOT',
+ major: 2,
+ minor: 34,
+ patch: undefined,
+ tag: 'SNAPSHOT',
+ })
+ expect(console.warn).toHaveBeenCalledTimes(0)
+ })
+
+ it('Should not break on null or undefined', () => {
+ expect(parseVersion(null)).toMatchObject({
+ full: null,
+ major: undefined,
+ minor: undefined,
+ patch: undefined,
+ tag: undefined,
+ })
+
+ expect(parseVersion(undefined)).toMatchObject({
+ full: undefined,
+ major: undefined,
+ minor: undefined,
+ patch: undefined,
+ tag: undefined,
+ })
+ })
+})
+
+describe('parseDHIS2ServerVersion', () => {
+ let originalConsoleWarn
+ beforeAll(() => {
+ originalConsoleWarn = console.warn
+ })
+ beforeEach(() => {
+ // Capture console warnings
+ console.warn = jest.fn()
+ })
+ afterAll(() => {
+ console.warn = originalConsoleWarn
+ })
+
+ it('Should warn on null or undefined', () => {
+ expect(parseDHIS2ServerVersion(null)).toMatchObject({
+ full: null,
+ major: undefined,
+ minor: undefined,
+ patch: undefined,
+ tag: undefined,
+ })
+
+ expect(parseDHIS2ServerVersion(undefined)).toMatchObject({
+ full: undefined,
+ major: undefined,
+ minor: undefined,
+ patch: undefined,
+ tag: undefined,
+ })
+
+ expect(console.warn).toHaveBeenCalledTimes(2)
+ })
+
+ it('Should correctly parse a future major version, but log a warning', () => {
+ expect(parseDHIS2ServerVersion('6.4.2')).toMatchObject({
+ full: '6.4.2',
+ major: 6,
+ minor: 4,
+ patch: 2,
+ tag: undefined,
+ })
+ expect(console.warn).toHaveBeenCalledTimes(1)
+ })
+
+ it('Should not break on non-numeric version string, but log a warning', () => {
+ expect(parseDHIS2ServerVersion('this.is.a.version-test')).toMatchObject(
+ {
+ full: 'this.is.a.version-test',
+ major: undefined,
+ minor: undefined,
+ patch: undefined,
+ tag: 'test',
+ }
+ )
+ expect(console.warn).toHaveBeenCalledTimes(1)
+ })
+})
diff --git a/adapter/src/utils/usePWAUpdateState.js b/adapter/src/utils/usePWAUpdateState.js
new file mode 100644
index 000000000..e5292e14c
--- /dev/null
+++ b/adapter/src/utils/usePWAUpdateState.js
@@ -0,0 +1,54 @@
+import { useEffect, useState } from 'react'
+import { useOfflineInterface } from '../components/OfflineInterfaceContext'
+
+export const usePWAUpdateState = () => {
+ const offlineInterface = useOfflineInterface()
+ const [updateAvailable, setUpdateAvailable] = useState(false)
+ const [clientsCount, setClientsCount] = useState(null)
+
+ const onConfirmUpdate = () => {
+ offlineInterface.useNewSW()
+ }
+ const onCancelUpdate = () => {
+ setClientsCount(null)
+ }
+
+ const confirmReload = () => {
+ offlineInterface
+ .getClientsInfo()
+ .then(({ clientsCount }) => {
+ if (clientsCount === 1) {
+ // Just one client; go ahead and reload
+ onConfirmUpdate()
+ } else {
+ // Multiple clients; warn about data loss before reloading
+ setClientsCount(clientsCount)
+ }
+ })
+ .catch((reason) => {
+ // Didn't get clients info
+ console.warn(reason)
+
+ // Go ahead with confirmation modal with `0` as clientsCount
+ setClientsCount(0)
+ })
+ }
+
+ useEffect(() => {
+ offlineInterface.checkForNewSW({
+ onNewSW: () => {
+ setUpdateAvailable(true)
+ },
+ })
+ }, [offlineInterface])
+
+ const confirmationRequired = clientsCount !== null
+ return {
+ updateAvailable,
+ confirmReload,
+ confirmationRequired,
+ clientsCount,
+ onConfirmUpdate,
+ onCancelUpdate,
+ }
+}
diff --git a/cli/config/d2.pwa.config.js b/cli/config/d2.pwa.config.js
index ea0f28f0d..d9e9b0c3a 100644
--- a/cli/config/d2.pwa.config.js
+++ b/cli/config/d2.pwa.config.js
@@ -38,6 +38,18 @@ module.exports = {
* https://developers.google.com/web/tools/workbox/modules/workbox-precaching#explanation_of_the_precache_list
*/
additionalManifestEntries: [],
+ /**
+ * By default, all the contents of the `build` folder are added to
+ * the precache to give the app the best chances of functioning
+ * completely while offline. Developers may choose to omit some
+ * of these files (for example, thousands of font or image files)
+ * if they cause cache bloat and the app can work fine without
+ * them precached. See LIBS-482
+ *
+ * The globs should be relative to the public dir of the built app.
+ * Used in injectPrecacheManifest.js
+ */
+ globsToOmitFromPrecache: [],
},
},
}
diff --git a/cli/config/init.App.test.js b/cli/config/init.App.test.js
index 0a72d6b49..d53a3302b 100644
--- a/cli/config/init.App.test.js
+++ b/cli/config/init.App.test.js
@@ -1,7 +1,7 @@
import { CustomDataProvider } from '@dhis2/app-runtime'
import React from 'react'
import ReactDOM from 'react-dom'
-import App from './App'
+import App from './App.js'
it('renders without crashing', () => {
const div = document.createElement('div')
diff --git a/cli/config/init.entrypoint.js b/cli/config/init.entrypoint.js
index 082a4f752..c8ed94cdf 100644
--- a/cli/config/init.entrypoint.js
+++ b/cli/config/init.entrypoint.js
@@ -1,6 +1,6 @@
-import React from 'react'
import { DataQuery } from '@dhis2/app-runtime'
import i18n from '@dhis2/d2-i18n'
+import React from 'react'
import classes from './App.module.css'
const query = {
@@ -13,8 +13,12 @@ const MyApp = () => (
{({ error, loading, data }) => {
- if (error) return ERROR
- if (loading) return ...
+ if (error) {
+ return ERROR
+ }
+ if (loading) {
+ return ...
+ }
return (
<>
diff --git a/cli/config/plugin.webpack.config.js b/cli/config/plugin.webpack.config.js
new file mode 100644
index 000000000..29d539570
--- /dev/null
+++ b/cli/config/plugin.webpack.config.js
@@ -0,0 +1,307 @@
+// Based on CRA Webpack config
+
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin')
+const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const getCSSModuleLocalIdent = require('react-dev-utils/getCSSModuleLocalIdent')
+const getPublicUrlOrPath = require('react-dev-utils/getPublicUrlOrPath')
+const TerserPlugin = require('terser-webpack-plugin')
+const webpack = require('webpack')
+const WorkboxWebpackPlugin = require('workbox-webpack-plugin')
+const { getPWAEnvVars } = require('../src/lib/pwa')
+const getShellEnv = require('../src/lib/shell/env')
+const makeBabelConfig = require('./makeBabelConfig')
+
+const babelWebpackConfig = {
+ babelrc: false,
+ configFile: false,
+ cacheDirectory: true,
+ cacheCompression: false,
+}
+
+const cssRegex = /\.css$/
+const cssModuleRegex = /\.module\.css$/
+
+module.exports = ({ env: webpackEnv, config, paths }) => {
+ const isProduction = webpackEnv === 'production'
+ const isDevelopment = !isProduction
+
+ const publicPath = getPublicUrlOrPath(
+ isDevelopment,
+ null,
+ process.env.PUBLIC_URL
+ )
+
+ const shellEnv = getShellEnv({
+ plugin: 'true',
+ name: config.title,
+ ...getPWAEnvVars(config),
+ })
+
+ // "style" loader turns CSS into JS modules that inject