import type { Workerify } from '@workerify/lib';
import renderer from './renderer';
import type { Filter, Todo, TodoPayload } from './types';

async function todosRouter(workerify: Workerify, _options?: any) {
  const todos: Todo[] = [
    {
      id: `1`,
      value: 'Play with Htmx',
      status: 'checked',
    },
    {
      id: `2`,
      value: 'Ship Workerify',
      status: 'checked',
    },
    {
      id: `3`,
      value: 'Rewrite Hubpress with Htmx and Workerify',
      status: 'unchecked',
    },
  ];

  workerify.get('/api/todos', (request) => {
    // Parse query parameters from URL
    const url = new URL(request.url);
    const filterParam = url.searchParams.get('filter') as Filter | null;
    const filter: Filter = filterParam || 'all';

    // Filter todos based on the filter parameter
    let filteredTodos = todos;
    if (filter === 'unchecked') {
      filteredTodos = todos.filter((t) => t.status === 'unchecked');
    } else if (filter === 'checked') {
      filteredTodos = todos.filter((t) => t.status === 'checked');
    }

    return renderer.viewTodos({ todos: filteredTodos, filter });
  });

  workerify.post('/api/todos', (request, reply) => {
    if (!request.body || !request.body?.['todo']) {
      reply.status = 422;
    }

    const payload = request.body as unknown as TodoPayload;

    const todo = {
      id: `${Date.now()}`,
      value: payload.todo,
      status: 'unchecked' as const,
    };

    todos.reverse().push(todo);
    todos.reverse();

    reply.headers = {
      'HX-Trigger': 'todos:refresh',
    };
    return renderer.viewTodo({ todo, filter: 'all' });
  });

  workerify.put('/api/todos/:todoId/toggle-status', (request, reply) => {
    const id = request.params.todoId;
    const url = new URL(request.url);
    const filterParam = url.searchParams.get('filter') as Filter | null;
    const filter: Filter = filterParam || 'all';

    // Find the todo by id
    const todo = todos.find((t) => t.id === id);

    if (!todo) {
      reply.status = 404;
      return { error: 'Todo not found' };
    }

    // Toggle the status
    todo.status = todo.status === 'checked' ? 'unchecked' : 'checked';

    reply.headers = {
      'HX-Trigger': 'todos:refresh',
    };
    // Return the updated todo HTML for HTMX to replace
    return renderer.viewTodo({ todo, filter });
  });
}

export default todosRouter;