refactor

src/services/todolists/index.ts

@@ -0,0 +1,3 @@
+export * from "./todolists.hooks";
+export * from "./todolists.api";
+export * from "./todolists.types";

src/services/todolists/todolists.api.ts

@@ -0,0 +1,84 @@
+import { todolistsInstance } from "./todolists.instance";
+
+import { handleError } from "@/helpers";
+import type {
+  CreateTaskResponse,
+  CreateTodolistResponse,
+  DeleteTaskResponse,
+  DeleteTodolistResponse,
+  Task,
+  TasksResponse,
+  Todolist,
+  UpdateTaskResponse,
+} from "@/services";
+
+export const TodolistAPI = {
+  async getTodolists() {
+    const res = await todolistsInstance.get<Todolist[]>("/");
+
+    return res.data;
+  },
+
+  async createTodolist({ title }: { title: string }) {
+    const res = await todolistsInstance.post<CreateTodolistResponse>("/", {
+      title,
+    });
+
+    return handleError(res.data);
+  },
+
+  async deleteTodolist({ todolistId }: { todolistId: string }) {
+    const res = await todolistsInstance.delete<DeleteTodolistResponse>(
+      `/${todolistId}`
+    );
+
+    return res.data;
+  },
+
+  async getTodolistTasks({ todolistId }: { todolistId: string }) {
+    const res = await todolistsInstance.get<TasksResponse>(
+      `/${todolistId}/tasks`
+    );
+
+    return res.data;
+  },
+
+  async createTask({
+    todolistId,
+    title,
+  }: {
+    todolistId: string;
+    title: string;
+  }) {
+    const res = await todolistsInstance.post<CreateTaskResponse>(
+      `/${todolistId}/tasks`,
+      { title }
+    );
+
+    return handleError(res.data);
+  },
+
+  async updateTask({ todolistId, task }: { todolistId: string; task: Task }) {
+    const { id, ...rest } = task;
+    const res = await todolistsInstance.put<UpdateTaskResponse>(
+      `/${todolistId}/tasks/${id}`,
+      rest
+    );
+
+    return res.data;
+  },
+
+  async deleteTask({
+    todolistId,
+    taskId,
+  }: {
+    todolistId: string;
+    taskId: string;
+  }) {
+    const res = await todolistsInstance.delete<DeleteTaskResponse>(
+      `/${todolistId}/tasks/${taskId}`
+    );
+
+    return res.data;
+  },
+};

src/services/todolists/todolists.hooks.ts

@@ -0,0 +1,82 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+import { QUERY_KEYS } from "@/constants";
+import { noRefetch } from "@/helpers";
+import { TodolistAPI } from "@/services";
+
+export const useTodolistsQuery = () => {
+  return useQuery({
+    queryFn: TodolistAPI.getTodolists,
+    queryKey: [QUERY_KEYS.TODOLISTS],
+    ...noRefetch,
+  });
+};
+
+export const useCreateTodolistMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: TodolistAPI.createTodolist,
+    //todo: add onMutate
+    onSuccess: async () => {
+      await queryClient.invalidateQueries([QUERY_KEYS.TODOLISTS]);
+    },
+  });
+};
+
+export const useDeleteTodolistMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: TodolistAPI.deleteTodolist,
+    onSuccess: () => {
+      queryClient.invalidateQueries([QUERY_KEYS.TODOLISTS]);
+    },
+  });
+};
+
+export const useGetTasksQuery = (todolistId: string) => {
+  return useQuery({
+    queryKey: [QUERY_KEYS.TASKS, todolistId],
+    queryFn: () => TodolistAPI.getTodolistTasks({ todolistId }),
+  });
+};
+
+export const useCreateTaskMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: TodolistAPI.createTask,
+    onSuccess: (res) => {
+      const todolistId = res.data.item.todoListId;
+
+      queryClient.invalidateQueries([QUERY_KEYS.TASKS, todolistId]);
+    },
+  });
+};
+
+export const useUpdateTaskMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: TodolistAPI.updateTask,
+    onSuccess: async (res) => {
+      const todolistId = res.data.item.todoListId;
+
+      await queryClient.invalidateQueries([QUERY_KEYS.TASKS, todolistId]);
+    },
+  });
+};
+
+export const useDeleteTaskMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: TodolistAPI.deleteTask,
+    onSuccess: (_, variables) => {
+      const todolistId = variables.todolistId;
+
+      queryClient.invalidateQueries([QUERY_KEYS.TASKS, todolistId]);
+    },
+  });
+};

src/services/todolists/todolists.instance.ts

@@ -0,0 +1,6 @@
+import axios from "axios";
+
+export const todolistsInstance = axios.create({
+  baseURL: "https://social-network.samuraijs.com/api/1.1/todo-lists",
+  withCredentials: true,
+});

src/services/todolists/todolists.types.ts

@@ -0,0 +1,61 @@
+import type { ApiResponse } from "@/helpers";
+
+export type UpdateTaskResponseData = {
+  item: Task;
+};
+
+export type TasksResponse = {
+  items: Task[];
+  totalCount: number;
+  error?: string;
+};
+
+export type Task = {
+  id: string;
+  title: string;
+  description?: string;
+  todoListId: string;
+  order: number;
+  status: number;
+  priority: number;
+  startDate?: Date;
+  deadline?: Date;
+  addedDate: Date;
+};
+
+export type Todolist = {
+  id: string;
+  title: string;
+  addedDate: Date;
+  order: number;
+};
+
+export type PostLoginArgs = {
+  email: string;
+  password: string;
+  rememberMe: boolean;
+};
+
+export type LoginResponseData = {
+  userId: number;
+};
+
+export type MeResponseData = {
+  id: number;
+  login: string;
+  email: string;
+};
+
+export type LoginResponse = ApiResponse<LoginResponseData>;
+export type LogoutResponse = ApiResponse<never>;
+export type MeResponse = ApiResponse<MeResponseData>;
+
+export type DeleteTodolistResponse = ApiResponse<never>;
+export type CreateTodolistResponse = ApiResponse<CreateTodolistResponseData>;
+export type CreateTodolistResponseData = {
+  item: Todolist;
+};
+
+export type CreateTaskResponse = ApiResponse<{ item: Task }>;
+export type DeleteTaskResponse = ApiResponse<never>;
+export type UpdateTaskResponse = ApiResponse<UpdateTaskResponseData>;