From ded41a63a16e5cbc57c92873db7c32bd2291068d Mon Sep 17 00:00:00 2001
From: Bhathiya Vicum <bathiyavicum0@gmail.com>
Date: Fri, 24 Apr 2026 10:16:00 +0530
Subject: [PATCH] feat: always show Swap/Reset buttons and disable when inputs
 are empty

---
 components/compare-form.tsx | 41 +++++++++++++++++--------------------
 1 file changed, 19 insertions(+), 22 deletions(-)

diff --git a/components/compare-form.tsx b/components/compare-form.tsx
index cc79df4..56c4d5a 100644
--- a/components/compare-form.tsx
+++ b/components/compare-form.tsx
@@ -39,6 +39,7 @@ export function CompareForm({
   }, []);
 
   const canSubmit = Boolean(username1.trim() && username2.trim() && !loading);
+  const isEmpty = !username1.trim() && !username2.trim();
 
   const handleSwap = () => {
     setUsername1(username2);
@@ -90,28 +91,24 @@ export function CompareForm({
             >
               {loading ? t("form.compare.ing") : t("form.compare")}
             </Button>
-            {data && (
-              <>
-                <Button
-                  onClick={handleSwap}
-                  disabled={loading}
-                  type="button"
-                  title={t("form.swap")}
-                  className="shadow-sm transition-transform hover:-translate-y-0.5"
-                >
-                  <ArrowLeftRight className="h-4 w-4" />
-                </Button>
-                <Button
-                  onClick={handleReset}
-                  disabled={loading}
-                  title={t("form.reset")}
-                  type="button"
-                  className="shadow-sm transition-transform hover:-translate-y-0.5"
-                >
-                  <RefreshCw className="h-4 w-4" />
-                </Button>
-              </>
-            )}
+            <Button
+              onClick={handleSwap}
+              type="button"
+              disabled={isEmpty || loading}
+              title={t("form.swap")}
+              className="shadow-sm transition-transform hover:-translate-y-0.5"
+            >
+              <ArrowLeftRight className="h-4 w-4" />
+            </Button>
+            <Button
+              onClick={handleReset}
+              title={t("form.reset")}
+              disabled={isEmpty || loading}
+              type="button"
+              className="shadow-sm transition-transform hover:-translate-y-0.5"
+            >
+              <RefreshCw className="h-4 w-4" />
+            </Button>
           </div>
           {error && (
             <Alert variant="destructive" className="mt-4">