mui / toolpad

Toolpad: Full stack components and low-code builder for dashboards and internal apps.
https://mui.com/toolpad/
MIT License
1.27k stars 283 forks source link

[core] Support magic links in `SignInPage` #4085

Closed bharatkashyap closed 1 week ago

bharatkashyap commented 1 month ago

Docs preview: https://deploy-preview-4085--mui-toolpad-docs.netlify.app/toolpad/core/react-sign-in-page/#magic-link

jakobmerrild commented 2 weeks ago

@bharatkashyap I was looking for any open issues w.r.t. supporting one-time passwords when using the credentials provider and found your issue. However, looking at the code in this PR it doesn't seem to solve that part of the issue. Do you have any plans to include support for one-time passwords in the credentials provider with this PR?

bharatkashyap commented 2 weeks ago

@bharatkashyap I was looking for any open issues w.r.t. supporting one-time passwords when using the credentials provider and found your issue. However, looking at the code in this PR it doesn't seem to solve that part of the issue. Do you have any plans to include support for one-time passwords in the credentials provider with this PR?

@jakobmerrild Not with this PR (I should edit the title of that issue) but the plan is to implement support for OTPs as an immediate follow up of this PR, including adding an example app. I'll create a separate issue: https://github.com/mui/toolpad/issues/4292

jakobmerrild commented 2 weeks ago

Sounds great!

jakobmerrild commented 2 weeks ago

Actually, looking at the new issue it sounds like you are planning to support one time codes sent to the user's email.

What I'm looking for is 2FA support via one-time passwords, basically an additional optional input field on the SignInPage.

bharatkashyap commented 2 weeks ago

Actually, looking at the new issue it sounds like you are planning to support one time codes sent to the user's email.

What I'm looking for is 2FA support via one-time passwords, basically an additional optional input field on the SignInPage.

Understood, that isn't part of the roadmap yet but feel free to open an issue/comment with your requirements on that issue!

jakobmerrild commented 2 weeks ago

Thanks for letting me know. I have opened an issue. In the mean time is there a way for me to create my own sign-in page and have it integrate with the Account component?

bharatkashyap commented 2 weeks ago

Thanks for letting me know. I have opened an issue. In the mean time is there a way for me to create my own sign-in page and have it integrate with the Account component?

Thanks for the detailed issue, I'll add it to the consideration for our future versions.

For the meantime, you could use the Account component separately like the demos in this page: https://mui.com/toolpad/core/react-account/ while building your own component for the sign in page.

jakobmerrild commented 2 weeks ago

Thanks! I managed to get it to work using your example and the basic page from authjs. Should then be able to just create a new custom page and pass it into the pages prop for the NextAuth I believe. Though I am curious why your example uses the signIn and signOut functions from next-auth/react instead the ones exported from auth.ts.

bharatkashyap commented 2 weeks ago

Though I am curious why your example uses the signIn and signOut functions from next-auth/react instead the ones exported from auth.ts.

This is because SignInPage is a client component - see https://authjs.dev/getting-started/migrating-to-v5#details

jakobmerrild commented 2 weeks ago

Gotcha! Thanks for all the help and sorry for spamming your PR 🙈