diff --git a/web/components/support-project.tsx b/web/components/support-project.tsx
index 0b9e632..9cd06c5 100644
--- a/web/components/support-project.tsx
+++ b/web/components/support-project.tsx
@@ -1,7 +1,13 @@
+"use client"
+
 import { Button } from "@/components/ui/button"
 import { Star } from "lucide-react"
 
 export default function SupportProject() {
+  const handleClick = () => {
+    window.open("https://github.com/MacRimi/ProxMenux", "_blank")
+  }
+
   return (
     <section className="py-16 bg-gray-900">
       <div className="container mx-auto px-4 text-center">
@@ -11,10 +17,7 @@ export default function SupportProject() {
           others discover it!
         </p>
         <div className="flex justify-center items-center">
-          <Button
-            className="bg-yellow-400 text-gray-900 hover:bg-yellow-500"
-            onClick={() => window.open("https://github.com/MacRimi/ProxMenux", "_blank")}
-          >
+          <Button className="bg-yellow-400 text-gray-900 hover:bg-yellow-500" onClick={handleClick}>
             <Star className="mr-2" />
             Star on GitHub
           </Button>