Merge pull request #77 from marmelab/demo-invite-emails

[Demo] Configure local Supabase instance to support invitation and password reset out of the box
marmelab · Oct 24, 2024 · 796bb8d · 796bb8d
2 parents 49010e2 + 71f11ab
commit 796bb8d
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 9 deletions.
diff --git a/README.md b/README.md
@@ -59,11 +59,9 @@ If you need debug the backend, you can access the following services:
 
 ### Testing Invitations And Password Reset
 
-The current version of supabase CLI does not allow to customize the emails sent for invitation or password reset.
+When you invite a new user through the [Authentication dashboard](http://localhost:54323/project/default/auth/users), or reset a password through the [password reset form](http://localhost:8000/forgot-password), you can see the email sent in [Inbucket](http://localhost:54324/monitor).
 
-When you invite a new user through the [Authentication dashboard](http://localhost:54323/project/default/auth/users), you can see the email sent in [Inbucket](http://localhost:54324/monitor). Instead of clicking the link, copy it and change the `redirect_to` parameter from `http://localhost:8000` to `http://localhost:8000/auth-callback`.
-
-Apply the same process for password reset emails.
+Clicking the link inside the email will take you to the `/set-password` page where you can set or reset your password.
 
 ### Testing Third Party Authentication Providers
 

diff --git a/packages/ra-supabase/README.md b/packages/ra-supabase/README.md
@@ -257,9 +257,9 @@ In `{TYPE}.html` set the `auth-callback` redirection
 ```HTML
 <html>
   <body>
-   <h2>{TYPE_MESSAGE}</h2>
+    <h2>{TYPE_MESSAGE}</h2>
     <p><a href="{{ .ConfirmationURL }}/auth-callback.html">{TYPE_CTA}</a></p>
-
+  </body>
 </html>
 ```
 
@@ -336,14 +336,14 @@ In `invite.html` set the `auth-callback` redirection
 ```HTML
 <html>
   <body>
-   <h2>You have been invited</h2>
+    <h2>You have been invited</h2>
     <p>You have been invited to create a user on {{ .SiteURL }}. Follow this link to accept the invite:</p>
     <p><a href="{{ .ConfirmationURL }}/auth-callback">Accept the invite</a></p>
-
+  </body>
 </html>
 ```
 
-### Configuring an hosted Supabase instance
+#### Configuring an hosted Supabase instance
 
 1. Go to your dashboard **Authentication** section
 1. In **URL Configuration**, set **Site URL** to your application URL

diff --git a/supabase/config.toml b/supabase/config.toml
@@ -58,6 +58,14 @@ double_confirm_changes = true
 # If enabled, users need to confirm their email address before signing in.
 enable_confirmations = false
 
+[auth.email.template.invite]
+subject = "You have been invited"
+content_path = "./supabase/templates/invite.html"
+
+[auth.email.template.recovery]
+subject = "Reset Password"
+content_path = "./supabase/templates/recovery.html"
+
 # Use an external OAuth provider. The full list of providers are: `apple`, `azure`, `bitbucket`,
 # `discord`, `facebook`, `github`, `gitlab`, `google`, `keycloak`, `linkedin`, `notion`, `twitch`,
 # `twitter`, `slack`, `spotify`, `workos`, `zoom`.

diff --git a/supabase/templates/invite.html b/supabase/templates/invite.html
@@ -0,0 +1,7 @@
+<html>
+  <body>
+    <h2>You have been invited</h2>
+    <p>You have been invited to create a user on {{ .SiteURL }}. Follow this link to accept the invite:</p>
+    <p><a href="{{ .ConfirmationURL }}/auth-callback">Accept the invite</a></p>
+  </body>
+</html>
diff --git a/supabase/templates/recovery.html b/supabase/templates/recovery.html
@@ -0,0 +1,6 @@
+<html>
+  <body>
+    <h2>Reset Password</h2>
+    <p><a href="{{ .ConfirmationURL }}auth-callback">Reset your password</a></p>
+  </body>
+</html>