From bdb444328b00beb85e8ab722478b6ab3a719df7f Mon Sep 17 00:00:00 2001 From: Daniel Flanagan Date: Tue, 16 Jan 2024 16:45:51 -0600 Subject: [PATCH] Crudded up, WIP menu for routine --- components/Nav.tsx | 19 ------------- deno.json | 26 ++++------------- fresh.gen.ts | 2 ++ islands/Admin.tsx | 35 ++++++++++++++++++++--- islands/Nav.tsx | 37 ++++++++++++++++++++++++ islands/TodoList.tsx | 67 +++++++++++++++++++++++++++++--------------- routes/_app.tsx | 2 +- routes/admin.tsx | 4 ++- routes/api/todo.ts | 1 + 9 files changed, 124 insertions(+), 69 deletions(-) delete mode 100644 components/Nav.tsx create mode 100644 islands/Nav.tsx diff --git a/components/Nav.tsx b/components/Nav.tsx deleted file mode 100644 index 06b0ca8..0000000 --- a/components/Nav.tsx +++ /dev/null @@ -1,19 +0,0 @@ -// 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 ( - - ) -} diff --git a/deno.json b/deno.json index 4fe499c..8e0d808 100644 --- a/deno.json +++ b/deno.json @@ -9,19 +9,10 @@ "preview": "deno run -A main.ts", "update": "deno run -A -r https://fresh.deno.dev/update ." }, - "lint": { - "rules": { - "tags": [ - "fresh", - "recommended" - ] - } - }, - "exclude": [ - "**/_fresh/*" - ], + "lint": { "rules": { "tags": ["fresh", "recommended"] } }, + "exclude": ["**/_fresh/*"], "imports": { - "$fresh/": "https://deno.land/x/fresh@1.6.1/", + "$fresh/": "https://deno.land/x/fresh@1.6.3/", "preact": "https://esm.sh/preact@10.19.2", "preact/": "https://esm.sh/preact@10.19.2/", "@preact/signals": "https://esm.sh/*@preact/signals@1.2.1", @@ -33,15 +24,8 @@ "$std/": "https://deno.land/std@0.208.0/", "@homeman/": "./" }, - "compilerOptions": { - "jsx": "react-jsx", - "jsxImportSource": "preact" - }, - "fmt": { - "useTabs": true, - "semiColons": false, - "singleQuote": true - }, + "compilerOptions": { "jsx": "react-jsx", "jsxImportSource": "preact" }, + "fmt": { "useTabs": true, "semiColons": false, "singleQuote": true }, "unstable": ["kv"], "nodeModulesDir": true } diff --git a/fresh.gen.ts b/fresh.gen.ts index 02ed8ab..c6d4592 100644 --- a/fresh.gen.ts +++ b/fresh.gen.ts @@ -15,6 +15,7 @@ import * as $Admin from './islands/Admin.tsx' import * as $Clock from './islands/Clock.tsx' import * as $Counter from './islands/Counter.tsx' import * as $Dashboard from './islands/Dashboard.tsx' +import * as $Nav from './islands/Nav.tsx' import * as $TodoList from './islands/TodoList.tsx' import { type Manifest } from '$fresh/server.ts' @@ -35,6 +36,7 @@ const manifest = { './islands/Clock.tsx': $Clock, './islands/Counter.tsx': $Counter, './islands/Dashboard.tsx': $Dashboard, + './islands/Nav.tsx': $Nav, './islands/TodoList.tsx': $TodoList, }, baseUrl: import.meta.url, diff --git a/islands/Admin.tsx b/islands/Admin.tsx index aaa5800..5838a6b 100644 --- a/islands/Admin.tsx +++ b/islands/Admin.tsx @@ -21,12 +21,23 @@ export interface Props { } async function promptDeleteUser(id: string, name: string) { - if (confirm(`Are you sure you want to delete ${name} (${id})?`)) { + if (confirm(`Are you sure you want to delete '${name}' (${id})?`)) { await fetch(`/api/user?id=${id}`, { method: 'DELETE' }) location.reload() } } +async function promptDeleteTodo(id: string, description: string) { + if (confirm(`Are you sure you want to delete '${description}' (${id})?`)) { + await fetch(`/api/todo`, { + method: 'DELETE', + headers: { 'content-type': 'application/json' }, + body: JSON.stringify({ id }), + }) + location.reload() + } +} + interface UserFormProps extends JSX.HTMLAttributes { onCancelButtonClicked: JSX.MouseEventHandler userData: User | null @@ -123,7 +134,7 @@ export function Admin({ users, todos }: Props) { + ))} diff --git a/islands/Nav.tsx b/islands/Nav.tsx new file mode 100644 index 0000000..5cf0199 --- /dev/null +++ b/islands/Nav.tsx @@ -0,0 +1,37 @@ +// import { JSX } from 'preact' +// import { IS_BROWSER } from '$fresh/runtime.ts' + +import { Bars3Outline } from 'preact-heroicons' +import { Clock } from '@homeman/islands/Clock.tsx' +import { Dialog } from '@homeman/components/Dialog.tsx' +import { useSignal } from '@preact/signals' + +export function Nav(/* props: {} */) { + const showMenu = useSignal(false) + return ( + <> + { + showMenu.value = false + }} + > + + + + ) +} diff --git a/islands/TodoList.tsx b/islands/TodoList.tsx index 3612a69..c1f21fb 100644 --- a/islands/TodoList.tsx +++ b/islands/TodoList.tsx @@ -2,6 +2,7 @@ import { Todo, UserWithTodos } from '@homeman/models.ts' import { JSX } from 'preact' import { Button } from '@homeman/components/Button.tsx' import { Avatar } from '@homeman/components/Avatar.tsx' +import { TrashSolid } from 'preact-heroicons' export interface Props { user: UserWithTodos @@ -16,49 +17,69 @@ export function TodoList( const doneTodos = user.assignedTodos.filter((t) => t.doneAt != null) const inProgressTodos = user.assignedTodos.filter((t) => t.doneAt == null) const todoItem = ( - { id, doneAt, className, description, hideDone }: + { id, doneAt, className, description, virtual }: & Pick & { className?: string - hideDone?: boolean + virtual?: boolean }, ) => (
  • {description} - {(hideDone || doneAt != null) ? '' : ( - - )} - {(!hideDone && doneAt != null) - ? ( +
    + {(virtual || doneAt != null) ? '' : ( - ) - : ''} + )} + {(!virtual && doneAt != null) + ? ( + + ) + : ''} + {virtual ? '' : ( + + )} +
  • ) return ( @@ -84,7 +105,7 @@ export function TodoList( doneAt: null, description: 'All clear! 🎉', className: 'text-center', - hideDone: true, + virtual: true, }) : inProgressTodos.map(todoItem)} diff --git a/routes/_app.tsx b/routes/_app.tsx index b41a3ec..bedd5e4 100644 --- a/routes/_app.tsx +++ b/routes/_app.tsx @@ -1,5 +1,5 @@ import { type PageProps } from '$fresh/server.ts' -import { Nav } from '@homeman/components/Nav.tsx' +import { Nav } from '@homeman/islands/Nav.tsx' export default function App({ Component }: PageProps) { return ( diff --git a/routes/admin.tsx b/routes/admin.tsx index 30ea3a3..c2387ff 100644 --- a/routes/admin.tsx +++ b/routes/admin.tsx @@ -4,7 +4,9 @@ import { Admin, Props } from '@homeman/islands/Admin.tsx' export const handler: Handlers = { async GET(_req, ctx) { - const users = await db.users.findMany({}) + const users = Object.fromEntries((await db.users.findMany({})).map( + (u) => [u.id, u], + )) const todos = await db.todos.findMany({}) return ctx.render({ users, todos }) }, diff --git a/routes/api/todo.ts b/routes/api/todo.ts index c8e52ef..55a9710 100644 --- a/routes/api/todo.ts +++ b/routes/api/todo.ts @@ -60,6 +60,7 @@ export const handler: Handlers = { } else { data = { id: new URL(req.url).searchParams.get('id') } } + console.log('delete todo data:', data) const todoData = TodoModel.pick({ id: true }).parse(data) const result = await db.todos.delete({ where: todoData }) return new Response(JSON.stringify(result))