From c2852ae0a3f2240974bce7ba70ea4daaddfbd7dc Mon Sep 17 00:00:00 2001
From: Nick Cherry <nickcherryjiggz@gmail.com>
Date: Wed, 31 Jan 2024 19:47:34 -0500
Subject: [PATCH] fix sign in

---
 mobile/src/components/auth/Login.tsx | 73 ++++++++++++++++++++++++++++
 1 file changed, 73 insertions(+)
 create mode 100644 mobile/src/components/auth/Login.tsx

diff --git a/mobile/src/components/auth/Login.tsx b/mobile/src/components/auth/Login.tsx
new file mode 100644
index 0000000..13ead3e
--- /dev/null
+++ b/mobile/src/components/auth/Login.tsx
@@ -0,0 +1,73 @@
+import {
+  AuthClientError,
+  StatusAPIResponse,
+  useSignIn,
+} from '@farcaster/auth-kit';
+import { useAuth } from '@mobile/contexts/AuthProvider';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Linking, Pressable, Text, View } from 'react-native';
+
+import { Loader } from '../loader/Loader';
+
+export function Login() {
+  const { signIn } = useAuth();
+
+  const hasInitiatedConnectRef = useRef(false);
+  const hasStartedPollingRef = useRef(false);
+  const [isSigningIn, setIsSigningIn] = useState(false);
+
+  const {
+    connect,
+    isError: isConnectError,
+    reconnect,
+    signIn: startPolling,
+    url,
+  } = useSignIn({
+    onSuccess: useCallback(
+      (req: StatusAPIResponse) => {
+        signIn({
+          message: req.message!,
+          nonce: req.nonce!,
+          signature: req.signature!,
+        });
+      },
+      [signIn],
+    ),
+    onError: useCallback((error: AuthClientError | undefined) => {
+      console.error(error);
+    }, []),
+  });
+
+  const initiateConnect = useCallback(async () => {
+    setIsSigningIn(true);
+
+    if (!hasInitiatedConnectRef.current) {
+      hasInitiatedConnectRef.current = true;
+      console.log('connecting');
+      await connect();
+    } else if (isConnectError) {
+      console.log('reconnecting');
+      reconnect();
+    }
+  }, [connect, isConnectError, reconnect]);
+
+  useEffect(() => {
+    if (url && !hasStartedPollingRef.current) {
+      hasStartedPollingRef.current = true;
+      startPolling();
+      Linking.openURL(url);
+    }
+  }, [startPolling, url]);
+
+  return (
+    <Pressable onPress={initiateConnect}>
+      <View className="bg-fc-purple min-h-[60px] min-w-[120px]  flex-row items-center justify-center rounded-lg p-4">
+        {isSigningIn ? (
+          <Loader />
+        ) : (
+          <Text className="text-lg font-bold text-white">Login</Text>
+        )}
+      </View>
+    </Pressable>
+  );
+}