feat: render circular loader in manual install button while installing

Author: mediremi

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: 2021-05-31T12:19:50.489Z\n"
-"PO-Revision-Date: 2021-05-31T12:19:50.489Z\n"
+"POT-Creation-Date: 2021-05-31T15:48:18.461Z\n"
+"PO-Revision-Date: 2021-05-31T15:48:18.461Z\n"
 
 msgid "Version {{version}} installed"
 msgstr ""

src/pages/ManualInstall/ManualInstall.js

@@ -1,6 +1,6 @@
 import { useAlert } from '@dhis2/app-runtime'
 import i18n from '@dhis2/d2-i18n'
-import { Button } from '@dhis2/ui'
+import { Button, CircularLoader } from '@dhis2/ui'
 import React, { useState, useRef } from 'react'
 import { useApi } from '../../api'
 import styles from './ManualInstall.module.css'
@@ -52,9 +52,14 @@ const UploadButton = () => {
                 onClick={handleClick}
                 disabled={isUploading}
             >
-                {isUploading
-                    ? i18n.t('Uploading...')
-                    : i18n.t('Upload an app to install')}
+                {isUploading ? (
+                    <>
+                        {i18n.t('Uploading...')}
+                        <CircularLoader small />
+                    </>
+                ) : (
+                    i18n.t('Upload an app to install')
+                )}
             </Button>
         </>
     )