default value of showUI is true, removing friction

[shahbaz17]

The default value of showUI is true.

Making this PR, just to have a better onboarding experience.

You just need your user's email as a developer to get started with Magic.

Let me know, what you think of this?

Thanks

[netlify[bot]]

Deploy request for redwood-playground-auth accepted.

Accepted with commit fd80d9a3f17612f94974d3b420e6ef7190f01865

https://app.netlify.com/sites/redwood-playground-auth/deploys/608452f19da75500087716db

[Tobbe]

I approved the deploy preview, so it can be seen here now: https://deploy-preview-60--redwood-playground-auth.netlify.app/

[dthyresson]

@shahbaz17 You recommend not showing the modal

May I ask why?

For this demo app, it seems like having this info is useful to know that you'll get a confirmation email.

When you implement Magic in your app, then one of course has the option.

[shahbaz17]

Hi @dthyresson

I do recommend showing the pop-up UI, it gives users useful information on what to do.

What I suggest is not adding showUI:true to await logIn({ email, showUI: true }).

await client.auth.loginWithMagicLink({ email, showUI }) when written as await client.auth.loginWithMagicLink({ email }) still shows the pop-up UI, but If you don’t want that pop-up to be shown, you can pass showUI: false.

showUI is true by default.

The current deployed URL doesn't use showUI, but the pop-up could be seen when clicking the Sign-up or log in button.

It uses this function from Redwood.

[dthyresson]

Sorry, I am not sure if this is a PR for the playground sample app or for the RedwoodJS framework instead.

Do you suggest that showUI should default to true here? And then when implementing Magiclink auth you can just set it to false in the case you don't want to?

https://github.com/redwoodjs/redwood/blob/54108f13d79b533b0eb7da5acbb492eaca32cb26/packages/auth/src/authClients/magicLink.ts#L17

export const magicLink = (client: MagicLink): AuthClientMagicLink => {
  return {
    type: 'magicLink',
    client,
    login: async ({ email, showUI }) =>
      await client.auth.loginWithMagicLink({ email, showUI }),
    logout: async () => {
      await client.user.logout()
    },
    signup: async ({ email, showUI }) =>
      await client.auth.loginWithMagicLink({ email, showUI }),
    getToken: async () => await client.user.getIdToken(),
    getUserMetadata: async () =>
      (await client.user.isLoggedIn()) ? await client.user.getMetadata() : null,
  }
}

If so, let's close this PR and add an issue in https://github.com/redwoodjs/redwood/issues

Thanks!

[dthyresson]

Now I understand ;)

Actually, I take that back. Once the https://github.com/redwoodjs/redwood/blob/54108f13d79b533b0eb7da5acbb492eaca32cb26/packages/auth/src/authClients/magicLink.ts#L17 issue is addressed and merged into a release to default it to true, then we can update this example app to leave off showUI

[shahbaz17]

Thanks @dthyresson

This PR is for the playground-auth repo.

And there is nothing to change at the Redwood end, as it is already optional:

export interface AuthClientMagicLink extends AuthClient {
  login(options: { email: string; showUI?: boolean }): Promise<any>
}

https://github.com/redwoodjs/redwood/blob/54108f13d79b533b0eb7da5acbb492eaca32cb26/packages/auth/src/authClients/magicLink.ts#L9

But would love to see how others see it.