To prompt users to change their email, you can use the updateEmail method from the usePrivy hook:Usage
import {usePrivy} from '@privy-io/react-auth';
const {updateEmail} = usePrivy();
When invoked, the method will open the Privy modal and guide the user through updating their existing email to a new one. If a user does not already have an email account and attempts to update it, Privy will throw an error indicating such.Example
import {usePrivy} from '@privy-io/react-auth';
function Page() {
const {ready, authenticated, user, updateEmail} = usePrivy();
return (
<button onClick={updateEmail} disabled={!ready || !authenticated || !user.email}>
Update your email
</button>
);
}
In the event that a user encounters an error through the flow, their existing account will be maintained.
To prompt users to change their phone number, you can use the updatePhone method from the usePrivy hook:Usage
import {usePrivy} from '@privy-io/react-auth';
const {updatePhone} = usePrivy();
When invoked, the method will open the Privy modal and guide the user through updating their existing phone number to a new one. If a user does not already have a phone account and attempts to update it, Privy will throw an error indicating such.Example
import {usePrivy} from '@privy-io/react-auth';
function Page() {
const {ready, authenticated, user, updatePhone} = usePrivy();
return (
<button onClick={updatePhone} disabled={!ready || !authenticated || !user.phone}>
Update your phone number
</button>
);
}
In the event that a user encounters an error through the flow, their existing account will be maintained.
Callbacks
To configure callbacks for Privy’s updateEmail and updatePhone methods, use the useUpdateAccount hook:useUpdateAccount: ({
onSuccess?: ({user, updateMethod, updatedAccount}) => void,
onError?: (error, details) => void
}) => {updateEmail: () => void, updatePhone: () => void}
Usage
import {useUpdateAccount} from '@privy-io/react-auth';
const {updateEmail, updatePhone} = useUpdateAccount({
onSuccess: ({user, updateMethod, updatedAccount}) => {
console.log(user, updateMethod, updatedAccount);
// Any logic you'd like to execute if the user successfully updates an account
},
onError: (error, details) => {
console.log(error, details);
// Any logic you'd like to execute after a user exits the updateAccount flow or there is an error
}
});
// Then call one of the update methods in your code, which will invoke these callbacks on completion
Parameters
The useUpdateAccount hook accepts an options object with the following fields:onSuccess
({user: User, updateMethod: string, updatedAccount: LinkedAccountType}) => void
Optional callback to run after a user successfully updates an account.
onError
(error: string, details: {updateMethod: string}) => void
Optional callback to run if there is an error during the update account flow, or if the user exits the flow prematurely.
Callback Details
onSuccess
If set, the onSuccess callback will execute after a user has successfully updated either their phone or email on their Privy account.Within this callback, you can access:The user object with the user’s DID, linked accounts, and more.
A string indicating the type of update flow just executed for the authenticated user.
Possible values are 'email' or 'sms'.
An object representing the account that was just updated on the authenticated user.
onError
If set, the onError callback will execute after a user initiates an update account attempt and there is an error, or if the user exits the update account flow prematurely.Within this callback, you can access:The error code with more information about the error.
A string indicating the type of update account flow just attempted for the authenticated user.