From 1e9ebe14a8d200e3906aa6d2fe5d6bfd5bf4a7dc Mon Sep 17 00:00:00 2001
From: Piyush-jangid-01 <jangidpiyush16011@gmail.com>
Date: Thu, 22 Oct 2026 15:11:53 +0530
Subject: [PATCH] fix: preserve input when swap fails

---
 .../base64/components/TextTab.test.tsx        | 31 +++++++++++-
 app/(tools)/base64/components/TextTab.tsx     |  4 +-
 .../url-encoder/UrlEncoderClient.test.tsx     | 49 +++++++++++++++++--
 app/(tools)/url-encoder/UrlEncoderClient.tsx  |  4 +-
 4 files changed, 82 insertions(+), 6 deletions(-)

diff --git a/app/(tools)/base64/components/TextTab.test.tsx b/app/(tools)/base64/components/TextTab.test.tsx
index a6b6fa3..1c2460a 100644
--- a/app/(tools)/base64/components/TextTab.test.tsx
+++ b/app/(tools)/base64/components/TextTab.test.tsx
@@ -1,4 +1,4 @@
-import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
 import { afterEach, describe, expect, it } from "vitest";
 import { ToastProvider } from "@/components/shared/Toast";
 import { TextTab } from "./TextTab";
@@ -71,4 +71,33 @@ describe("TextTab switches", () => {
     // The styling hook stays in step with the state.
     expect(urlSafe).toHaveAttribute("data-active", "true");
   });
+
+  it("disables Swap and preserves invalid input when the shortcut runs", async () => {
+    renderTab();
+    fireEvent.click(screen.getByRole("button", { name: "Base64 → Text" }));
+    const input = screen.getByRole("textbox", { name: "Base64 to decode" });
+    fireEvent.change(input, { target: { value: "Hello world, how are you?" } });
+
+    expect(await screen.findByText(/Invalid base64/i)).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Swap direction" })).toBeDisabled();
+
+    fireEvent.keyDown(input, { key: "s", ctrlKey: true, shiftKey: true });
+
+    expect(input).toHaveValue("Hello world, how are you?");
+    expect(screen.getByRole("button", { name: "Base64 → Text" })).toHaveAttribute("aria-pressed", "true");
+  });
+
+  it("swaps a valid conversion result", async () => {
+    renderTab();
+    fireEvent.change(screen.getByRole("textbox", { name: "Text to encode" }), {
+      target: { value: "Hello world" },
+    });
+
+    expect(await screen.findByText("SGVsbG8gd29ybGQ=")).toBeInTheDocument();
+    fireEvent.click(screen.getByRole("button", { name: "Swap direction" }));
+
+    expect(screen.getByRole("button", { name: "Base64 → Text" })).toHaveAttribute("aria-pressed", "true");
+    expect(screen.getByRole("textbox", { name: "Base64 to decode" })).toHaveValue("SGVsbG8gd29ybGQ=");
+    await waitFor(() => expect(screen.getByText("Hello world")).toBeInTheDocument());
+  });
 });
diff --git a/app/(tools)/base64/components/TextTab.tsx b/app/(tools)/base64/components/TextTab.tsx
index b3cd7dd..39df1d0 100644
--- a/app/(tools)/base64/components/TextTab.tsx
+++ b/app/(tools)/base64/components/TextTab.tsx
@@ -110,6 +110,7 @@ export function TextTab() {
   }
 
   function swap() {
+    if (error || !output) return;
     setDirection((d) => (d === "encode" ? "decode" : "encode"));
     setInput(output);
     setOutput(input);
@@ -138,7 +139,7 @@ export function TextTab() {
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [direction, input, opts, urlSafe, padding]);
+  }, [direction, input, output, error, opts, urlSafe, padding, gzip, chunk]);
 
   const inputBytes = useMemo(() => new Blob([input]).size, [input]);
   const outputBytes = useMemo(() => new Blob([output]).size, [output]);
