How to track auth events in Supabase?

 

Step 1: Set Up Your Supabase Project

 

• Go to the Supabase website and sign in to your account.
• Create a new project by clicking the "New Project" button.
• Fill in the details like your project name, organization, and region, then click "Create New Project".
• Once the project is created, you will be taken to the project dashboard.

 

Step 2: Configure Database

 

• In the Supabase dashboard, navigate to the "Database" section.
• Click on the "Tables" tab to create a new table to store your auth events.
• Click "New Table" and set a name for the table, e.g., auth_events.
• Define the columns for your table:
• id: UUID, Primary Key
• user_id: UUID
• event_type: Text
• timestamp: Timestamp
• Save the changes to create the table.

 

Step 3: Setup Supabase Functions

 

• In the Supabase dashboard, navigate to the "SQL" section.
• Click "New Query" to write and execute a SQL function that will be triggered on auth events.

CREATE OR REPLACE FUNCTION log_auth_event()
RETURNS TRIGGER AS $$
BEGIN
  INSERT INTO auth_events (user_id, event_type, timestamp)
  VALUES (NEW.id, TG_ARGV[0], NOW());
  RETURN NEW;
END;
$$ LANGUAGE plpgsql;

• Execute the function query to create the function in the database.

 

Step 4: Configure Triggers for Auth Events

 

• In the same "SQL" section, create triggers that call this function for relevant auth events.

-- Trigger on signup event
CREATE TRIGGER on_signup
AFTER INSERT ON auth.users
FOR EACH ROW EXECUTE FUNCTION log_auth_event('signup');

-- Trigger on delete event
CREATE TRIGGER on_delete
AFTER DELETE ON auth.users
FOR EACH ROW EXECUTE FUNCTION log_auth_event('delete');

• Execute these queries to set up the triggers for your events.

 

Step 5: Access the Auth Event Data

 

• Navigate back to the "Database" section and select your auth_events table.
• Here, you can view and query all tracked auth events as they occur.

SELECT * FROM auth_events ORDER BY timestamp DESC;

• Use this to monitor or analyze user authentication activity.

 

Step 6: Integrate Event Tracking in Your Application

 

• Use Supabase's JavaScript client or any other client library supported by Supabase in your application to write signup and delete operations.
• Ensure you are importing the supabase client in your project. If you haven't installed the client, use npm to install it:

npm install @supabase/supabase-js

• Implement basic auth operations in your app which will, in turn, trigger the events:

import { createClient } from '@supabase/supabase-js'

const supabaseUrl = 'your-supabase-url'
const supabaseAnonKey = 'your-anon-key'
const supabase = createClient(supabaseUrl, supabaseAnonKey)

// Sign up a new user
const signUpUser = async (email, password) => {
  const { user, session, error } = await supabase.auth.signUp({
    email: email,
    password: password
  })
  
  if (error) console.error('Error signing up:', error)
  else console.log('User signed up:', user)
}

// Delete a user
const deleteUser = async () => {
  const user = supabase.auth.user()

  if (user) {
    const { error } = await supabase.auth.api.deleteUser(user.id, supabase.config.jwtSecret)

    if (error) console.error('Error deleting user:', error)
    else console.log('User deleted')
  }
}

• Once you perform these actions in your app, the corresponding auth events should be logged in your auth_events table.