refactor/add-new-kanban

components.json

@@ -19,6 +19,7 @@
     "hooks": "shared/hooks/shadcn"
   },
   "registries": {
-    "@kibo-ui": "https://www.kibo-ui.com/r/{name}.json"
+    "@kibo-ui": "https://www.kibo-ui.com/r/{name}.json",
+    "@reui": "https://reui.io/r/{style}/{name}.json"
   }
 }

src/entities/auth/api/http.ts

@@ -1,6 +1,6 @@
 import { api } from 'shared/api';
 import * as SAuth from '../model/schemas';
-import * as TAuth from '../model/types';
+import type * as TAuth from '../model/types';
 
 export class AuthHttp {
   static signin(data: TAuth.SigninBody) {

src/entities/board/api/http.ts

@@ -0,0 +1,130 @@
+import { api } from 'shared/api';
+import * as SBoard from '../model/schemas';
+import type * as TBoard from '../model/types';
+
+export class BoardHttp {
+  static getBoardList(projectSlug: string, signal?: AbortSignal) {
+    return api<TBoard.BoardListResponse>({
+      url: `/projects/${projectSlug}/area`,
+      method: 'GET',
+      contracts: {
+        response: SBoard.BoardListResponse,
+      },
+      signal,
+    });
+  }
+
+  static getBoard(projectSlug: string, id: string, signal?: AbortSignal) {
+    return api<TBoard.BoardResponse>({
+      url: `/projects/${projectSlug}/area/${id}`,
+      method: 'GET',
+      contracts: {
+        response: SBoard.Board,
+      },
+      signal,
+    });
+  }
+
+  static createBoard(projectSlug: string, data: TBoard.CreateBoardBody) {
+    return api<TBoard.CreateBoardResponse>({
+      url: `/projects/${projectSlug}/area`,
+      method: 'POST',
+      data,
+      contracts: {
+        body: SBoard.CreateBoardBody,
+        response: SBoard.CreateBoardResponse,
+      },
+    });
+  }
+
+  static updateBoard(projectSlug: string, boardSlug: string, data: TBoard.UpdateBoardBody) {
+    return api<TBoard.ActionResponse>({
+      url: `/projects/${projectSlug}/area/${boardSlug}`,
+      method: 'PUT',
+      data,
+      contracts: {
+        body: SBoard.UpdateBoardBody,
+        response: SBoard.ActionResponse,
+      },
+    });
+  }
+
+  static removeBoard(projectSlug: string, boardSlug: string) {
+    return api<TBoard.ActionResponse>({
+      url: `/projects/${projectSlug}/area/${boardSlug}`,
+      method: 'DELETE',
+      contracts: {
+        response: SBoard.ActionResponse,
+      },
+    });
+  }
+
+  static getBoardColumnList(boardSlug: string, signal?: AbortSignal) {
+    return api<TBoard.BoardColumnListResponse>({
+      url: `/area/${boardSlug}/states`,
+      method: 'GET',
+      contracts: {
+        response: SBoard.BoardColumnListResponse,
+      },
+      signal,
+    });
+  }
+
+  static getBoardColumn(boardSlug: string, columnId: string, signal?: AbortSignal) {
+    return api<TBoard.BoardColumnResponse>({
+      url: `/area/${boardSlug}/states/${columnId}`,
+      method: 'GET',
+      contracts: {
+        response: SBoard.BoardColumn,
+      },
+      signal,
+    });
+  }
+
+  static createBoardColumn(boardSlug: string, data: TBoard.CreateBoardColumnBody) {
+    return api<TBoard.CreateBoardColumnResponse>({
+      url: `/area/${boardSlug}/states`,
+      method: 'POST',
+      data,
+      contracts: {
+        body: SBoard.CreateBoardColumnBody,
+        response: SBoard.CreateBoardColumnResponse,
+      },
+    });
+  }
+
+  static updateBoardColumn(
+    boardSlug: string,
+    columnId: string,
+    data: TBoard.UpdateBoardColumnBody
+  ) {
+    return api<TBoard.ActionResponse>({
+      url: `/area/${boardSlug}/states/${columnId}`,
+      method: 'PATCH',
+      data,
+      contracts: {
+        body: SBoard.UpdateBoardColumnBody,
+        response: SBoard.ActionResponse,
+      },
+    });
+  }
+
+  static removeBoardColumn(boardSlug: string, columnId: string) {
+    return api<TBoard.ActionResponse>({
+      url: `/area/${boardSlug}/states/${columnId}`,
+      method: 'DELETE',
+      contracts: {
+        response: SBoard.ActionResponse,
+      },
+    });
+  }
+  static restoreBoardColumn(boardSlug: string, columnId: string) {
+    return api<TBoard.ActionResponse>({
+      url: `/area/${boardSlug}/states/${columnId}/restore`,
+      method: 'POST',
+      contracts: {
+        response: SBoard.ActionResponse,
+      },
+    });
+  }
+}

src/entities/board/api/queries.ts

@@ -0,0 +1,37 @@
+import { queryOptions } from '@tanstack/react-query';
+import { boardFabricKeys } from '../model/consts';
+import { BoardHttp } from './http';
+
+export class BoardQueries {
+  static getBoardList(slug: string) {
+    return queryOptions({
+      queryKey: boardFabricKeys.list(slug),
+      queryFn: async ({ signal }) => BoardHttp.getBoardList(slug, signal),
+      staleTime: 60_000,
+    });
+  }
+
+  static getBoard(slug: string, id: string) {
+    return queryOptions({
+      queryKey: boardFabricKeys.detail(slug, id),
+      queryFn: async ({ signal }) => BoardHttp.getBoard(slug, id, signal),
+      staleTime: 60_000,
+    });
+  }
+
+  static getBoardColumnList(slug: string) {
+    return queryOptions({
+      queryKey: boardFabricKeys.columns(slug),
+      queryFn: async ({ signal }) => BoardHttp.getBoardColumnList(slug, signal),
+      staleTime: 60_000,
+    });
+  }
+
+  static getBoardColumn(slug: string, id: string) {
+    return queryOptions({
+      queryKey: boardFabricKeys.column(slug, id),
+      queryFn: async ({ signal }) => BoardHttp.getBoardColumn(slug, id, signal),
+      staleTime: 60_000,
+    });
+  }
+}

src/entities/board/config/colors.ts

@@ -0,0 +1,14 @@
+export const BOARD_COLUMN_COLORS = [
+  '#9FA8DA',
+  '#7E57C2',
+  '#9575CD',
+  '#AB47BC',
+  '#F06292',
+  '#FF8A65',
+  '#4FC3F7',
+  '#4DB6AC',
+  '#81C784',
+  '#DCE775',
+  '#FFF176',
+  '#FFB74D',
+] as const;

src/entities/board/index.ts

@@ -0,0 +1,8 @@
+export type * as TBoard from './model/types';
+export * as SBoard from './model/schemas';
+export { boardFabricKeys } from './model/consts';
+export { BoardHttp } from './api/http';
+export { BoardQueries } from './api/queries';
+export { BoardMapper, type KanbanBoardData } from './model/mapper';
+export { BOARD_COLUMN_COLORS } from './config/colors';
+export { useBoardStore } from './model/store';

src/entities/board/model/consts.ts

@@ -0,0 +1,11 @@
+import { createEntityKeys } from 'shared/lib/utils';
+
+export const boardFabricKeys = createEntityKeys('board', {
+  detail: (slug: string, id: string) => ['projects', slug, 'boards', id],
+  columns: (slug: string) => ['boards', slug, 'columns'],
+  column: (slug: string, id: string) => ['boards', slug, 'columns', id],
+  views: (slug: string) => ['boards', slug, 'views'],
+  view: (slug: string, id: string) => ['boards', slug, 'views', id],
+  tasks: (boardSlug: string) => ['board', boardSlug, 'tasks'],
+  task: (columnId: string, taskId: string) => ['columns', columnId, 'tasks', taskId],
+});

src/entities/board/model/mapper.ts

@@ -0,0 +1,51 @@
+import type { BoardColumnResponse, BoardResponse } from './types';
+
+// TODO: добавить таски в типы, когда они появятся в API
+
+type KanbanTaskStub = {
+  id: string;
+  columnId: string;
+};
+
+export type KanbanBoardData = {
+  board: BoardResponse;
+  columns: Record<string, BoardColumnResponse>;
+  tasksByColumn: Record<string, unknown[]>;
+};
+
+export class BoardMapper {
+  static toKanban(
+    board: BoardResponse,
+    columnList: BoardColumnResponse[],
+    taskList: unknown[]
+  ): KanbanBoardData {
+    const sortedColumns = [...columnList].sort((a, b) => a.orderIndex - b.orderIndex);
+    const tasksByColumn: Record<string, unknown[]> = {};
+    const columns: Record<string, BoardColumnResponse> = {};
+
+    sortedColumns.forEach((column) => {
+      tasksByColumn[column.id] = [];
+      columns[column.id] = column;
+    });
+
+    taskList?.forEach((task) => {
+      const kanbanTask = task as KanbanTaskStub;
+
+      if (tasksByColumn[kanbanTask.columnId]) {
+        tasksByColumn[kanbanTask.columnId].push(task);
+      } else {
+        console.warn(`Task ${kanbanTask.id} references unknown column ${kanbanTask.columnId}`);
+      }
+    });
+
+    // Object.keys(tasksByColumn).forEach((columnId) => {
+    //   tasksByColumn[columnId].sort((a, b) => a.position - b.position);
+    // });
+
+    return {
+      board,
+      columns,
+      tasksByColumn,
+    };
+  }
+}