Lots of cleanup
This commit is contained in:
parent
041fd8bb21
commit
86ecb24eec
GPG key ID:
5B2020A0F9921EF4
44
components/Dialog.tsx
Normal file
44
components/Dialog.tsx
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
import { createRef, JSX } from 'preact'
|
||||
import { Button } from '@homeman/components/Button.tsx'
|
||||
import { useEffect } from 'preact/hooks'
|
||||
|
||||
interface Props extends JSX.HTMLAttributes<HTMLDialogElement> {
|
||||
headerTitle: string
|
||||
show?: boolean
|
||||
}
|
||||
|
||||
export function Dialog(
|
||||
{ show, headerTitle, children, className, ...props }: Props,
|
||||
) {
|
||||
const self = createRef<HTMLDialogElement>()
|
||||
|
||||
useEffect(() => {
|
||||
if (show) {
|
||||
self.current?.showModal()
|
||||
} else {
|
||||
self.current?.close()
|
||||
}
|
||||
return () => {
|
||||
// cleanup
|
||||
}
|
||||
}, [show])
|
||||
|
||||
return (
|
||||
<dialog
|
||||
{...props}
|
||||
class={`rounded drop-shadow-lg backdrop:bg-stone-500/90 ${className}`}
|
||||
ref={self}
|
||||
>
|
||||
<header class='p-4 flex w-full items-center border-b-2 border-stone-500/20'>
|
||||
<h1 class='text-xl grow'>{headerTitle}</h1>
|
||||
<Button
|
||||
onClick={() => self.current?.close()}
|
||||
class='text-xl p-4 border-b-2 mr-4'
|
||||
>
|
||||
✕
|
||||
</Button>
|
||||
</header>
|
||||
{children}
|
||||
</dialog>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,26 +1,14 @@
|
|||
// import { JSX } from 'preact'
|
||||
// import { IS_BROWSER } from '$fresh/runtime.ts'
|
||||
|
||||
import { Bars3Outline } from 'preact-heroicons'
|
||||
import { Clock } from '@homeman/islands/Clock.tsx'
|
||||
|
||||
export function Nav(/* props: {} */) {
|
||||
return (
|
||||
<nav class='bg-stone-200 dark:bg-stone-800 flex justify-items-start items-center'>
|
||||
<button class='p-4 hover:bg-stone-500/20'>
|
||||
<svg
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
fill='none'
|
||||
viewBox='0 0 24 24'
|
||||
stroke-width='1.5'
|
||||
stroke='currentColor'
|
||||
class='w-6 h-6'
|
||||
>
|
||||
<path
|
||||
stroke-linecap='round'
|
||||
stroke-linejoin='round'
|
||||
d='M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5'
|
||||
/>
|
||||
</svg>
|
||||
<Bars3Outline class='h-6 w-6' />
|
||||
</button>
|
||||
<a class='p-4 hover:bg-stone-500/20' href='/'>
|
||||
Flanagan Family
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
import { Todo, UserWithTodos } from '@homeman/models.ts'
|
||||
import { Button } from '@homeman/components/Button.tsx'
|
||||
import { Dialog } from '@homeman/components/Dialog.tsx'
|
||||
import { createRef } from 'preact'
|
||||
|
||||
export interface Props {
|
||||
user: UserWithTodos
|
||||
|
|
@ -8,6 +10,7 @@ export interface Props {
|
|||
export function TodoList(
|
||||
{ user: { avatarUrl, assignedTodos, name, color } }: Props,
|
||||
) {
|
||||
const addTodoDialog = createRef<HTMLDialogElement>()
|
||||
const todoItem = (
|
||||
{ className, description, hideDone }: Pick<Todo, 'description'> & {
|
||||
className?: string
|
||||
|
|
@ -16,9 +19,9 @@ export function TodoList(
|
|||
) => (
|
||||
<li
|
||||
style={`border-color: #${color}`}
|
||||
class={`${
|
||||
className || ''
|
||||
} border-l-4 p-4 rounded drop-shadow-lg bg-white dark:bg-stone-900 flex flex-col`}
|
||||
class={`${className || ''} ${
|
||||
hideDone ? '' : 'border-l-4'
|
||||
} p-4 rounded drop-shadow-lg bg-white dark:bg-stone-900 flex flex-col`}
|
||||
>
|
||||
<span class='text-xl'>{description}</span>
|
||||
{hideDone ? '' : <Button class='mt-2'>Done</Button>}
|
||||
|
|
@ -26,6 +29,13 @@ export function TodoList(
|
|||
)
|
||||
return (
|
||||
<div class='p-2 w-1/4 min-w-[15rem] relative flex flex-col grow-0'>
|
||||
<Dialog
|
||||
headerTitle='Add todo'
|
||||
class='rounded drop-shadow-lg backdrop:bg-stone-500/90'
|
||||
ref={addTodoDialog}
|
||||
>
|
||||
sup
|
||||
</Dialog>
|
||||
<img
|
||||
class='rounded-full w-[15rem] h-[15rem] mb-2 object-cover'
|
||||
src={avatarUrl != null ? avatarUrl : 'https://placehold.co/512x512'}
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@
|
|||
"tailwindcss": "npm:tailwindcss@3.3.5",
|
||||
"tailwindcss/": "npm:/tailwindcss@3.3.5/",
|
||||
"tailwindcss/plugin": "npm:/tailwindcss@3.3.5/plugin.js",
|
||||
"preact-heroicons": "https://esm.sh/preact-heroicons@2.1.1",
|
||||
"$std/": "https://deno.land/std@0.208.0/",
|
||||
"@homeman/": "./"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
import { createRef } from 'preact'
|
||||
import { JSX } from 'preact'
|
||||
import { type Signal, useSignal } from '@preact/signals'
|
||||
import { Todo, User } from '@homeman/models.ts'
|
||||
import { Button } from '@homeman/components/Button.tsx'
|
||||
import { Input } from '@homeman/components/Input.tsx'
|
||||
import { Label } from '@homeman/components/Label.tsx'
|
||||
import { Dialog } from '@homeman/components/Dialog.tsx'
|
||||
import { PencilSquareOutline, TrashOutline } from 'preact-heroicons'
|
||||
|
||||
export interface Props {
|
||||
users: User[]
|
||||
todos: Todo[]
|
||||
users: Record<string, User>
|
||||
todos: Record<string, Todo>
|
||||
}
|
||||
|
||||
async function promptDeleteUser(id: string, name: string) {
|
||||
|
|
@ -17,39 +19,26 @@ async function promptDeleteUser(id: string, name: string) {
|
|||
}
|
||||
}
|
||||
|
||||
export function Admin({ users, todos }: Props) {
|
||||
const editUser: Signal<User | null> = useSignal(null)
|
||||
const addUserDialog = createRef<HTMLDialogElement>()
|
||||
const editUserDialog = createRef<HTMLDialogElement>()
|
||||
const usersById: Record<string, User> = {}
|
||||
for (const u of users) {
|
||||
usersById[u.id] = u
|
||||
}
|
||||
interface UserFormProps extends JSX.HTMLAttributes<HTMLFormElement> {
|
||||
onCancelButtonClicked: JSX.MouseEventHandler<HTMLButtonElement>
|
||||
userData: User | null
|
||||
}
|
||||
|
||||
function UserForm(
|
||||
{ onCancelButtonClicked, userData, ...props }: UserFormProps,
|
||||
) {
|
||||
return (
|
||||
<main class='flex flex-col'>
|
||||
<dialog
|
||||
class='rounded drop-shadow-lg backdrop:bg-stone-500/90'
|
||||
ref={addUserDialog}
|
||||
>
|
||||
<header class='p-4 flex w-full items-center border-b-2 border-stone-500/20'>
|
||||
<h1 class='text-xl grow'>Add user</h1>
|
||||
<Button
|
||||
onClick={() => addUserDialog.current?.close()}
|
||||
class='text-xl p-4 border-b-2 mr-4'
|
||||
>
|
||||
✕
|
||||
</Button>
|
||||
</header>
|
||||
<form
|
||||
{...props}
|
||||
class='p-4 gap-4 flex flex-col'
|
||||
action='/api/user'
|
||||
method='post'
|
||||
encType='multipart/form-data'
|
||||
onSubmit={() => console.log('Submitting new user...')}
|
||||
>
|
||||
{userData ? <Input type='hidden' name='id' value={userData.id} /> : <></>}
|
||||
<Label for='name'>
|
||||
Name
|
||||
<Input autofocus name='name' />
|
||||
<Input autofocus name='name' value={userData?.name} />
|
||||
</Label>
|
||||
<Label for='avatar'>
|
||||
Avatar
|
||||
|
|
@ -57,74 +46,51 @@ export function Admin({ users, todos }: Props) {
|
|||
</Label>
|
||||
<Label for='color'>
|
||||
Color
|
||||
<Input type='color' name='color' />
|
||||
<Input type='color' name='color' value={`#${userData?.color}`} />
|
||||
</Label>
|
||||
<footer class='flex justify-end gap-2'>
|
||||
<Button
|
||||
onClick={() => addUserDialog.current?.close()}
|
||||
>
|
||||
<Button type='button' onClick={onCancelButtonClicked}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Input type='submit' value='Save' />
|
||||
</footer>
|
||||
</form>
|
||||
</dialog>
|
||||
<dialog
|
||||
)
|
||||
}
|
||||
|
||||
export function Admin({ users, todos }: Props) {
|
||||
const showAddUserDialog = useSignal(false)
|
||||
const editUser: Signal<User | null> = useSignal(null)
|
||||
|
||||
return (
|
||||
<main class='flex flex-col'>
|
||||
<Dialog
|
||||
headerTitle='Add user'
|
||||
class='rounded drop-shadow-lg backdrop:bg-stone-500/90'
|
||||
ref={editUserDialog}
|
||||
show={showAddUserDialog.value}
|
||||
onClose={() => showAddUserDialog.value = false}
|
||||
>
|
||||
<header class='p-4 flex w-full items-center border-b-2 border-stone-500/20'>
|
||||
<h1 class='text-xl grow'>{`Edit '${editUser.value?.name}'`}</h1>
|
||||
<Button
|
||||
onClick={() => editUserDialog.current?.close()}
|
||||
class='text-xl p-4 border-b-2 mr-4'
|
||||
>
|
||||
✕
|
||||
</Button>
|
||||
</header>
|
||||
<form
|
||||
class='p-4 gap-4 flex flex-col'
|
||||
action='/api/user'
|
||||
// TODO:
|
||||
// Form contains enctype=multipart/form-data, but does not contain method=post.
|
||||
// Submitting normally with method=GET and no enctype instead.
|
||||
// possible workaround? https://stackoverflow.com/questions/50691938/patch-and-put-request-does-not-working-with-form-data
|
||||
method='put'
|
||||
encType='multipart/form-data'
|
||||
onSubmit={() => console.log('Submitting edit user...')}
|
||||
>
|
||||
<Input type='hidden' name='id' value={editUser.value?.id} />
|
||||
<Label for='name'>
|
||||
Name
|
||||
<Input autofocus name='name' value={editUser.value?.name} />
|
||||
</Label>
|
||||
<Label for='avatar'>
|
||||
Avatar
|
||||
<Input type='file' name='avatar' />
|
||||
</Label>
|
||||
<Label for='color'>
|
||||
Color
|
||||
<Input
|
||||
type='color'
|
||||
name='color'
|
||||
value={`#${editUser.value?.color}`}
|
||||
<UserForm
|
||||
onCancelButtonClicked={() => showAddUserDialog.value = false}
|
||||
userData={null}
|
||||
/>
|
||||
</Label>
|
||||
<footer class='flex justify-end gap-2'>
|
||||
<Button
|
||||
onClick={() => editUserDialog.current?.close()}
|
||||
</Dialog>
|
||||
<Dialog
|
||||
headerTitle={`Edit '${editUser.value?.name}'`}
|
||||
class='rounded drop-shadow-lg backdrop:bg-stone-500/90'
|
||||
show={!!editUser.value}
|
||||
onClose={() => editUser.value = null}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Input type='submit' value='Save' />
|
||||
</footer>
|
||||
</form>
|
||||
</dialog>
|
||||
<UserForm
|
||||
userData={editUser.value}
|
||||
onCancelButtonClicked={() => editUser.value = null}
|
||||
/>
|
||||
</Dialog>
|
||||
<header class='flex items-center border-b-2 border-stone-500/20 '>
|
||||
<h1 class='p-5 text-2xl'>
|
||||
Users ({users.length})
|
||||
</h1>
|
||||
<Button onClick={() => addUserDialog.current?.showModal()}>
|
||||
<Button onClick={() => showAddUserDialog.value = true}>
|
||||
Add User
|
||||
</Button>
|
||||
</header>
|
||||
|
|
@ -138,8 +104,8 @@ export function Admin({ users, todos }: Props) {
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{users.map((user) => {
|
||||
const { id, name, avatarUrl, color } = user
|
||||
{Object.entries(users).map(([id, user]) => {
|
||||
const { name, avatarUrl, color } = user
|
||||
return (
|
||||
<tr>
|
||||
<td>{name}</td>
|
||||
|
|
@ -157,43 +123,14 @@ export function Admin({ users, todos }: Props) {
|
|||
className='py-2 mr-2'
|
||||
onClick={() => promptDeleteUser(id, name)}
|
||||
>
|
||||
<svg
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
fill='none'
|
||||
viewBox='0 0 24 24'
|
||||
stroke-width='1.5'
|
||||
stroke='currentColor'
|
||||
class='w-6 h-6'
|
||||
>
|
||||
<path
|
||||
stroke-linecap='round'
|
||||
stroke-linejoin='round'
|
||||
d='m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0'
|
||||
/>
|
||||
</svg>
|
||||
<TrashOutline class='w-6 h-6' />
|
||||
</Button>
|
||||
<Button
|
||||
title='Edit'
|
||||
className='py-2'
|
||||
onClick={() => {
|
||||
editUser.value = user
|
||||
editUserDialog.current?.showModal()
|
||||
}}
|
||||
onClick={() => editUser.value = user}
|
||||
>
|
||||
<svg
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
fill='none'
|
||||
viewBox='0 0 24 24'
|
||||
stroke-width='1.5'
|
||||
stroke='currentColor'
|
||||
class='w-6 h-6'
|
||||
>
|
||||
<path
|
||||
stroke-linecap='round'
|
||||
stroke-linejoin='round'
|
||||
d='m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10'
|
||||
/>
|
||||
</svg>
|
||||
<PencilSquareOutline class='w-6 h-6' />
|
||||
</Button>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -205,7 +142,6 @@ export function Admin({ users, todos }: Props) {
|
|||
<h1 class='p-5 text-2xl'>
|
||||
Todos ({todos.length})
|
||||
</h1>
|
||||
<Button>+</Button>
|
||||
</header>
|
||||
<table class='border-separate [border-spacing:1.25rem] text-left'>
|
||||
<thead>
|
||||
|
|
@ -215,13 +151,15 @@ export function Admin({ users, todos }: Props) {
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{todos.map(({ description, assigneeUserId }) => (
|
||||
{Object.entries(todos).map((
|
||||
[_id, { description, assigneeUserId }],
|
||||
) => (
|
||||
<tr>
|
||||
<td>{description}</td>
|
||||
<td>
|
||||
{assigneeUserId == null
|
||||
? 'Unassigned'
|
||||
: usersById[assigneeUserId]?.name}
|
||||
: users[assigneeUserId]?.name}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
|
|
|
|||
|
|
@ -1,27 +1,64 @@
|
|||
import { Handlers } from '$fresh/server.ts'
|
||||
import { db, Todo, TodoModel } from '@homeman/models.ts'
|
||||
import { ulid } from 'https://deno.land/x/ulid@v0.3.0/mod.ts'
|
||||
import { z } from 'https://deno.land/x/zod@v3.21.4/mod.ts'
|
||||
|
||||
const TodoCreate = TodoModel.omit({ id: true, createdAt: true })
|
||||
const TodoPayload = TodoModel.partial({ id: true }).omit({ createdAt: true })
|
||||
type TodoPayload = z.infer<typeof TodoPayload>
|
||||
|
||||
async function createOrUpdate(todo: TodoPayload) {
|
||||
if (!todo.id) {
|
||||
const newTodo: Todo = { ...todo, id: ulid(), createdAt: new Date() }
|
||||
return await db.todos.create({ data: newTodo })
|
||||
} else {
|
||||
return await db.todos.update({ where: { id: todo.id }, data: todo })
|
||||
}
|
||||
}
|
||||
|
||||
export const handler: Handlers<Todo | null> = {
|
||||
async POST(req, _ctx) {
|
||||
const todo = TodoCreate.parse(await req.json())
|
||||
const newTodo: Todo = { ...todo, id: ulid(), createdAt: new Date() }
|
||||
const result = await db.todos.create({ data: newTodo })
|
||||
return new Response(JSON.stringify(result))
|
||||
},
|
||||
async PUT(req, _ctx) {
|
||||
const todo = TodoModel.parse(await req.json())
|
||||
const result = await db.todos.update({ data: todo })
|
||||
if (req.headers.get('content-type')?.includes('json')) {
|
||||
const result = await createOrUpdate(TodoPayload.parse(await req.json()))
|
||||
return new Response(JSON.stringify(result))
|
||||
} else {
|
||||
const form = await req.formData()
|
||||
const id = form.get('id')?.toString()
|
||||
|
||||
const doneAt = form.get('doneAt')
|
||||
console.log('todo POST doneAt:', doneAt)
|
||||
|
||||
const todo = TodoPayload.parse({
|
||||
id: id,
|
||||
emoji: form.get('emoji')?.toString(),
|
||||
description: form.get('description')?.toString(),
|
||||
assigneeUserId: form.get('assigneeUserId')?.toString(),
|
||||
})
|
||||
|
||||
if (!id) {
|
||||
delete todo.id
|
||||
}
|
||||
|
||||
await createOrUpdate(todo)
|
||||
|
||||
const url = new URL(req.url)
|
||||
url.pathname = '/admin'
|
||||
return Response.redirect(url, 303)
|
||||
}
|
||||
},
|
||||
async DELETE(req, _ctx) {
|
||||
const todoData = TodoModel.pick({ id: true }).parse(await req.json())
|
||||
// TODO: form or query params or json
|
||||
let data
|
||||
if (req.headers.get('content-type')?.includes('json')) {
|
||||
data = await req.json()
|
||||
} else {
|
||||
data = { id: new URL(req.url).searchParams.get('id') }
|
||||
}
|
||||
const todoData = TodoModel.pick({ id: true }).parse(data)
|
||||
const result = await db.todos.delete({ where: todoData })
|
||||
return new Response(JSON.stringify(result))
|
||||
},
|
||||
async GET(req, _ctx) {
|
||||
// TODO: json or query params
|
||||
const data = await req.json().catch(() => {})
|
||||
const todoData = TodoModel.pick({ id: true }).safeParse(data)
|
||||
if (todoData.success) {
|
||||
|
|
|
|||
|
|
@ -3,100 +3,65 @@ import { db, User, UserModel } from '@homeman/models.ts'
|
|||
import { ulid } from 'https://deno.land/x/ulid@v0.3.0/mod.ts'
|
||||
import { z } from 'https://deno.land/x/zod@v3.21.4/mod.ts'
|
||||
|
||||
const UserCreate = UserModel.omit({ id: true, createdAt: true })
|
||||
type UserCreate = z.infer<typeof UserCreate>
|
||||
const UserPayload = UserModel.partial({ id: true }).omit({ createdAt: true })
|
||||
type UserPayload = z.infer<typeof UserPayload>
|
||||
|
||||
export const handler: Handlers<User | null> = {
|
||||
async POST(req, _ctx) {
|
||||
// handle json or form posts
|
||||
let user: UserCreate
|
||||
let redirectInstead = false
|
||||
const newId = ulid()
|
||||
if (req.headers.get('content-type')?.includes('json')) {
|
||||
user = UserCreate.parse(req.json())
|
||||
} else {
|
||||
redirectInstead = true
|
||||
const form = await req.formData()
|
||||
const avatarFile = form.get('avatar') as File
|
||||
if (!avatarFile) {
|
||||
throw new Error('invalid avatar file')
|
||||
}
|
||||
|
||||
// validate png/jpg/webp?
|
||||
console.log(avatarFile.type)
|
||||
await Deno.mkdir('./static/uploads', { recursive: true })
|
||||
const name = `${newId}-${avatarFile.name.replaceAll('/', '')}`
|
||||
const localAvatarFile = await Deno.open(`./static/uploads/${name}`, {
|
||||
create: true,
|
||||
write: true,
|
||||
})
|
||||
await avatarFile.stream().pipeTo(localAvatarFile.writable)
|
||||
|
||||
user = UserCreate.parse({
|
||||
name: form.get('name')?.toString(),
|
||||
avatarUrl: `/uploads/${name}`,
|
||||
color: form.get('color')?.toString(),
|
||||
})
|
||||
}
|
||||
|
||||
// post processing
|
||||
async function createOrUpdate(user: UserPayload) {
|
||||
if (user.color && user.color[0] == '#') {
|
||||
user.color = user.color.substring(1)
|
||||
}
|
||||
|
||||
const newUser: User = { ...user, id: newId, createdAt: new Date() }
|
||||
const result = await db.users.create({ data: newUser })
|
||||
if (redirectInstead) {
|
||||
const url = new URL(req.url)
|
||||
url.pathname = '/admin'
|
||||
return Response.redirect(url, 303)
|
||||
if (!user.id) {
|
||||
const newUser: User = { ...user, id: ulid(), createdAt: new Date() }
|
||||
return await db.users.create({ data: newUser })
|
||||
} else {
|
||||
return new Response(JSON.stringify(result))
|
||||
return await db.users.update({ where: { id: user.id }, data: user })
|
||||
}
|
||||
},
|
||||
async PUT(req, _ctx) {
|
||||
// TODO: form or json
|
||||
const model = UserModel.omit({ createdAt: true }).partial({
|
||||
avatarUrl: true,
|
||||
})
|
||||
let user: z.infer<typeof model>
|
||||
let redirectInstead = false
|
||||
}
|
||||
|
||||
export const handler: Handlers<User | null> = {
|
||||
async POST(req, _ctx) {
|
||||
if (req.headers.get('content-type')?.includes('json')) {
|
||||
// TODO: ensure missing fields don't get set to null?
|
||||
user = model.parse(req.json())
|
||||
const result = await createOrUpdate(UserPayload.parse(await req.json()))
|
||||
return new Response(JSON.stringify(result))
|
||||
} else {
|
||||
redirectInstead = true
|
||||
const form = await req.formData()
|
||||
user = model.parse({
|
||||
id: form.get('id')?.toString(),
|
||||
name: form.get('name')?.toString(),
|
||||
avatarUrl: null,
|
||||
color: form.get('color')?.toString(),
|
||||
})
|
||||
const id = form.get('id')?.toString()
|
||||
|
||||
const avatarFile = form.get('avatar') as (File | null)
|
||||
if (!avatarFile) {
|
||||
user.avatarUrl =
|
||||
(await db.users.findFirst({ where: { id: user.id } })).avatarUrl
|
||||
} else {
|
||||
// validate png/jpg/webp?
|
||||
console.log(avatarFile.type)
|
||||
if (!avatarFile && !id) {
|
||||
throw new Error('invalid avatar file')
|
||||
}
|
||||
|
||||
const user = UserPayload.parse({
|
||||
id: id,
|
||||
name: form.get('name')?.toString(),
|
||||
color: form.get('color')?.toString(),
|
||||
avatarUrl: '',
|
||||
})
|
||||
if (!id) {
|
||||
delete user.id
|
||||
} else {
|
||||
const curUser = await db.users.findFirst({ where: { id: id } })
|
||||
user.avatarUrl = curUser.avatarUrl
|
||||
}
|
||||
|
||||
if (avatarFile) {
|
||||
await Deno.mkdir('./static/uploads', { recursive: true })
|
||||
const name = `${user.id}-${avatarFile.name.replaceAll('/', '')}`
|
||||
const name = `${id}-${avatarFile.name.replaceAll('/', '')}`
|
||||
const localAvatarFile = await Deno.open(`./static/uploads/${name}`, {
|
||||
create: true,
|
||||
write: true,
|
||||
})
|
||||
await avatarFile.stream().pipeTo(localAvatarFile.writable)
|
||||
}
|
||||
user.avatarUrl = `/uploads/${name}`
|
||||
}
|
||||
|
||||
const result = await db.users.update({ data: user })
|
||||
if (redirectInstead) {
|
||||
await createOrUpdate(user)
|
||||
|
||||
const url = new URL(req.url)
|
||||
url.pathname = '/admin'
|
||||
return Response.redirect(url, 303)
|
||||
} else {
|
||||
return new Response(JSON.stringify(result))
|
||||
}
|
||||
},
|
||||
async DELETE(req, _ctx) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue