diff --git a/next-tavla/src/Admin/scenarios/Login/components/Email.tsx b/next-tavla/src/Admin/scenarios/Login/components/Email.tsx index 4bd476129..9886b35fd 100644 --- a/next-tavla/src/Admin/scenarios/Login/components/Email.tsx +++ b/next-tavla/src/Admin/scenarios/Login/components/Email.tsx @@ -1,4 +1,4 @@ -import { PrimaryButton } from '@entur/button' +import { PrimaryButton, SecondaryButton } from '@entur/button' import { TextField } from '@entur/form' import { Heading3 } from '@entur/typography' import musk from 'assets/illustrations/Musk.png' @@ -8,8 +8,9 @@ import { SyntheticEvent } from 'react' import { useAuth } from '../hooks/useAuth' import { useFirebaseAuthError } from '../hooks/useFirebaseAuthError' import { UserError } from './UserError' +import { TLoginPage } from 'Admin/types/login' -function Email() { +function Email({ pushPage }: { pushPage: (page: TLoginPage) => void }) { const { error, setError, getTextFieldPropsForType } = useFirebaseAuthError() const { login } = useAuth() @@ -37,7 +38,7 @@ function Email() {
illustration Logg inn med e-post -
+ Logg inn + pushPage('reset')} + > + Glemt passord? +
) } diff --git a/next-tavla/src/Admin/scenarios/Login/components/ResetPassword.tsx b/next-tavla/src/Admin/scenarios/Login/components/ResetPassword.tsx new file mode 100644 index 000000000..9aa578e21 --- /dev/null +++ b/next-tavla/src/Admin/scenarios/Login/components/ResetPassword.tsx @@ -0,0 +1,59 @@ +import Image from 'next/image' +import musk from 'assets/illustrations/Musk.png' +import { Heading3, Paragraph } from '@entur/typography' +import { useFirebaseAuthError } from '../hooks/useFirebaseAuthError' +import { getAuth, sendPasswordResetEmail } from 'firebase/auth' +import { TextField } from '@entur/form' +import { UserError } from './UserError' +import { PrimaryButton } from '@entur/button' +import { SyntheticEvent } from 'react' +import { FirebaseError } from 'firebase/app' + +function ResetPassword({ popPage }: { popPage: () => void }) { + const { error, setError, getTextFieldPropsForType } = useFirebaseAuthError() + const auth = getAuth() + + const submitResetPassword = async (event: SyntheticEvent) => { + event.preventDefault() + + const data = event.currentTarget as unknown as { + email: HTMLInputElement + } + + const email = data.email.value + + try { + await sendPasswordResetEmail(auth, email) + popPage() + } catch (error: unknown) { + if (error instanceof FirebaseError) { + setError(error) + } + } + } + + return ( +
+ illustration + Glemt passord + + Skriv inn e-postadressen som du registrerte profilen din på, så + sender vi deg en lenke der du kan lage et nytt passord. + +
+ + + + + Send nytt passord + +
+ ) +} + +export { ResetPassword } diff --git a/next-tavla/src/Admin/scenarios/Login/index.tsx b/next-tavla/src/Admin/scenarios/Login/index.tsx index 39582c3c8..f8e29034d 100644 --- a/next-tavla/src/Admin/scenarios/Login/index.tsx +++ b/next-tavla/src/Admin/scenarios/Login/index.tsx @@ -6,6 +6,7 @@ import { DecodedIdToken } from 'firebase-admin/lib/auth/token-verifier' import { useState } from 'react' import { CreateUser } from './components/CreateUser' import { Email } from './components/Email' +import { ResetPassword } from './components/ResetPassword' import { Start } from './components/Start' import { useAuth } from './hooks/useAuth' import classes from './styles.module.css' @@ -63,7 +64,11 @@ function Login({ user }: { user: DecodedIdToken | null }) { )} - + ) @@ -72,9 +77,11 @@ function Login({ user }: { user: DecodedIdToken | null }) { function LoginPage({ pages, pushPage, + popPage, }: { pages: TLoginPage[] pushPage: (page: TLoginPage) => void + popPage: () => void }) { if (!pages) return @@ -82,9 +89,11 @@ function LoginPage({ switch (lastPage) { case 'email': - return + return case 'create': return + case 'reset': + return default: return } diff --git a/next-tavla/src/Admin/types/login.ts b/next-tavla/src/Admin/types/login.ts index 34c3ff122..26c78e561 100644 --- a/next-tavla/src/Admin/types/login.ts +++ b/next-tavla/src/Admin/types/login.ts @@ -1,4 +1,4 @@ -export type TLoginPage = 'start' | 'email' | 'create' +export type TLoginPage = 'start' | 'email' | 'create' | 'reset' export type TErrorType = 'email' | 'password' | 'repeat_password' | 'user'