diff --git a/web/src/pages/ApiServices/View/index.tsx b/web/src/pages/ApiServices/View/index.tsx
index b908351..e58c7c1 100644
--- a/web/src/pages/ApiServices/View/index.tsx
+++ b/web/src/pages/ApiServices/View/index.tsx
@@ -2,7 +2,7 @@ import Breadcrumbs from "@/components/ui/breadcrumbs";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { useAdmin } from "@/store/admin";
-import { useCallback, useEffect, type FC } from "react";
+import { useEffect, type FC } from "react";
 import { Link, useParams } from "react-router";
 
 const InfoCard = ({
@@ -189,9 +189,12 @@ const ViewApiServicePage: FC = () => {
             >
               {apiService.is_active ? "Disable" : "Enable"}
             </Button>
-            <Button variant="contained" disabled>
-              Edit
-            </Button>
+            <Link
+              to={`/admin/api-services/edit/${serviceId}`}
+              className="hover:underline hover:text-gray-600 dark:hover:text-gray-300 transition-colors"
+            >
+              <Button variant="contained">Edit</Button>
+            </Link>
           </div>
         </div>
       </div>