Merge pull request #7042 from viown/add-plugin-loading

Add loading indicator when installing plugin

src/apps/dashboard/routes/plugins/plugin.tsx

@@ -56,6 +56,7 @@ const PluginPage: FC = () => {
 
     const [ isEnabledOverride, setIsEnabledOverride ] = useState<boolean>();
     const [ isInstallConfirmOpen, setIsInstallConfirmOpen ] = useState(false);
+    const [ isInstalling, setIsInstalling ] = useState(false);
     const [ isUninstallConfirmOpen, setIsUninstallConfirmOpen ] = useState(false);
     const [ pendingInstallVersion, setPendingInstallVersion ] = useState<VersionInfo>();
 
@@ -246,6 +247,7 @@ const PluginPage: FC = () => {
 
         console.debug('[PluginPage] installing plugin', installVersion);
 
+        setIsInstalling(true);
         installPlugin.mutate({
             name: pluginDetails.name,
             assemblyGuid: pluginDetails.id,
@@ -253,6 +255,7 @@ const PluginPage: FC = () => {
             repositoryUrl: installVersion.repositoryUrl
         }, {
             onSettled: () => {
+                setIsInstalling(false);
                 setPendingInstallVersion(undefined);
                 disablePlugin.reset();
                 enablePlugin.reset();
@@ -374,6 +377,7 @@ const PluginPage: FC = () => {
                                         <Button
                                             startIcon={<Download />}
                                             onClick={onInstall()}
+                                            loading={isInstalling}
                                         >
                                             {globalize.translate('HeaderInstall')}
                                         </Button>