Feb 17, 2022 · Feb 16, 2022 · Feb 16, 2022 · Feb 16, 2022
diff --git a/site/components/SignIn/SignInForm.test.tsx b/site/components/SignIn/SignInForm.test.tsx
    act(() => elem.click())

    // Then
    // Should redirect because login wassuccessfully
    // Should redirect because login wassuccessful
    await waitFor(() => expect(singletonRouter).toMatchObject({ asPath: "/" }))
  })

  it("respects ?redirect query parameter when complete", async () => {
    // Given
    const loginHandler = (_email: string, _password: string) => Promise.resolve()
    // Set a path to redirect to after login is successful
    mockRouter.setCurrentUrl("/login?redirect=%2Fsome%2Fother%2Fpath")

    // When
    // Render the component
    const { container } = render(<SignInForm loginHandler={loginHandler} />)
    // Set user / password
    const inputs = container.querySelectorAll("input")
    fireEvent.change(inputs[0], { target: { value: "test@coder.com" } })
    fireEvent.change(inputs[1], { target: { value: "password" } })
    // Click sign-in
    const elem = await screen.findByText("Sign In")
    act(() => elem.click())

    // Then
    // Should redirect to /some/other/path because ?redirect was specified and login was successful
    await waitFor(() => expect(singletonRouter).toMatchObject({ asPath: "/some/other/path" }))
  })
 })
diff --git a/site/components/SignIn/SignInForm.tsx b/site/components/SignIn/SignInForm.tsx
 import { makeStyles } from "@material-ui/core/styles"
 import { FormikContextType, useFormik } from "formik"
 import { useRouter } from "next/router"
 import {NextRouter,useRouter } from "next/router"
 import React from "react"
 import { useSWRConfig } from "swr"
 import * as Yup from "yup"
 import { FormTextField } from "../Form"
 import * as API from "./../../api"
 import { LoadingButton } from "./../Button"
 import { firstOrItem } from "../../util/array"

 /**
 * BuiltInAuthFormValues describes a form using built-in (email/password)
        await loginHandler(email, password)
        // Tell SWR to invalidate the cache for the user endpoint
        await mutate("/api/v2/users/me")
        await router.push("/")

        const redirect = getRedirectFromRouter(router)
        await router.push(redirect)
      } catch (err) {
        helpers.setFieldError("password", "The username or password is incorrect.")
      }
    </>
  )
 }

 const getRedirectFromRouter = (router: NextRouter) => {
  const defaultRedirect = "/"
  if (router.query?.redirect) {
    return firstOrItem(router.query.redirect, defaultRedirect)
  } else {
    return defaultRedirect
  }
 }
Original file line number	Diff line number	Diff line change
Expand Up		@@ -55,7 +55,29 @@ describe("SignInForm", () => {
		act(() => elem.click())

		// Then
		// Should redirect because login wassuccessfully
		// Should redirect because login wassuccessful
		await waitFor(() => expect(singletonRouter).toMatchObject({ asPath: "/" }))
		})

		it("respects ?redirect query parameter when complete", async () => {
		// Given
		const loginHandler = (_email: string, _password: string) => Promise.resolve()
		// Set a path to redirect to after login is successful
		mockRouter.setCurrentUrl("/login?redirect=%2Fsome%2Fother%2Fpath")

		// When
		// Render the component
		const { container } = render(<SignInForm loginHandler={loginHandler} />)
		// Set user / password
		const inputs = container.querySelectorAll("input")
		fireEvent.change(inputs[0], { target: { value: "test@coder.com" } })
		fireEvent.change(inputs[1], { target: { value: "password" } })
		// Click sign-in
		const elem = await screen.findByText("Sign In")
		act(() => elem.click())

		// Then
		// Should redirect to /some/other/path because ?redirect was specified and login was successful
		await waitFor(() => expect(singletonRouter).toMatchObject({ asPath: "/some/other/path" }))
		})
		})
Original file line number	Diff line number	Diff line change
		@@ -1,6 +1,6 @@
		import { makeStyles } from "@material-ui/core/styles"
		import { FormikContextType, useFormik } from "formik"
		import { useRouter } from "next/router"
		import {NextRouter,useRouter } from "next/router"
		import React from "react"
		import { useSWRConfig } from "swr"
		import * as Yup from "yup"
Expand All		@@ -9,6 +9,7 @@ import { Welcome } from "./Welcome"
		import { FormTextField } from "../Form"
		import * as API from "./../../api"
		import { LoadingButton } from "./../Button"
		import { firstOrItem } from "../../util/array"

		/**
		* BuiltInAuthFormValues describes a form using built-in (email/password)
Expand DownExpand Up		@@ -61,7 +62,9 @@ export const SignInForm: React.FC<SignInProps> = ({
		await loginHandler(email, password)
		// Tell SWR to invalidate the cache for the user endpoint
		await mutate("/api/v2/users/me")
		await router.push("/")

		const redirect = getRedirectFromRouter(router)
		await router.push(redirect)
		} catch (err) {
		helpers.setFieldError("password", "The username or password is incorrect.")
		}
Expand DownExpand Up		@@ -117,3 +120,12 @@ export const SignInForm: React.FC<SignInProps> = ({
		</>
		)
		}

		const getRedirectFromRouter = (router: NextRouter) => {
		const defaultRedirect = "/"
		if (router.query?.redirect) {
		return firstOrItem(router.query.redirect, defaultRedirect)
		} else {
		return defaultRedirect
		}
		}