import { Button } from "@/components/ui/button";

export default function Home() {
  return (
    <Button>Click me</Button>
  );
}

import { InferRequestType,InferResponseType } from "hono";
import { useMutation, useQueryClient } from "@tanstack/react-query";

import { client } from "@/lib/hono"

type ResponseType = InferResponseType<typeof client.tasks[":id"]["$patch"]>;
type RequestType = InferRequestType<typeof client.tasks[":id"]["$patch"]>["json"];

interface UpdateTaskPayload {
  id: number;
  name?: string;
  done?: boolean;
  order?: number;
};

export const useUpdateTask = ( ) => {
  const queryClient = useQueryClient();

  const mutation = useMutation<
    ResponseType,
    Error,
    RequestType
  >({
    mutationFn: async (json) => {
      const response = await client.tasks[":id"]["$patch"]({
        json,
        param: { id: json.id },
      });
      return response.json();
    },
    onSuccess: () => {
      queryClient.invalidateQueries({ queryKey:["tasks"]});
    },
    onError: () => {
      console.log("task update failed");
    },
  });

  return mutation;  
}

import { useQuery } from "@tanstack/react-query";
import { client } from "@/lib/hono"

export const useGetTasksList = () => {
  const query = useQuery({
    queryKey: ["tasks" ],
    queryFn: async () => {
      const res = await client.tasks.$get();
      
      if(!res.ok){
        throw new Error("Failed to fetch tasks list");
      }

      const data  = await res.json();
      return data;
    },
  });

  return query;
};

import { hc } from "hono/client";
import { AppType } from "@/app/api/[[...route]]/route";

export const client = hc<AppType>('/api');

interface Task {
  id: number
  name: string
  done: boolean
  order: number
}

case "added": {
     return [
       ...tasks,
       {
         id: Date.now(),
         name: action.name,
         done: false,
         order: tasks.length,
       },
     ]
   }