This password reset topic has been well requested, as I was successful in implementing this procedure, thanks to a post from Christoph Emrich member of the community, I decided to make a Tutorial to help anyone who needs it.
Hello, I'm form Brazil, and I made a tutorial in Portugues, that I posted in our community.
I translated it below to record it here, for me it works perfectly... just follow this tutorial.
First, you must configure your Supabase as follows
In Autentication > URL Configuration em Site URL add your website, if it is in the free version of FF, replace it <appname> by your name app: https://<appname>.flutterflow.app/, As I'm on the Pro version, mine looked like below;
The Next step is;
Autentication > Email Template > (Tab) - "Reset Password"
Attention, here's the cat's leap...
Note that in my email script, there is an argument .ConfirmationURL that references the address you configured in the previous step and after the }} there is another argument that I called "passwordreset" this will be the name of your page, that you will create within your app, as supabase will create a token allowing you to access this page...
The next steps are in FF
Create a screen called passwordreset, the essential thing on this screen is to have a field where you will enter the new password and a button.
Create the following Custom Action with the name updateSupabasePassword following exactly the steps in the image below;
After clicking the button in step 7 you will go to a screen where the start of your code will be ready.
On this screen, click on "Copy to Editor" you will return to the Custom Action editor, paste the code below into it;
// Automatic FlutterFlow imports
import '/backend/schema/structs/index.dart';
import '/backend/supabase/supabase.dart';
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/actions/index.dart'; // Imports other custom actions
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom action code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!
import 'package:supabase/supabase.dart';
Future<bool> updateSupabasePassword(String newPassword) async {
// Add your function code here!
final response = await SupaFlow.client.auth
.updateUser(UserAttributes(password: newPassword));
if (response.user != null) {
return true;
} else {
return false;
}
}Click on Save and it should create a boolean output, which will let you know if the password change was successful = "true" or "false".
Now you can call this action on your "passwordreset" button on the screen
It should look like the screenshot below;
Remember to pass the new password parameter...
It worked really well here!
Hope this helps!😀