Add next-auth for managing authentication; Implement sign-in and sign-up page; add auth guard; add swr for data fetching and validation.
Details:
Now all pages files are exported and set up as such for configuring whether the page requires auth or not to access to:
import { WithAuthentication } from '@/types/with-authentication/with-authentication.type'
const Home: WithAuthentication<NextPage> = () => {
//Content
}
Home.requiresAuthentication = true // Set this to false if the page doesn't require auth
export default Home
We have requiresAuthentication prop on the page component to configure it.
For the moment, all pages that require authentication will redirect to the sign-in page (/signin) if the user is not signed in. Theoretically, the auth should be configured as true for all dashboard pages.
Pages that don't require authentication will redirect to the app dashboard (/app) if the user is signed in. Theoretically, the auth should be configured as false for all auth pages like sign-in, sign-up, and forgot-password page.
The redirect can be changed in src/containers/AuthGuard/.
Access token, refresh token, and user info is already saved into the session using next-auth library, although I don't save all user info into the session for the moment, feel free to change the user info object if needed. The way to save it is declared on src/pages/api/auth/[...nextauth].ts, you also need to change the types on `types/next-auth.d.ts.
Other than the auth, I also added SWR for data fetching and mutation.
Add next-auth for managing authentication; Implement sign-in and sign-up page; add auth guard; add swr for data fetching and validation.
Details: Now all pages files are exported and set up as such for configuring whether the page requires auth or not to access to:
We have
requiresAuthentication
prop on the page component to configure it.For the moment, all pages that require authentication will redirect to the sign-in page (/signin) if the user is not signed in. Theoretically, the auth should be configured as
true
for all dashboard pages.Pages that don't require authentication will redirect to the app dashboard (/app) if the user is signed in. Theoretically, the auth should be configured as
false
for all auth pages like sign-in, sign-up, and forgot-password page.The redirect can be changed in
src/containers/AuthGuard/
.Access token, refresh token, and user info is already saved into the session using next-auth library, although I don't save all user info into the session for the moment, feel free to change the user info object if needed. The way to save it is declared on
src/pages/api/auth/[...nextauth].ts
, you also need to change the types on `types/next-auth.d.ts.Other than the auth, I also added SWR for data fetching and mutation.
Reference: https://swr.vercel.app/ https://next-auth.js.org/ https://github.com/nextauthjs/next-auth/issues/1210