diff --git a/package.json b/package.json
index d3ce8656..a5088edf 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
"@dhis2/app-runtime": "^3.2.0",
"@dhis2/d2-i18n": "^1.1.0",
"@dhis2/prop-types": "^2.0.3",
- "@dhis2/ui": "^7.2.0",
+ "@dhis2/ui": "^9.0.1",
"moment": "^2.29.0",
"query-string": "^6.14.1",
"react-router-dom": "^5.2.0",
diff --git a/src/components/AppDetails/ManageInstalledVersion.js b/src/components/AppDetails/ManageInstalledVersion.js
index de0d877f..c4d7b766 100644
--- a/src/components/AppDetails/ManageInstalledVersion.js
+++ b/src/components/AppDetails/ManageInstalledVersion.js
@@ -1,8 +1,8 @@
import { useAlert } from '@dhis2/app-runtime'
import i18n from '@dhis2/d2-i18n'
import { PropTypes } from '@dhis2/prop-types'
-import { Button } from '@dhis2/ui'
-import React from 'react'
+import { Button, CircularLoader } from '@dhis2/ui'
+import React, { useState } from 'react'
import { useApi } from '../../api.js'
import { getLatestVersion } from '../../get-latest-version.js'
import { semverGt } from '../../semver-gt.js'
@@ -30,8 +30,12 @@ export const ManageInstalledVersion = ({
const { installVersion, uninstallApp } = useApi()
const successAlert = useAlert(({ message }) => message, { success: true })
const errorAlert = useAlert(({ message }) => message, { critical: true })
+
+ const [isInstalling, setIsInstalling] = useState(false)
+
const handleInstall = async () => {
try {
+ setIsInstalling(true)
await installVersion(latestVersion.id)
successAlert.show({
message: canUpdate
@@ -43,14 +47,16 @@ export const ManageInstalledVersion = ({
errorAlert.show({
message: canUpdate
? i18n.t('Failed to update app: {{errorMessage}}', {
- errorMessage: error.message,
- nsSeparator: '-:-',
- })
+ errorMessage: error.message,
+ nsSeparator: '-:-',
+ })
: i18n.t('Failed to install app: {{errorMessage}}', {
- errorMessage: error.message,
- nsSeparator: '-:-',
- }),
+ errorMessage: error.message,
+ nsSeparator: '-:-',
+ }),
})
+ } finally {
+ setIsInstalling(false)
}
}
const handleUninstall = async () => {
@@ -72,12 +78,17 @@ export const ManageInstalledVersion = ({
return (
- {canInstall && (
- <>
-