How do I insert Google OAuth data from Supabase signup into external table

228 Views Asked by At

my supabase login/signup with Google works fine and the data is being saved in auth.users(). But I am having issues also saving my user data eg email, id to an external table named "accounts". Here is how I did it for normal signup with email/password =>

const handleSignup = async (e) => {
    e.preventDefault();
  
    try {
      setIsLoading(true);
  
      const { data, user, error } = await supabase.auth.signUp({
        email: submitEmail,
        password: submitPassword,
        options: {
          shouldCreateUser: true,
        },
      });
  
      console.log("Signup response data:", data)

      // Ensure the user is authenticated and the session is established
      if (data) {
        setIsSignedUp(true);
  
        // Check if data.id is not null
        if (data && data.user && data.user.id) {
          // Insert user data into "accounts" table
          const { error: insertError } = await supabase
            .from('accounts')
            .insert({ id: data.user.id, email: submitEmail }, { returning: "minimal" });
  
          if (insertError) {
            console.error("Error inserting into accounts:", insertError.message);
          } else {
            console.log("Data inserted into accounts");
          }
        } else {
          console.error("Error: data.id is null, cannot insert into accounts.");
        }
      } else if (error) {
        console.error("Error signing up:", error.message);
      }
    } finally {
      setIsLoading(false);
    }
  };

This works fine. But when I try to do the same with Google =>

 const handleGoogleSignUp = async () => {
    setIsLoading(true);
    
    try {
      const { session, error } = await supabase.auth.signInWithOAuth({
        provider: "google",
        options: {
          shouldCreateUser: true,
          redirectTo: "http://localhost:5173/create/"
        }
      });
  
      // Check if session and error are null or not
      if (session === null && error === null) {
        // OAuth flow has not started yet, do nothing
        console.log("OAuth flow has not started yet.");
      } else {
        // OAuth flow has either succeeded or failed, handle accordingly
        console.log("OAuth flow started - Session.user:", session.user);
          
        if (session?.user) {
          const user = session.user;
          console.log("Session object:", user);
    
          // Insert user information into "accounts" table
          const { error: insertError } = await supabase
            .from('accounts')
            .insert({ id: user.id, email: user.email }, { returning: "minimal" });
    
          if (insertError) {
            console.error("Error inserting Google info into accounts:", insertError.message);
          } else {
            console.log("Google info inserted into accounts.");
          }
        } else if (error) {
          console.error("Error signing up with Google", error.message);
        }
      }
    } finally {
      setIsLoading(false);
    }
  };

I get this when I sign up enter image description here

Here is what is also being returned in the console => enter image description here so clearly session.user exists. I also tried catching the promise but to no avail.

Whats the best way to insert google data into an external table from auth.users()? I also tried creating a trigger in the supabase dashboard but that did not do the job for me either =>

-- Create a function that inserts a new row into the accounts table
create or replace function insert_account()
returns trigger as $$
begin
  -- Insert the user id, email, and role into the accounts table
  insert into accounts (id, email, role)
  values (new.id, new.email, new.role);

  -- Return the new row
  return new;
end;
$$ language plpgsql;

-- Create a trigger that calls the function after insert on auth.users()
create trigger insert_account_trigger
after insert on auth.users()
for each row
execute procedure insert_account();

How would you solve this?

0

There are 0 best solutions below