From a758c28fb0e3f7900995574e88bca2f0189faa89 Mon Sep 17 00:00:00 2001 From: Bailey Pumfleet Date: Mon, 29 Mar 2021 22:01:12 +0100 Subject: [PATCH] Custom login screen and error page --- pages/api/auth/[...nextauth].tsx | 5 +++ pages/auth/error.tsx | 46 ++++++++++++++++++++++++++ pages/auth/login.tsx | 55 ++++++++++++++++++++++++++++++++ pages/index.tsx | 36 +++++++++++++++++---- 4 files changed, 135 insertions(+), 7 deletions(-) create mode 100644 pages/auth/error.tsx create mode 100644 pages/auth/login.tsx diff --git a/pages/api/auth/[...nextauth].tsx b/pages/api/auth/[...nextauth].tsx index ecc1ba9ffc..2b16e94c88 100644 --- a/pages/api/auth/[...nextauth].tsx +++ b/pages/api/auth/[...nextauth].tsx @@ -7,6 +7,11 @@ export default NextAuth({ session: { jwt: true }, + pages: { + signIn: '/auth/login', + signOut: '/auth/logout', + error: '/auth/error', // Error code passed in query string as ?error= + }, providers: [ Providers.Credentials({ name: 'Calendso', diff --git a/pages/auth/error.tsx b/pages/auth/error.tsx new file mode 100644 index 0000000000..889550c660 --- /dev/null +++ b/pages/auth/error.tsx @@ -0,0 +1,46 @@ +import { useRouter } from 'next/router'; +import Head from 'next/head'; +import Link from 'next/link'; + +export default function Error() { + const router = useRouter() + const { error } = router.query + + return ( +
+ + {error} - Calendso + + +
+ +
+
+
+ + + +
+
+ +
+

+ An error occurred when logging you in. Head back to the login screen and try again. +

+
+
+
+
+ + + Go back to the login page + + +
+
+
+
+ ); +} \ No newline at end of file diff --git a/pages/auth/login.tsx b/pages/auth/login.tsx new file mode 100644 index 0000000000..94b7e4b4f3 --- /dev/null +++ b/pages/auth/login.tsx @@ -0,0 +1,55 @@ +import Head from 'next/head'; +import { csrfToken } from 'next-auth/client'; + +export default function Login({ csrfToken }) { + return ( +
+ + Login + + +
+

+ Sign in to your account +

+
+ +
+
+
+ +
+ +
+ +
+
+ +
+ +
+ +
+
+ +
+ +
+
+
+
+
+ ) +} + +Login.getInitialProps = async (context) => { + return { + csrfToken: await csrfToken(context) + } +} \ No newline at end of file diff --git a/pages/index.tsx b/pages/index.tsx index b301340f24..c50b3e04d7 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -29,13 +29,35 @@ export default function Home() {
-

- Welcome to Calendso! -

- {!session && <> - Not signed in
- - } +
+
+ +
+
+
+ + + +
+
+ +
+

+ Sign into your account to manage your bookings and other settings. +

+
+
+
+
+ +
+
+
+
)