afraid-scarlet•7mo ago

Supabase authentication with refinenative

Hi, I am trying to build a mobile application with react native using the community package https://dev.to/abdellah711/refine-native-2p1d and I'm having trouble implementing supabase login page correctly. This is my authProvider.ts and the login function works but I have to submit the form twice. Each time when I log in the first time I'm redirected to the login page again and I'm only getting logged in when I submit the form for the second time.

DEV Community

Refine Native

What I built I build a library for Refine that allows users to use the power of Refine to...

authProvider.ts

4 Replies

kapa.ai•7mo ago

Hi @ahnaf. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Hmm, I don't know enough to give you a confident answer yet. The extracts provided do not contain specific information about implementing Supabase authentication with Refine Native or about the issue of having to submit the login form twice. However, I can guide you on how authentication is generally handled in Refine with Supabase based on the provided extracts. In Refine, the authProvider is an object used to authenticate and authorize users. It should have methods like login(), register(), etc., to manage authentication in your app. These methods should return a Promise and are accessible via hooks. Here is an example of how the authProvider is used in the App.tsx file:

<Refine  
 // ...  
 authProvider={authProvider}  
/>

<Refine  
 // ...  
 authProvider={authProvider}  
/>

And here is an example of how the login page is set up:

<Route  
 path="/login"  
 element={  
 <AuthPage  
 type="login"  
 providers={[  
 {  
 name: "github",  
 icon: (  
 <GithubOutlined  
 style={{  
 fontSize: "18px",  
 }}  
 />  
 ),  
 label: "Sign in with GitHub",  
 },  
 ]}  
 />  
 }  
/>

<Route  
 path="/login"  
 element={  
 <AuthPage  
 type="login"  
 providers={[  
 {  
 name: "github",  
 icon: (  
 <GithubOutlined  
 style={{  
 fontSize: "18px",  
 }}  
 />  
 ),  
 label: "Sign in with GitHub",  
 },  
 ]}  
 />  
 }  
/>

For more detailed information, you might want to check the Refine documentation (https://refine.dev/docs) or the Refine blog (https://refine.dev/blog) for specific guides and tutorials. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•7mo ago

<@543682490951532554> kapa.ai is still learning and improving, please let us know how it did by reacting below

flat-fuchsia•7mo ago

@ahnaf hmm, maybe you can open issue on here https://github.com/abdellah711/refinenative for faster response. It seems login.redirecTo not work in react native router

GitHub

GitHub - abdellah711/refinenative: Build mobile and web apps 3x fas...

Build mobile and web apps 3x faster using refine and React native - abdellah711/refinenative

afraid-scarlet•7mo ago

Thanks will do