Reset password link broken for expo

[vbylen]

Feature request

Is your feature request related to a problem? Please describe.

When sending a reset password email:

const { data, error } = supabase.auth.api.resetPasswordForEmail('[email protected]')

the returned link looks like:

https://jwpgcjpssmjfggggeegqlz.supabase.co/auth/v1/verify?token=KqjDGb-JA1xpLbOpI-jyZQ&type=recovery&redirect_to=mymobileapp://resetpassword

This correctly opens the mobile app with path mymobileapp://resetpassword.

However, after the app is opened there is no way to access the query params token and type.

I'm using the following code to listen to the url:

function urlRedirect(url) {
    if(!url) return;
    let { path, queryParams } = Linking.parse(url);
}
Linking.addEventListener('url', event => {
    urlRedirect(event.url);
});

path returns 'resetpassword', queryParams returns null.

Describe the solution you'd like

Send a link in the following format:

mymobileapp://resetpassword?token=KqjDGb-JA1xpLbOpI-jyZQ&type=recovery

[kiwicopple]

Hey @10000multiplier - transfering this one to the gotrue-js library.

I think you're right, we should append any query params to the redirectTo URL before redirecting

[vbylen]

@kiwicopple thanks.

I'm going to try to submit a pull request.

I really want to use supabase in my react native app.

[vbylen]

Temporary fix:

Instead of redirecting the user to appname://, redirect them to your website and put this in a script tag:

<script>
    const url = window.location.href;
    const split = url.split('#');
    const queryP = split[1];
    const redirect = split[0].split(window.location.origin)[1];
    const myapp = 'appname://'
    const newUrl = myapp + redirect + '?' + queryP;
    window.location.replace(newUrl);
</script>

It works, but the UX would be better if we took the user to the app immediately, instead of needing them to go through the browser first.

[scarsam]

Did this ever get solved @10000multiplier?

[vbylen]

Did this ever get solved @10000multiplier?

@scarsam No I'm still redirecting to my website and manually transforming the url there.

[nainglynndw]

I am OK with that

function _handleOpenUrl(event) {
    const url = event.url.replace("#", "?");   // replace # with ?  to use parse
    const obj = Linking.parse(url);              //parse url
    const str = JSON.stringify(obj);            // JSON stringify to store in context storage
    setItem(str)                    //store in context storage ( in my case I store in asyncstorage )
  }

  useEffect(() => {
    Linking.addEventListener("url", _handleOpenUrl);
    return () => {
      Linking.removeEventListener("url", _handleOpenUrl);
    };
  }, []);

[hf]

Why do you need access to the token? @nainglynndw

(Given that this issue has been inactive for a while I'll close it but feel free to continue discussing or re-open it.)