From 9fff79f3ef4f2634d16d1cf7813d7d4110f61ab2 Mon Sep 17 00:00:00 2001
From: "maige-app[bot]" <303827+maige-app[bot]@users.noreply.github.com>
Date: Tue, 13 Feb 2024 17:37:06 +0000
Subject: [PATCH] feat: Add copy button feature for  command on  route

---
 src/pages/add-dock.tsx | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/pages/add-dock.tsx b/src/pages/add-dock.tsx
index b0ae512..fbf95a7 100644
--- a/src/pages/add-dock.tsx
+++ b/src/pages/add-dock.tsx
@@ -62,9 +62,21 @@ const AddDock = () => {
           To add your own dock, run the following command in your{" "}
           <Link href="/apps/Terminal">terminal</Link>:
         </p>
-        <code className="mb-8 w-full rounded border bg-black p-4">
-          npx dockhunt
-        </code>
+        <div className="flex mb-8 items-center">
+          <code className="rounded border bg-black p-4">
+            npx dockhunt
+          </code>
+          <button
+            className="ml-4 rounded-full bg-blue-700 px-4 py-2 text-white hover:bg-blue-600"
+            onClick={() => {
+              navigator.clipboard.writeText('npx dockhunt').then(() => {
+                alert('Command copied!');
+              });
+            }}
+          >
+            Copy Command
+          </button>
+        </div>
         <p className="mb-2 text-xl">The command will:</p>
         <ol className="mb-8 list-decimal pl-8 text-xl">
           <li>Find the apps in your dock</li>
@@ -95,7 +107,7 @@ const AddDock = () => {
 
         <p className="mb-8 text-xl">
           Dockhunt will only use the apps that are pinned to your dock. Apps can
-          be pinned by right-clicking and selecting Options &gt; Keep in Dock.
+          be pinned by right-clicking and selecting Options > Keep in Dock.
           Apps that are not pinned will be ignored.
         </p>
         <Image
@@ -108,4 +120,4 @@ const AddDock = () => {
   );
 };
 
-export default AddDock;
+export default AddDock;
\ No newline at end of file