@@ -277,6 +278,7 @@ export function TextTab() {
           <button
             type="button"
             onClick={swap}
+            disabled={Boolean(error) || !output}
             className="group w-11 h-11 rounded-full border border-[var(--hairline-strong)] bg-[var(--bg-raise)] flex items-center justify-center hover:border-[var(--cyan)] hover:shadow-[0_0_30px_-8px_rgba(0,229,199,0.6)] transition-all"
             title={`Swap direction (${formatModShiftKey("S", isMac)})`}
             aria-label="Swap direction"
diff --git a/app/(tools)/url-encoder/UrlEncoderClient.test.tsx b/app/(tools)/url-encoder/UrlEncoderClient.test.tsx
index 1e7db98..d51508a 100644
--- a/app/(tools)/url-encoder/UrlEncoderClient.test.tsx
+++ b/app/(tools)/url-encoder/UrlEncoderClient.test.tsx
@@ -1,12 +1,25 @@
-import { cleanup, fireEvent, render, screen } from "@testing-library/react";
-import { afterEach, describe, expect, it } from "vitest";
+import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
 import { UrlEncoderClient } from "./UrlEncoderClient";
 
+const commandRegistry = vi.hoisted(() => ({
+  commands: [] as { id: string; run: () => void }[],
+}));
+
+vi.mock("@/components/shared/CommandPalette", () => ({
+  useRegisterCommands: (_scope: string, commands: { id: string; run: () => void }[]) => {
+    commandRegistry.commands = commands;
+  },
+}));
+
 const tab = (name: string) => screen.getByRole("tab", { name });
 
 describe("UrlEncoderClient tabs", () => {
   // Vitest globals are off, so Testing Library does not clean up on its own.
-  afterEach(cleanup);
+  afterEach(() => {
+    cleanup();
+    commandRegistry.commands = [];
+  });
 
   it("marks only the selected direction tab", () => {
     render(<UrlEncoderClient />);
@@ -50,4 +63,34 @@ describe("UrlEncoderClient tabs", () => {
     expect(component).toHaveAttribute("aria-pressed", "false");
     expect(fullUrl).toHaveAttribute("aria-pressed", "true");
   });
+
+  it("disables Swap and preserves invalid input when the command runs", async () => {
+    render(<UrlEncoderClient />);
+    fireEvent.click(tab("Decode"));
+    const input = screen.getByRole("textbox", { name: "Percent-encoded text to decode" });
+    fireEvent.change(input, { target: { value: "Save 50% today" } });
+
+    expect(await screen.findByText(/Malformed percent-encoding/)).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Swap direction" })).toBeDisabled();
+
+    commandRegistry.commands.find((command) => command.id === "url:swap")?.run();
+
+    expect(input).toHaveValue("Save 50% today");
+    expect(tab("Decode")).toHaveAttribute("aria-selected", "true");
+  });
+
+  it("swaps a valid conversion result", async () => {
+    render(<UrlEncoderClient />);
+    fireEvent.click(tab("Decode"));
+    fireEvent.change(screen.getByRole("textbox", { name: "Percent-encoded text to decode" }), {
+      target: { value: "Hello%20world" },
+    });
+
+    expect(await screen.findByText("Hello world")).toBeInTheDocument();
+    fireEvent.click(screen.getByRole("button", { name: "Swap direction" }));
+
+    expect(tab("Encode")).toHaveAttribute("aria-selected", "true");
+    expect(screen.getByRole("textbox", { name: "Text or URL to encode" })).toHaveValue("Hello world");
+    await waitFor(() => expect(screen.getByText("Hello%20world")).toBeInTheDocument());
+  });
 });
diff --git a/app/(tools)/url-encoder/UrlEncoderClient.tsx b/app/(tools)/url-encoder/UrlEncoderClient.tsx
index abf86b1..0079048 100644
--- a/app/(tools)/url-encoder/UrlEncoderClient.tsx
+++ b/app/(tools)/url-encoder/UrlEncoderClient.tsx
@@ -55,6 +55,7 @@ export function UrlEncoderClient() {
   }
 
   function swap() {
+    if (error || !output) return;
     setDirection((d) => (d === "encode" ? "decode" : "encode"));
     setInput(output);
   }
@@ -66,7 +67,7 @@ export function UrlEncoderClient() {
       { id: "url:decode", section: "URL Encoder", title: "Decode tab", run: () => setDirection("decode") },
       { id: "url:swap", section: "URL Encoder", title: "Swap direction", run: swap },
     ],
-    [output]
+    [output, error]
   );
 
   return (
@@ -156,6 +157,7 @@ export function UrlEncoderClient() {
             <button
               type="button"
               onClick={swap}
+              disabled={Boolean(error) || !output}
               className="group w-11 h-11 rounded-full border border-[var(--hairline-strong)] bg-[var(--bg-raise)] flex items-center justify-center hover:border-[var(--cyan)] hover:shadow-[0_0_30px_-8px_rgba(0,229,199,0.6)] transition-all"
               title="Swap direction"
               aria-label="Swap direction"