1 files changed, 10 insertions, 3 deletions
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}