This is my first time trying to use Supabase and I...
# help
s
This is my first time trying to use Supabase and I have no experience with the backend, so this may be a dumb question. I'm trying to link my front end app to my DB with a magic link.
n
Hello @Sojo! This thread has been automatically created from your message in #843999948717555735 a few seconds ago. We have already mentioned the @User so that they can see your message and help you as soon as possible! Want to unsubscribe from this thread? Right-click the thread in Discord (or use the ``...`` menu) and select "Leave Thread" to unsubscribe from future updates. Want to change the title? Use the ``/title`` command! We have solved your problem? Click the button below to archive it.
o
Hi it's okay, there is no dumb question! What's your question? @Sojo
s
One sec, getting a couple screenshots
Didn't mean to send the message quite yet
I took the code show directly from the magic link documentation. When I attempt the handleLogin() function I get this error.
I'm also getting a type error in my IDE
My supabase.ts file is:
Copy code
import { createClient } from "@supabase/supabase-js";

const url = "//wrcndqewygkgrvvjlmdf.supabase.co";
const key = //redacted

export const supabase = function () {
  if (url && key) {
    console.log("client created...");
    return createClient(url, key);
  } else {
    console.log("Error: No Supabase URL or Key found");
  }
};
Oh, and if it's relavent, I'm using Next.js
s
Remove the
//
from the
url
My guess is an instance of the supabase client isn't being created due to the url being incorrect.
s
Same messages still showing unfortunately.
I was able to get the next.js example todo project up and running, so I don't think the issue is my Supabase config
I think the line of code should have been
const url = "https://wrcndqewygkgrvvjlmdf.supabase.co";
s
Ah now I see the issue, the supabase you are exporting is a function, so you need to call it as a function when using it
Copy code
ts
supabase().auth.signIn
s
Aha!
s
If you don't want to have to do that, you can self invoke the function on creation instead and then you can freely use
supabase
without it being a function call.
Copy code
ts
export const supabase = (function () {
  if (url && key) {
    console.log("client created...");
    return createClient(url, key);
  } else {
    console.log("Error: No Supabase URL or Key found");
  }
})();
s
That seems to do the trick, but now I'm getting the the message "You must provide either an email, phone number, a third-party provider or OpenID Connect."
s
I also think the supabase library itself already has checks for url and key, so you don't really need to be doing this in your code. You can just create the client and pass it to the const.
Copy code
ts
export const supabase = createClient(url, key);
s
Yeah, I originally was passing in Next.js env variables and wanted those checks just in case.
But then I hard coded them
s
You are getting an error because you aren't passing an email to the
signIn
function.
Yeah the checks aren't necessary, the supabase client won't work if those values are present and it will throw an error You can see that from the code here https://github.com/supabase/supabase-js/blob/master/src/SupabaseClient.ts#L71-L72
s
Ok, I think that works now!
Just had to change it to
supabase.auth.signIn({ email: userEmail });
Thank you so much!
s
You're welcome