mirror of https://github.com/TZGyn/shortener
update login page to use superform
parent
68af735f09
commit
1b6a257e65
@ -0,0 +1,55 @@
|
||||
<script lang="ts">
|
||||
import * as Form from '$lib/components/ui/form'
|
||||
import { Input } from '$lib/components/ui/input'
|
||||
import { formSchema, type FormSchema } from '../schema'
|
||||
import {
|
||||
type SuperValidated,
|
||||
type Infer,
|
||||
superForm,
|
||||
} from 'sveltekit-superforms'
|
||||
import { zodClient } from 'sveltekit-superforms/adapters'
|
||||
import { toast } from 'svelte-sonner'
|
||||
|
||||
export let data: SuperValidated<Infer<FormSchema>>
|
||||
|
||||
const form = superForm(data, {
|
||||
validators: zodClient(formSchema),
|
||||
invalidateAll: 'force',
|
||||
resetForm: true,
|
||||
onResult: ({ result }) => {
|
||||
if (result.status === 200) {
|
||||
toast.success('Login success')
|
||||
}
|
||||
},
|
||||
onError: ({ result }) => {
|
||||
toast.error('Error Logging In')
|
||||
},
|
||||
})
|
||||
|
||||
const { form: formData, enhance } = form
|
||||
</script>
|
||||
|
||||
<form method="POST" use:enhance class="flex flex-col gap-4">
|
||||
<Form.Field {form} name="email" class="flex flex-col gap-2">
|
||||
<Form.Control let:attrs>
|
||||
<Form.Label>Email</Form.Label>
|
||||
<Input
|
||||
{...attrs}
|
||||
bind:value={$formData.email}
|
||||
placeholder="name@example.com" />
|
||||
</Form.Control>
|
||||
<Form.FieldErrors />
|
||||
</Form.Field>
|
||||
<Form.Field {form} name="password" class="flex flex-col gap-2">
|
||||
<Form.Control let:attrs>
|
||||
<Form.Label>Password</Form.Label>
|
||||
<Input
|
||||
{...attrs}
|
||||
type="password"
|
||||
bind:value={$formData.password}
|
||||
placeholder="••••••••" />
|
||||
</Form.Control>
|
||||
<Form.FieldErrors />
|
||||
</Form.Field>
|
||||
<Form.Button>Login</Form.Button>
|
||||
</form>
|
||||
@ -0,0 +1,54 @@
|
||||
import type { PageServerLoad, Actions } from './$types'
|
||||
import { fail } from '@sveltejs/kit'
|
||||
import { setError, superValidate } from 'sveltekit-superforms'
|
||||
import { formSchema } from './schema'
|
||||
import { zod } from 'sveltekit-superforms/adapters'
|
||||
import { db } from '$lib/db'
|
||||
import { user as userSchema } from '$lib/db/schema'
|
||||
import { eq } from 'drizzle-orm'
|
||||
import { lucia } from '$lib/server/auth'
|
||||
|
||||
export const load = (async (event) => {
|
||||
return {
|
||||
form: await superValidate(zod(formSchema)),
|
||||
}
|
||||
}) satisfies PageServerLoad
|
||||
|
||||
export const actions: Actions = {
|
||||
default: async (event) => {
|
||||
const form = await superValidate(event, zod(formSchema))
|
||||
if (!form.valid) {
|
||||
return fail(400, {
|
||||
form,
|
||||
})
|
||||
}
|
||||
|
||||
const users = await db
|
||||
.select()
|
||||
.from(userSchema)
|
||||
.where(eq(userSchema.email, form.data.email))
|
||||
|
||||
const user = users[0]
|
||||
|
||||
const matchPassword =
|
||||
user &&
|
||||
(await Bun.password.verify(form.data.password, user.password))
|
||||
|
||||
if (!user || !matchPassword) {
|
||||
return setError(form, 'email', 'Invalid credentials')
|
||||
}
|
||||
|
||||
const session = await lucia.createSession(user.id, {})
|
||||
const sessionCookie = lucia.createSessionCookie(session.id)
|
||||
|
||||
event.cookies.set(sessionCookie.name, sessionCookie.value, {
|
||||
...sessionCookie.attributes,
|
||||
path: '/',
|
||||
secure: Bun.env.APP_ENV === 'prod',
|
||||
})
|
||||
|
||||
return {
|
||||
form,
|
||||
}
|
||||
},
|
||||
}
|
||||
@ -1,8 +1,8 @@
|
||||
import { z } from 'zod'
|
||||
|
||||
export const formSchema = z.object({
|
||||
email: z.string().email(),
|
||||
password: z.string().min(8),
|
||||
email: z.string(),
|
||||
password: z.string(),
|
||||
})
|
||||
|
||||
export type FormSchema = typeof formSchema
|
||||
|
||||
@ -1,52 +0,0 @@
|
||||
import type { RequestHandler } from './$types'
|
||||
import { user as userSchema } from '$lib/db/schema'
|
||||
import { db } from '$lib/db'
|
||||
import { eq } from 'drizzle-orm'
|
||||
import { userLoginSchema } from '$lib/server/types'
|
||||
import { lucia } from '$lib/server/auth'
|
||||
|
||||
export const GET: RequestHandler = async () => {
|
||||
return new Response()
|
||||
}
|
||||
|
||||
export const POST: RequestHandler = async (event) => {
|
||||
const body = await event.request.json()
|
||||
|
||||
const userLogin = userLoginSchema.safeParse(body)
|
||||
|
||||
if (!userLogin.success) {
|
||||
return new Response(
|
||||
JSON.stringify({
|
||||
success: false,
|
||||
}),
|
||||
)
|
||||
}
|
||||
|
||||
const users = await db
|
||||
.select()
|
||||
.from(userSchema)
|
||||
.where(eq(userSchema.email, userLogin.data.email))
|
||||
|
||||
const user = users[0]
|
||||
const matchPassword =
|
||||
user &&
|
||||
(await Bun.password.verify(
|
||||
userLogin.data.password,
|
||||
user.password,
|
||||
))
|
||||
|
||||
if (user && matchPassword) {
|
||||
const session = await lucia.createSession(user.id, {})
|
||||
const sessionCookie = lucia.createSessionCookie(session.id)
|
||||
|
||||
event.cookies.set(sessionCookie.name, sessionCookie.value, {
|
||||
...sessionCookie.attributes,
|
||||
path: '/',
|
||||
secure: Bun.env.APP_ENV === 'prod',
|
||||
})
|
||||
|
||||
return new Response(JSON.stringify({ success: true }))
|
||||
} else {
|
||||
return new Response(JSON.stringify({ success: false }))
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue