fix plugin uninstalls

2 files changed, 22 insertions, 12 deletions

diff --git a/frontend/src/components/modals/PluginInstallModal.tsx b/frontend/src/components/modals/PluginInstallModal.tsx
index c6c90264..d9a3b433 100644
--- a/frontend/src/components/modals/PluginInstallModal.tsx
+++ b/frontend/src/components/modals/PluginInstallModal.tsx
@@ -58,13 +58,24 @@ const PluginInstallModal: FC<PluginInstallModalProps> = ({
         await onCancel();
       }}
       strTitle={
-        <div>
+        <div style={{display: "flex", flexDirection: "row", alignItems: "center", width: "100%"}}>
           <TranslationHelper
             transClass={TranslationClass.PLUGIN_INSTALL_MODAL}
             transText="title"
             i18nArgs={{ artifact: artifact }}
             installType={installType}
           />
+          {loading && (
+            <div style={{marginLeft: "auto"}}>
+              <ProgressBarWithInfo
+                layout="inline"
+                
+                bottomSeparator="none"
+                nProgress={percentage}
+                sOperationText={downloadInfo}
+              />
+            </div>
+          )}
         </div>
       }
       strOKButtonText={
@@ -98,14 +109,6 @@ const PluginInstallModal: FC<PluginInstallModalProps> = ({
           installType={installType}
         />
       </div>
-      {loading && (
-        <ProgressBarWithInfo
-          layout="inline"
-          bottomSeparator="none"
-          nProgress={percentage}
-          sOperationText={downloadInfo}
-        />
-      )}
       {hash == 'False' && <span style={{ color: 'red' }}>{t('PluginInstallModal.no_hash')}</span>}
     </ConfirmModal>
   );
diff --git a/frontend/src/components/modals/PluginUninstallModal.tsx b/frontend/src/components/modals/PluginUninstallModal.tsx
index f943ad9c..a0d04102 100644
--- a/frontend/src/components/modals/PluginUninstallModal.tsx
+++ b/frontend/src/components/modals/PluginUninstallModal.tsx
@@ -1,5 +1,5 @@
-import { ConfirmModal } from '@decky/ui';
-import { FC } from 'react';
+import { ConfirmModal, Spinner } from '@decky/ui';
+import { FC, useState } from 'react';
 
 import { uninstallPlugin } from '../../plugin';
 
@@ -12,10 +12,12 @@ interface PluginUninstallModalProps {
 }
 
 const PluginUninstallModal: FC<PluginUninstallModalProps> = ({ name, title, buttonText, description, closeModal }) => {
+  const [uninstalling, setUninstalling] = useState<boolean>(false);
   return (
     <ConfirmModal
       closeModal={closeModal}
       onOK={async () => {
+        setUninstalling(true);
         await uninstallPlugin(name);
         // uninstalling a plugin resets the hidden setting for it server-side
         // we invalidate here so if you re-install it, you won't have an out-of-date hidden filter
@@ -23,7 +25,12 @@ const PluginUninstallModal: FC<PluginUninstallModalProps> = ({ name, title, butt
         await DeckyPluginLoader.hiddenPluginsService.invalidate();
         closeModal?.();
       }}
-      strTitle={title}
+      bOKDisabled={uninstalling}
+      bCancelDisabled={uninstalling}
+      strTitle={<div style={{display: "flex", flexDirection: "row", alignItems: "center", width: "100%"}}>
+        {title}
+        {uninstalling && <Spinner width="24px" height="24px" style={{marginLeft: "auto"}}/>}
+      </div>}
       strOKButtonText={buttonText}
     >
       {description}