From a4706a7f9a45ea726dd66fc8f90a9cda35791ab3 Mon Sep 17 00:00:00 2001
From: zhom <2717306+zhom@users.noreply.github.com>
Date: Mon, 4 Aug 2025 06:28:42 +0400
Subject: [PATCH] refactor: better handle browser download state in the create
 profile dialog

---
 src-tauri/src/browser_runner.rs          |  2 +-
 src/components/change-version-dialog.tsx |  6 +--
 src/components/create-profile-dialog.tsx | 57 +++++++++++++++++++-----
 3 files changed, 50 insertions(+), 15 deletions(-)

diff --git a/src-tauri/src/browser_runner.rs b/src-tauri/src/browser_runner.rs
index 3661cdb..f94c00f 100644
--- a/src-tauri/src/browser_runner.rs
+++ b/src-tauri/src/browser_runner.rs
@@ -185,7 +185,7 @@ impl BrowserRunner {
 
         // Set proxy in camoufox config
         camoufox_config.proxy = Some(proxy_url);
-        
+
         // Ensure geoip is always enabled for proper geolocation spoofing
         if camoufox_config.geoip.is_none() {
           camoufox_config.geoip = Some(serde_json::Value::Bool(true));
diff --git a/src/components/change-version-dialog.tsx b/src/components/change-version-dialog.tsx
index ddf6ee8..a219b24 100644
--- a/src/components/change-version-dialog.tsx
+++ b/src/components/change-version-dialog.tsx
@@ -44,7 +44,7 @@ export function ChangeVersionDialog({
 
   const {
     downloadedVersions,
-    isDownloading,
+    isBrowserDownloading,
     loadDownloadedVersions,
     downloadBrowser,
     isVersionDownloaded,
@@ -207,7 +207,7 @@ export function ChangeVersionDialog({
                       onReleaseTypeSelect={setSelectedReleaseType}
                       availableReleaseTypes={releaseTypes}
                       browser={profile.browser}
-                      isDownloading={isDownloading}
+                      isDownloading={isBrowserDownloading(profile.browser)}
                       onDownload={() => {
                         void handleDownload();
                       }}
@@ -247,7 +247,7 @@ export function ChangeVersionDialog({
                     onReleaseTypeSelect={setSelectedReleaseType}
                     availableReleaseTypes={releaseTypes}
                     browser={profile.browser}
-                    isDownloading={isDownloading}
+                    isDownloading={isBrowserDownloading(profile.browser)}
                     onDownload={() => {
                       void handleDownload();
                     }}
diff --git a/src/components/create-profile-dialog.tsx b/src/components/create-profile-dialog.tsx
index 8cb38b4..f07d5ae 100644
--- a/src/components/create-profile-dialog.tsx
+++ b/src/components/create-profile-dialog.tsx
@@ -347,6 +347,11 @@ export function CreateProfileDialog({
     return bestVersion && isVersionDownloaded(bestVersion.version);
   };
 
+  // Check if browser is currently downloading
+  const isBrowserCurrentlyDownloading = (browserStr: string) => {
+    return isBrowserDownloading(browserStr);
+  };
+
   // Get the selected OS for warning
   const selectedOS = camoufoxConfig.os?.[0];
   const currentOS = getCurrentOS();
@@ -428,22 +433,38 @@ export function CreateProfileDialog({
                             </p>
                             <LoadingButton
                               onClick={() => handleDownload(selectedBrowser)}
-                              isLoading={isBrowserDownloading(selectedBrowser)}
+                              isLoading={isBrowserCurrentlyDownloading(
+                                selectedBrowser,
+                              )}
                               size="sm"
-                              disabled={isBrowserDownloading(selectedBrowser)}
+                              disabled={isBrowserCurrentlyDownloading(
+                                selectedBrowser,
+                              )}
                             >
                               Download
                             </LoadingButton>
                           </div>
                         )}
-                      {isBrowserVersionAvailable(selectedBrowser) && (
-                        <div className="text-sm text-green-600">
+                      {!isBrowserCurrentlyDownloading(selectedBrowser) &&
+                        isBrowserVersionAvailable(selectedBrowser) && (
+                          <div className="text-sm text-green-600">
+                            {(() => {
+                              const bestVersion = getBestAvailableVersion(
+                                availableReleaseTypes,
+                                selectedBrowser,
+                              );
+                              return `✓ ${bestVersion?.releaseType === "stable" ? "Latest stable" : "Latest nightly"} version (${bestVersion?.version}) is available`;
+                            })()}
+                          </div>
+                        )}
+                      {isBrowserCurrentlyDownloading(selectedBrowser) && (
+                        <div className="text-sm text-blue-600">
                           {(() => {
                             const bestVersion = getBestAvailableVersion(
                               availableReleaseTypes,
                               selectedBrowser,
                             );
-                            return `✓ ${bestVersion?.releaseType === "stable" ? "Latest stable" : "Latest nightly"} version (${bestVersion?.version}) is available`;
+                            return `Downloading ${bestVersion?.releaseType === "stable" ? "stable" : "nightly"} version (${bestVersion?.version})...`;
                           })()}
                         </div>
                       )}
@@ -472,22 +493,36 @@ export function CreateProfileDialog({
                         </p>
                         <LoadingButton
                           onClick={() => handleDownload("camoufox")}
-                          isLoading={isBrowserDownloading("camoufox")}
+                          isLoading={isBrowserCurrentlyDownloading("camoufox")}
                           size="sm"
-                          disabled={isBrowserDownloading("camoufox")}
+                          disabled={isBrowserCurrentlyDownloading("camoufox")}
                         >
-                          Download
+                          {isBrowserCurrentlyDownloading("camoufox")
+                            ? "Downloading..."
+                            : "Download"}
                         </LoadingButton>
                       </div>
                     )}
-                  {isBrowserVersionAvailable("camoufox") && (
-                    <div className="p-3 text-sm text-green-600 bg-green-50 rounded-md border border-green-200">
+                  {!isBrowserCurrentlyDownloading("camoufox") &&
+                    isBrowserVersionAvailable("camoufox") && (
+                      <div className="p-3 text-sm text-green-600 bg-green-50 rounded-md border border-green-200">
+                        {(() => {
+                          const bestVersion = getBestAvailableVersion(
+                            camoufoxReleaseTypes,
+                            "camoufox",
+                          );
+                          return `✓ Camoufox ${bestVersion?.releaseType} version (${bestVersion?.version}) is available`;
+                        })()}
+                      </div>
+                    )}
+                  {isBrowserCurrentlyDownloading("camoufox") && (
+                    <div className="p-3 text-sm text-blue-600 bg-blue-50 rounded-md border border-blue-200">
                       {(() => {
                         const bestVersion = getBestAvailableVersion(
                           camoufoxReleaseTypes,
                           "camoufox",
                         );
-                        return `✓ Camoufox ${bestVersion?.releaseType} version (${bestVersion?.version}) is available`;
+                        return `Downloading Camoufox ${bestVersion?.releaseType} version (${bestVersion?.version})...`;
                       })()}
                     </div>
                   )}