privy login finish with twitter handle

app/page.tsx

@@ -51,6 +51,31 @@ function Home() {
     document.documentElement.classList.toggle("dark", !darkMode);
   };
 
+  const postLoginAPI = async (usertag) => {
+    try {
+      const response = await fetch('https://vps.playpoolstudios.com/callfi/register_twitter_user.php?tag='+usertag);
+
+      if (!response.ok) {
+        throw new Error('Network response was not ok');
+      }
+
+      const data = await response.json();
+      console.log('API call successful:', data);
+    } catch (error) {
+      console.error('Error during API call:', error);
+    }
+  };
+
+  useEffect(() => {
+    if (ready && user) {
+      // Assuming user object contains twitter handle at user.profile.twitter
+      const username = user.twitter?.username ? `@${user.twitter.username}` : '@unknownUser';
+      if(username != "@unknownUser"){
+        postLoginAPI(username);
+      }
+    }
+  }, [ready, user]);
+
   return (
     <main className={`flex flex-col min-h-screen items-center justify-between ${darkMode ? "bg-gray-900 text-white" : "bg-white text-black"}`}>
       <header className="w-full flex justify-between items-center p-4 bg-gray-800 text-white">
@@ -59,10 +84,12 @@ function Home() {
           <button onClick={toggleDarkMode} className="bg-gray-700 hover:bg-gray-500 text-white font-bold py-2 px-4 rounded mr-2">
             {darkMode ? <SunIcon className="h-5 w-5 text-white" /> : <MoonIcon className="h-5 w-5 text-white" />}
           </button>
-          {ready && user ? (
+          {!ready ? (
+            <p>Loading...</p>
+          ) : user ? (
             <button onClick={logout} className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
-            Logout
-          </button>
+              Logout
+            </button>
           ) : (
             <button onClick={login} className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
               Login

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev -p 1876",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"