<script lang="ts">
  import Table from '$lib/data-table/Table.svelte'
  import type { Column } from '$lib/data-table/Table.svelte';
  import type { UserTodosPage } from "./+page";

  export let data: UserTodosPage;

  const cols: Column[] = [
      {
        field: "id",
        heading: "ID",
      },
      {
        field: "title",
        heading: "Title",
      },
      {
        field: "description",
        heading: "Description",
        sortable: false,
      },
      {
        field: "done",
        heading: "Done",
        type: "boolean",
      },
      {
        field: "created",
        heading: "Created",
        type: "date",
      },
      {
        field: "updated",
        heading: "Updated",
        type: "date",
      },
      {
        field: "finished",
        heading: "Finished",
        type: "date",
      },
  ];

  const table = {
    caption: `List of TODOs for user ${data.user.first_name} ${data.user.last_name}`,
    columns: cols,
    itemsEndpoint: `/api/todos/user/${data.user.id}/`,
    itemCountEndpoint: `/api/todos/user/${data.user.id}/total/`,
  };
</script>

<Table {...table} />
