From b4b8be3297e427dad6fbc6697ffdb765a796f7fd Mon Sep 17 00:00:00 2001
From: David Beall <beallio@users.noreply.github.com>
Date: Sun, 2 Aug 2026 14:26:12 -0700
Subject: fix: align plugin install progress (#944)

Co-authored-by: David Beall <6121439+beallio@users.noreply.github.com>
---
 .../src/components/modals/MultiplePluginsInstallModal.tsx    | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

(limited to 'frontend/src/components/modals/MultiplePluginsInstallModal.tsx')

diff --git a/frontend/src/components/modals/MultiplePluginsInstallModal.tsx b/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
index e5c1c647..4a386997 100644
--- a/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
+++ b/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
@@ -1,9 +1,10 @@
-import { ConfirmModal, Navigation, ProgressBarWithInfo, QuickAccessTab } from '@decky/ui';
+import { ConfirmModal, Navigation, QuickAccessTab } from '@decky/ui';
 import { FC, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaCheck, FaDownload } from 'react-icons/fa';
 
 import { DisabledPlugin, InstallType, InstallTypeTranslationMapping } from '../../plugin';
+import PluginInstallProgress from './PluginInstallProgress';
 
 interface MultiplePluginsInstallModalProps {
   requests: { name: string; version: string; hash: string; install_type: InstallType }[];
@@ -132,15 +133,12 @@ const MultiplePluginsInstallModal: FC<MultiplePluginsInstallModalProps> = ({
             );
           })}
         </ul>
-        {/* TODO: center the progress bar and make it 80% width */}
         {loading && (
-          <ProgressBarWithInfo
+          <PluginInstallProgress
             // when the key changes, react considers this a new component so resets the progress without the smoothing animation
             key={pluginInProgress}
-            bottomSeparator="none"
-            focusable={false}
-            nProgress={percentage}
-            sOperationText={downloadInfo}
+            percentage={percentage}
+            operationText={downloadInfo}
           />
         )}
       </div>
-- 
cgit v1.2.3