redirect on login now works

This commit is contained in:
andrzej 2024-09-18 11:56:08 +02:00
parent 8a04297768
commit 9e807f8824
5 changed files with 69 additions and 54 deletions

View File

@ -6,28 +6,21 @@ import { loginSchema, LoginSchema } from 'app/login/schema';
import { NextResponse } from 'next/server'; import { NextResponse } from 'next/server';
export async function getJWTSecretKey<Uint8Array>() { export async function getJWTSecretKey<Uint8Array>() {
console.log('getJWTSecretKey called!')
const secret = process.env.JWT_SECRET const secret = process.env.JWT_SECRET
console.log('secret: ' + secret)
if (!secret) throw new Error("There is no JWT secret key") if (!secret) throw new Error("There is no JWT secret key")
console.log('encoding...')
try { try {
const enc: Uint8Array = new TextEncoder().encode(secret) const enc: Uint8Array = new TextEncoder().encode(secret)
console.log('enc')
return enc return enc
} catch (error) { } catch (error) {
console.error('aw shit: ' + error.message) throw new Error("failed to getJWTSecretKey", error.message)
} }
} }
export async function verifyJwt(token: string): Promise<JWTPayload | null> { export async function verifyJwt(token: string): Promise<JWTPayload | null> {
console.log('verifyJwt called for token: ' + token)
const key = await getJWTSecretKey()
console.log('key: ' + key)
const { payload } = await jwtVerify(token, key)
console.log('payload: ' + payload)
return payload
try { try {
const key = await getJWTSecretKey()
const { payload } = await jwtVerify(token, key)
return payload
} catch { } catch {
return null return null
} }

View File

@ -9,22 +9,22 @@ import { Button } from "@/components/ui/button";
import { redirect } from "next/navigation"; import { redirect } from "next/navigation";
import { loginSchema } from "./schema"; import { loginSchema } from "./schema";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useSearchParams } from "next/navigation";
import revalidate from "./revalidate";
import { useState } from "react";
import Link from "next/link";
export default function LoginForm() { export default function LoginForm() {
const router = useRouter() const router = useRouter()
const searchParams = useSearchParams()
const redirect = searchParams.get("from")
const form = useForm<z.infer<typeof loginSchema>>({ const form = useForm<z.infer<typeof loginSchema>>({
resolver: zodResolver(loginSchema), resolver: zodResolver(loginSchema),
}) })
const [submitted, setSubmitted] = useState(false)
const onSubmit = form.handleSubmit(async (data) => { const onSubmit = form.handleSubmit(async (data, event) => {
// const res = await login(data) event.preventDefault()
// if (res?.error) {
// toast({ title: "Whoops!", description: res.error })
// form.reset()
// } else {
// toast({ title: "login successful" })
// }
const res = await fetch('/api/auth/login', { const res = await fetch('/api/auth/login', {
method: 'POST', method: 'POST',
headers: { headers: {
@ -34,7 +34,10 @@ export default function LoginForm() {
}) })
if (res.status === 200) { if (res.status === 200) {
toast({ title: "login successful!" }) toast({ title: "login successful!" })
router.push('/submission') setSubmitted(true)
await revalidate(redirect)
router.refresh()
router.push(redirect)
} else { } else {
toast({ title: "login failed!" }) toast({ title: "login failed!" })
} }
@ -42,37 +45,41 @@ export default function LoginForm() {
return ( return (
<Form {...form}> <>
<form onSubmit={onSubmit}> {submitted ? <p>Logging in...</p> :
<FormField <Form {...form}>
control={form.control} <form onSubmit={onSubmit}>
name="email" <FormField
render={({ field }) => ( control={form.control}
<FormItem> name="email"
<FormLabel>Email Address</FormLabel> render={({ field }) => (
<FormControl> <FormItem>
<Input placeholder="email goes here" {...field} /> <FormLabel>Email Address</FormLabel>
</FormControl> <FormControl>
<FormMessage /> <Input placeholder="email goes here" {...field} />
</FormItem> </FormControl>
)} <FormMessage />
></FormField> </FormItem>
<FormField )}
control={form.control} ></FormField>
name="password" <FormField
render={({ field }) => ( control={form.control}
<FormItem> name="password"
<FormLabel>Password</FormLabel> render={({ field }) => (
<FormControl> <FormItem>
<Input placeholder="password goes here" type="password"{...field} /> <FormLabel>Password</FormLabel>
</FormControl> <FormControl>
<FormMessage /> <Input placeholder="password goes here" type="password"{...field} />
</FormItem> </FormControl>
)} <FormMessage />
></FormField> </FormItem>
<Button type="submit">SUBMIT</Button> )}
</form> ></FormField>
</Form> <Button type="submit">SUBMIT</Button>
</form>
</Form>
}
</>
) )
} }

View File

@ -0,0 +1,11 @@
"use server"
import { revalidatePath } from "next/cache"
export default async function revalidate(path: string) {
try {
revalidatePath(path)
return true
} catch (error) {
console.error(error)
return false
}
}

View File

@ -24,7 +24,7 @@ export default function GenrePickerInputCell(props: CellContext<any, any>) {
const genres = props.table.options.meta.genres const genres = props.table.options.meta.genres
const [isActive, setIsActive] = useState(false) const [isActive, setIsActive] = useState(false)
async function onSubmit({ genres }: { genres: number[] }) { async function onSubmit({ genres }: { genres: number[] }, event: Event) {
event.preventDefault() event.preventDefault()
const genresArray = genres.map((e) => { return { id: e } }) const genresArray = genres.map((e) => { return { id: e } })
console.log(`genres: ${genres}, genresArray: ${JSON.stringify(genresArray)}`) console.log(`genres: ${genres}, genresArray: ${JSON.stringify(genresArray)}`)

View File

@ -17,11 +17,13 @@ export default async function(request: NextRequest) {
// const url = `${process.env.NEXT_PUBLIC_BASE_URL}/login?redirect=${request.nextUrl.pathname + request.nextUrl.search}` // const url = `${process.env.NEXT_PUBLIC_BASE_URL}/login?redirect=${request.nextUrl.pathname + request.nextUrl.search}`
const url = request.nextUrl.clone() const url = request.nextUrl.clone()
url.pathname = "/login" url.pathname = "/login"
url.searchParams.set('from', request.nextUrl.pathname)
if (protectedRoutes.some(pattern => matchesWildcard(request.nextUrl.pathname, pattern))) { if (protectedRoutes.some(pattern => matchesWildcard(request.nextUrl.pathname, pattern))) {
const token = request.cookies.get('token') const token = request.cookies.get('token')
//NOTE - may need to add logic to return 401 for api routes //NOTE - may need to add logic to return 401 for api routes
if (!token) { if (!token) {
console.log("there is no jwt")
return NextResponse.redirect(url) return NextResponse.redirect(url)
} }
@ -34,12 +36,14 @@ export default async function(request: NextRequest) {
request.cookies.delete('token') request.cookies.delete('token')
return NextResponse.redirect(url) return NextResponse.redirect(url)
} }
} catch { } catch (error) {
//delete token (failsafe) //delete token (failsafe)
console.error("failed to very jwt", error.message)
request.cookies.delete('token') request.cookies.delete('token')
return NextResponse.redirect(url) return NextResponse.redirect(url)
} }
//TODO - TEST THIS BECAUSE IT PROBABLY DOESN'T WORK
//redirect from login if already logged in //redirect from login if already logged in
let redirectToApp = false let redirectToApp = false
if (request.nextUrl.pathname === "/login") { if (request.nextUrl.pathname === "/login") {