add example component

src/app/page.tsx

@@ -1,27 +1,12 @@
 "use client";
 
-import { addUser } from "./api/user/route.client";
+import ExampleButton from "@/components/ExampleButton";
 
 export default function Home() {
   return (
     <div className="flex items-center justify-center h-screen">
-      {/* Test Button */}
-      <button
-        className="bg-slate-700 text-white p-4 rounded-full"
-        onClick={async () => {
-          const response = await addUser({
-            body: {
-              user: {
-                firstName: "Johnny",
-                email: "[email protected]",
-              },
-            },
-          });
-          console.log(response);
-        }}
-      >
-        Add User
-      </button>
+      {/* Example Button (ExampleButton.tsx in components folder) */}
+      <ExampleButton buttonText="Add User" />
     </div>
   );
 }

src/components/ExampleButton.tsx

@@ -0,0 +1,28 @@
+import { addUser } from "@/app/api/user/route.client";
+
+interface ExampleButtonProps {
+  buttonText: string;
+}
+
+const ExampleButton = ({ buttonText }: ExampleButtonProps) => {
+  return (
+    <button
+      className="bg-slate-700 text-white p-4 rounded-full"
+      onClick={async () => {
+        const response = await addUser({
+          body: {
+            user: {
+              firstName: "Johnny",
+              email: "[email protected]",
+            },
+          },
+        });
+        console.log(response);
+      }}
+    >
+      {buttonText}
+    </button>
+  );
+};
+
+export default ExampleButton;