From 9524eff4f8f39134f45620bdb326572279371518 Mon Sep 17 00:00:00 2001 From: Andrew Valleteau Date: Wed, 4 Dec 2024 14:16:10 +0100 Subject: [PATCH] chore(docs): update user management next docs (#30849) * chore(docs): update user-management config toml --- .../nextjs-user-management/.env.example | 9 ++- .../.env.production.example | 6 ++ .../nextjs-user-management/README.md | 41 ++++++++-- .../supabase/config.toml | 76 ++++++++++++------- 4 files changed, 93 insertions(+), 39 deletions(-) create mode 100644 examples/user-management/nextjs-user-management/.env.production.example diff --git a/examples/user-management/nextjs-user-management/.env.example b/examples/user-management/nextjs-user-management/.env.example index e3a1289f58d1d..132444f96dd3b 100644 --- a/examples/user-management/nextjs-user-management/.env.example +++ b/examples/user-management/nextjs-user-management/.env.example @@ -1,4 +1,5 @@ -# Get these from your API settings: https://supabase.com/dashboard/project/_/settings/api - -NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co -NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key +# Thoses are the default development values +NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321/ +NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24iLCJleHAiOjE5ODM4MTI5OTZ9.CRXP1A7WOeoJeXxjNni43kdQwgnWNReilDMblYTn_I0 +NEXT_SITE_URL=http://localhost:3000 +NEXT_REDIRECT_URLS=http://localhost:3000/ diff --git a/examples/user-management/nextjs-user-management/.env.production.example b/examples/user-management/nextjs-user-management/.env.production.example new file mode 100644 index 0000000000000..5696ef254227b --- /dev/null +++ b/examples/user-management/nextjs-user-management/.env.production.example @@ -0,0 +1,6 @@ +# Get these from your API settings: https://supabase.com/dashboard/project/_/settings/api +NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co +NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key +# Get this from your Vercel project settings +NEXT_SITE_URL=https://..vercel.app/ +NEXT_REDIRECT_URLS=https://..vercel.app/,https://..vercel.app/** diff --git a/examples/user-management/nextjs-user-management/README.md b/examples/user-management/nextjs-user-management/README.md index 4b3b7a407a7d5..1ad490b39d88f 100644 --- a/examples/user-management/nextjs-user-management/README.md +++ b/examples/user-management/nextjs-user-management/README.md @@ -45,22 +45,47 @@ The `anon` key is your client-side API key. It allows "anonymous access" to your **_NOTE_**: The `service_role` key has full access to your data, bypassing any security policies. These keys have to be kept secret and are meant to be used in server environments and never on a client or browser. -### 4. Env vars +## Supabase details + +### Using a Remote Supabase Project -Create a file in this folder `.env.local` +1. Create or select a project on [Supabase Dashboard](https://supabase.com/dashboard). +2. Copy and fill the dotenv template `cp .env.production.example .env.production` +3. Link the remote project to your local environment: +```bash +SUPABASE_ENV=production npx supabase@latest link --project-ref ``` -NEXT_PUBLIC_SUPABASE_URL= -NEXT_PUBLIC_SUPABASE_ANON_KEY= + +3. Sync the configuration: + +```bash +SUPABASE_ENV=production npx supabase@latest config push ``` -Populate this file with your URL and Key. +4. Sync the database schema: -### 5. Run the application +```bash +SUPABASE_ENV=production npx supabase@latest db push +``` -Run the application: `npm run dev`. Open your browser to `https://localhost:3000/` and you are ready to go 🚀. +## Vercel Preview with Branching -## Supabase details +Supabase integrates seamlessly with Vercel's preview branches, giving each branch a dedicated Supabase project. This setup allows testing database migrations or service configurations safely before applying them to production. + +### Steps + +1. Ensure the Vercel project is linked to a Git repository. +2. Configure the "Preview" environment variables in Vercel: + + - `NEXT_PUBLIC_SUPABASE_URL` + - `NEXT_PUBLIC_SUPABASE_ANON_KEY` + +3. Create a new branch, make changes (e.g., update `max_frequency`), and push the branch to Git. + - Open a pull request to trigger Vercel + Supabase integration. + - Upon successful deployment, the preview environment reflects the changes. + +![Preview Checks](https://github.com/user-attachments/assets/db688cc2-60fd-4463-bbed-e8ecc11b1a39) ### Postgres Row level security diff --git a/examples/user-management/nextjs-user-management/supabase/config.toml b/examples/user-management/nextjs-user-management/supabase/config.toml index 0784def3a53e1..19f3156d01881 100644 --- a/examples/user-management/nextjs-user-management/supabase/config.toml +++ b/examples/user-management/nextjs-user-management/supabase/config.toml @@ -1,13 +1,14 @@ -# A string used to distinguish different Supabase projects on the same host. Defaults to the working -# directory name when running `supabase init`. +# A string used to distinguish different Supabase projects on the same host. Defaults to the +# working directory name when running `supabase init`. project_id = "nextjs-user-management" [api] +enabled = true # Port to use for the API URL. port = 54321 # Schemas to expose in your API. Tables, views and stored procedures in this schema will get API -# endpoints. public and storage are always included. -schemas = ["public", "graphql_public"] +# endpoints. `public` and `graphql_public` are included by default. +schemas = ["public"] # Extra schemas to add to the search_path of every request. extra_search_path = ["public", "extensions"] # The maximum number of rows returns from a view, table, or stored procedure. Limits payload size @@ -17,37 +18,44 @@ max_rows = 1000 [db] # Port to use for the local database URL. port = 54322 +# Port used by db diff command to initialize the shadow database. +shadow_port = 54320 # The database major version to use. This has to be the same as your remote database's. Run `SHOW # server_version;` on the remote database to check. -major_version = 14 +major_version = 15 [studio] # Port to use for Supabase Studio. port = 54323 -# Email testing server. Emails sent with the local dev setup are not actually sent - rather, they -# are monitored, and you can view the emails that would have been sent from the web interface. -[inbucket] -# Port to use for the email testing server web interface. -port = 54324 -smtp_port = 54325 -pop3_port = 54326 - [storage] # The maximum file size allowed (e.g. "5MB", "500KB"). file_size_limit = "50MiB" [auth] +enabled = true # The base URL of your website. Used as an allow-list for redirects and for constructing URLs used # in emails. -site_url = "http://localhost:3000" +site_url = "env(NEXT_SITE_URL)" # A list of *exact* URLs that auth providers are permitted to redirect to post authentication. -additional_redirect_urls = ["https://localhost:3000"] -# How long tokens are valid for, in seconds. Defaults to 3600 (1 hour), maximum 604,800 seconds (one -# week). +additional_redirect_urls = [ + # Will be localhost:3000 in development or the URL of your deployed app in production. + "env(NEXT_REDIRECT_URLS)", +] +# How long tokens are valid for, in seconds. Defaults to 3600 (1 hour), +# maximum 604,800 seconds (one week). jwt_expiry = 3600 +# If disabled, the refresh token will never expire. +enable_refresh_token_rotation = true +# Allows refresh tokens to be reused after expiry, up to the specified interval in seconds. +# Requires enable_refresh_token_rotation = true. +refresh_token_reuse_interval = 10 # Allow/disallow new user signups to your project. enable_signup = true +# Allow/disallow anonymous sign-ins to your project. +enable_anonymous_sign_ins = false +# Allow/disallow testing manual linking of accounts +enable_manual_linking = false [auth.email] # Allow/disallow new user signups via email to your project. @@ -56,7 +64,27 @@ enable_signup = true # addresses. If disabled, only the new email is required to confirm. double_confirm_changes = true # If enabled, users need to confirm their email address before signing in. -enable_confirmations = false +enable_confirmations = true +# If enabled, users will need to reauthenticate or have logged in recently to change their password. +secure_password_change = false +# Controls the minimum amount of time that must pass before sending another signup confirmation or password reset email. +max_frequency = "1m0s" +# Number of characters used in the email OTP. +otp_length = 6 +# Number of seconds before the email OTP expires (defaults to 1 hour). +otp_expiry = 3600 + +# Email testing server. Emails sent with the local dev setup are not actually sent - rather, they +# are monitored, and you can view the emails that would have been sent from the web interface. +[inbucket] +enabled = true +# Port to use for the email testing server web interface. +port = 54324 +# Uncomment to expose additional ports for testing user applications that send emails. +# smtp_port = 54325 +# pop3_port = 54326 +# admin_email = "admin@email.com" +# sender_name = "Admin" [auth.email.template.confirmation] subject = "Confirm Your Email" @@ -66,12 +94,6 @@ content_path = "./supabase/auth/email/confirmation.html" subject = "Your Magic Link" content_path = "./supabase/auth/email/magic-link.html" -# Use an external OAuth provider. The full list of providers are: `apple`, `azure`, `bitbucket`, -# `discord`, `facebook`, `github`, `gitlab`, `google`, `twitch`, `twitter`, `slack`, `spotify`. -[auth.external.apple] -enabled = false -client_id = "" -secret = "" -# Overrides the default auth provider URL. Used to support self-hosted gitlab, single-tenant Azure, -# or any other third-party OIDC providers. -url = "" +[storage.buckets.avatars] +public = false +allowed_mime_types = ["image/*"]