diff --git a/fresh.gen.ts b/fresh.gen.ts index 737e8d6..bc618a5 100644 --- a/fresh.gen.ts +++ b/fresh.gen.ts @@ -13,6 +13,7 @@ import * as $index from './routes/index.tsx' 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 $TodoList from './islands/TodoList.tsx' import { type Manifest } from '$fresh/server.ts' @@ -31,6 +32,7 @@ const manifest = { './islands/Admin.tsx': $Admin, './islands/Clock.tsx': $Clock, './islands/Counter.tsx': $Counter, + './islands/Dashboard.tsx': $Dashboard, './islands/TodoList.tsx': $TodoList, }, baseUrl: import.meta.url, diff --git a/islands/Dashboard.tsx b/islands/Dashboard.tsx new file mode 100644 index 0000000..eb0dd49 --- /dev/null +++ b/islands/Dashboard.tsx @@ -0,0 +1,146 @@ +import { Todo, User, UserWithTodos } from '@homeman/models.ts' +import { Signal, useSignal } from '@preact/signals' +import { TodoList } from '@homeman/islands/TodoList.tsx' +import { Dialog } from '@homeman/components/Dialog.tsx' +import { Label } from '@homeman/components/Label.tsx' +import { Input } from '@homeman/components/Input.tsx' +import { Avatar } from '@homeman/components/Avatar.tsx' +import { Button } from '@homeman/components/Button.tsx' +import { JSX } from 'preact' + +interface Props { + users: Record + unassignedTodos: Todo[] +} + +const unassignedUserPlaceholder: User = { + id: '', + createdAt: new Date(), + name: 'Shared', + avatarUrl: 'http://placekitten.com/512/512', + color: '888888', +} + +interface UserSelectButtonProps extends JSX.HTMLAttributes { + user: User +} + +function UserSelectButton( + { user: { id, avatarUrl, color }, ...props }: UserSelectButtonProps, +) { + const eid = `assigneeUserId_${id}` + return ( + <> + + + + ) +} + +export default function Dashboard({ users, unassignedTodos }: Props) { + const todoAssignUserId: Signal = useSignal(null) + const showAddTodoDialog = useSignal(false) + + const unassignedUser: UserWithTodos = { + ...unassignedUserPlaceholder, + assignedTodos: unassignedTodos, + } + + return ( +
+ showAddTodoDialog.value = false} + > +
+ + + Assignee +
    +
  • + +
    • + {Object.values(users).map( + (user, i) => { + return ( +
  • + +
    • + ) + }, + )} +
+ +
+ + +
+
+ +

+ Todos +

+
    +
  • + { + console.log('shared new') + showAddTodoDialog.value = true + todoAssignUserId.value = null + }} + user={unassignedUser} + /> +
    • + {Object.values(users).map((u) => ( +
  • + { + showAddTodoDialog.value = true + todoAssignUserId.value = u.id + }} + user={u} + /> +
    • + ))} +
+
+ ) +} diff --git a/islands/TodoList.tsx b/islands/TodoList.tsx index 73f7325..8a1f448 100644 --- a/islands/TodoList.tsx +++ b/islands/TodoList.tsx @@ -1,22 +1,17 @@ -import { Todo, User, UserWithTodos } from '@homeman/models.ts' +import { Todo, UserWithTodos } from '@homeman/models.ts' +import { JSX } from 'preact' import { Button } from '@homeman/components/Button.tsx' -import { Dialog } from '@homeman/components/Dialog.tsx' import { Avatar } from '@homeman/components/Avatar.tsx' -import { Signal, useSignal } from '@preact/signals' -import { Input } from '@homeman/components/Input.tsx' -import { Label } from '@homeman/components/Label.tsx' export interface Props { user: UserWithTodos - users: Record + onNewButtonClicked: JSX.MouseEventHandler } export function TodoList( - { users, user: { id, avatarUrl, assignedTodos, name, color } }: Props, + { onNewButtonClicked, user: { avatarUrl, assignedTodos, name, color } }: + Props, ) { - const todoAssignUserId: Signal = useSignal(null) - const showAddTodoDialog = useSignal(false) - const todoItem = ( { className, description, hideDone }: Pick & { className?: string @@ -35,79 +30,6 @@ export function TodoList( ) return (
- showAddTodoDialog.value = false} - > -
- - - Assignee -
    -
  • - - -
    • - {Object.entries(users).map(([id, { avatarUrl, color }]) => { - const eid = `assigneeUserId_${id}` - return ( -
  • - - -
    • - ) - })} -
- -
- - -
-
- diff --git a/routes/index.tsx b/routes/index.tsx index 77d8ba5..13c1710 100644 --- a/routes/index.tsx +++ b/routes/index.tsx @@ -1,57 +1,26 @@ import { Handlers, PageProps } from '$fresh/server.ts' import { db, Todo, User, UserWithTodos } from '@homeman/models.ts' -import { TodoList } from '@homeman/islands/TodoList.tsx' - -const unassignedUserPlaceholder: User = { - id: '', - createdAt: new Date(), - name: 'Shared', - avatarUrl: 'http://placekitten.com/512/512', - color: '888888', -} +import Dashboard from '@homeman/islands/Dashboard.tsx' interface Data { - users: UserWithTodos[] - allUsers: Record + users: Record unassignedTodos: Todo[] } export const handler: Handlers = { async GET(_req, ctx) { - const users = await db.users.findMany({ include: { assignedTodos: true } }) + const users = Object.fromEntries( + (await db.users.findMany({ include: { assignedTodos: true } })).map( + (u) => [u.id, u], + ), + ) const unassignedTodos = await db.todos.findMany({ where: { assigneeUserId: null }, }) - const allUsers: Data['allUsers'] = {} - for (const u of users) { - allUsers[u.id] = u - } - return ctx.render({ users, unassignedTodos, allUsers }) + return ctx.render({ users, unassignedTodos }) }, } -export default function Home( - { data: { users, unassignedTodos, allUsers } }: PageProps, -) { - const unassignedUser: UserWithTodos = { - ...unassignedUserPlaceholder, - assignedTodos: unassignedTodos, - } - return ( -
-

- Todos -

-
    -
  • - -
    • - {users.map((u) => ( -
  • - -
    • - ))} -
-
- ) +export default function Home({ data }: PageProps) { + return }