feat: add email service and reset password flow

[jonkurtis]

addresses #12 for password reset flow. also add email service with invite and reset password email templates using resend and react-email.

[vercel]

@jonkurtis is attempting to deploy a commit to the leerob-site Team on Vercel.

A member of the Team first needs to authorize it.

[CharlesCCC]

This will be a great addition. I didn't seem how the email send out ? (Do we need config some sort of smtp or ?)

[patra0o]

Great work mate. Wondering about account verification though.
What if I just sign up with a fake mail address that I do not even own?

[CharlesCCC]

@patra0o +1. I think send verification email after sign-up will be a great addition too.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
next-saas-starter	❌ Failed (Inspect)			Dec 12, 2024 3:11am

[jonkurtis]

This will be a great addition. I didn't seem how the email send out ? (Do we need config some sort of smtp or ?)

it is setup to use Resend. You setup an account at Resend.com and add the api key as shown in .env.example

Resend was suggested as a good solution for this feature by @leerob here #12 (comment)

[jonkurtis]

Great work mate. Wondering about account verification though. What if I just sign up with a fake mail address that I do not even own?

thanks.
i think that may be beyond the scope of this PR as that addresses the original Sign Up setup by @leerob prior to this PR. If this gets merged or if @leerob wants it added to get it merged i can address.

[patra0o]

Hi @jonkurtis, I am testing out locally.
Plugged in my Resend api key. but I get [{"error":"Failed to send password reset email. Please try again."},"$K1"]
Is there something else I need to change?

[CharlesCCC]

I think this line should be

 resetPasswordLink: `${process.env.NEXT_PUBLIC_SITE_URL}/reset-password?token=${token}`

[dhiraj-das]

Hi there. Is there a problem with this PR. Can we please merge it. I really want the invite functionality

[AurelianSpodarec]

Why hasn't this be merged?

[syntaxsurge]

can someone please merge this? Thanks

[nlinc1905]

It would be convenient to add the Resend environment variables to lib/db/setup.ts so they are defined from the start. Perhaps add functions like:

async function getResendKey(): Promise<string> {
  console.log('Step 6: Getting Resend Secret Key');
  console.log('You can find your Resend API Key at: https://resend.com/api-keys');
  return await question('Enter your Resend API Key: ');
}

async function getResendEmail(): Promise<string> {
  console.log('Step 7: Getting Resend Secret Email');
  console.log('You can authorize your domain at: https://resend.com/api-keys');
  return await question('Enter an email address for an authorized domain: ');
}

And add them to main():

...
  const RESEND_API_KEY = await getResendKey();
  const RESEND_AUTHORIZED_EMAIL = await getResendEmail();
  const NEXT_PUBLIC_SITE_URL = 'http://localhost:3000';

  await writeEnvFile({
    POSTGRES_URL,
    STRIPE_SECRET_KEY,
    STRIPE_WEBHOOK_SECRET,
    BASE_URL,
    AUTH_SECRET,
    RESEND_API_KEY,
    RESEND_AUTHORIZED_EMAIL,
    NEXT_PUBLIC_SITE_URL,
  });

[nlinc1905]

For security, it might be better to put all of this in a try/catch, and show a generic error client-side so that hackers don't have an easy way to check if an email exists. The error could still be logged server-side for debugging, or use an environment variable for dev/prod to indicate whether it is safe to display it client-side.

Same thing with forgotPassword above.

[max-mapper]

I was able to rebase this PR again onto main but there was a big dashboard refactor since the last rebase and it was annoying. Would be best for everyone to merge this so it doesn't continue to get out of date