@industry-theme/backlogmd-kanban-panel 1.0.1 → 1.0.3

package/dist/panels.bundle.js

@@ -684,6 +684,28 @@ const PRIORITY_ORDER = {
   medium: 1,
   low: 2
 };
+function sortTasksByTitle(tasks, direction = "asc") {
+  return [...tasks].sort((a, b) => {
+    const cmp = a.title.localeCompare(b.title);
+    return direction === "asc" ? cmp : -cmp;
+  });
+}
+function sortTasksBy(tasks, sortBy = "title", direction = "asc") {
+  switch (sortBy) {
+    case "title":
+      return sortTasksByTitle(tasks, direction);
+    case "createdDate":
+      return [...tasks].sort((a, b) => {
+        const cmp = a.createdDate.localeCompare(b.createdDate);
+        return direction === "asc" ? cmp : -cmp;
+      });
+    case "priority":
+    case "ordinal":
+    default:
+      const sorted = sortTasks(tasks);
+      return direction === "desc" ? sorted.reverse() : sorted;
+  }
+}
 function sortTasks(tasks) {
   return [...tasks].sort((a, b) => {
     if (a.ordinal !== void 0 && b.ordinal !== void 0) {
@@ -863,6 +885,99 @@ class Core {
     this.ensureInitialized();
     return this.tasks.get(id);
   }
+  /**
+   * List tasks with pagination
+   *
+   * @param filter - Filter and pagination options
+   * @returns Paginated result with tasks
+   */
+  listTasksPaginated(filter) {
+    this.ensureInitialized();
+    let tasks = this.applyFilters(Array.from(this.tasks.values()), filter);
+    const pagination = (filter == null ? void 0 : filter.pagination) ?? {};
+    const sortBy = pagination.sortBy ?? "title";
+    const sortDirection = pagination.sortDirection ?? "asc";
+    tasks = sortTasksBy(tasks, sortBy, sortDirection);
+    const limit = pagination.limit ?? 10;
+    const offset = pagination.offset ?? 0;
+    const total = tasks.length;
+    const items = tasks.slice(offset, offset + limit);
+    return {
+      items,
+      total,
+      hasMore: offset + limit < total,
+      offset,
+      limit
+    };
+  }
+  /**
+   * Get tasks by status with pagination per column
+   *
+   * @param pagination - Pagination options (applied per status)
+   * @returns Paginated tasks grouped by status
+   */
+  getTasksByStatusPaginated(pagination) {
+    this.ensureInitialized();
+    const limit = (pagination == null ? void 0 : pagination.limit) ?? 10;
+    const offset = (pagination == null ? void 0 : pagination.offset) ?? 0;
+    const sortBy = (pagination == null ? void 0 : pagination.sortBy) ?? "title";
+    const sortDirection = (pagination == null ? void 0 : pagination.sortDirection) ?? "asc";
+    const byStatus = /* @__PURE__ */ new Map();
+    const allGrouped = /* @__PURE__ */ new Map();
+    for (const status of this.config.statuses) {
+      allGrouped.set(status, []);
+    }
+    for (const task of this.tasks.values()) {
+      const list = allGrouped.get(task.status);
+      if (list) {
+        list.push(task);
+      } else {
+        allGrouped.set(task.status, [task]);
+      }
+    }
+    for (const status of this.config.statuses) {
+      let tasks = allGrouped.get(status) ?? [];
+      tasks = sortTasksBy(tasks, sortBy, sortDirection);
+      const total = tasks.length;
+      const items = tasks.slice(offset, offset + limit);
+      byStatus.set(status, {
+        items,
+        total,
+        hasMore: offset + limit < total,
+        offset,
+        limit
+      });
+    }
+    return {
+      byStatus,
+      statuses: this.config.statuses
+    };
+  }
+  /**
+   * Load more tasks for a specific status
+   *
+   * @param status - Status column to load more from
+   * @param currentOffset - Current offset (items already loaded)
+   * @param pagination - Pagination options (limit, sortBy, sortDirection)
+   * @returns Paginated result for the status
+   */
+  loadMoreForStatus(status, currentOffset, pagination) {
+    this.ensureInitialized();
+    const limit = (pagination == null ? void 0 : pagination.limit) ?? 10;
+    const sortBy = (pagination == null ? void 0 : pagination.sortBy) ?? "title";
+    const sortDirection = (pagination == null ? void 0 : pagination.sortDirection) ?? "asc";
+    let tasks = Array.from(this.tasks.values()).filter((t) => t.status === status);
+    tasks = sortTasksBy(tasks, sortBy, sortDirection);
+    const total = tasks.length;
+    const items = tasks.slice(currentOffset, currentOffset + limit);
+    return {
+      items,
+      total,
+      hasMore: currentOffset + limit < total,
+      offset: currentOffset,
+      limit
+    };
+  }
   /**
    * Reload all tasks from disk
    *
@@ -879,6 +994,27 @@ class Core {
       throw new Error("Core not initialized. Call initialize() first.");
     }
   }
+  applyFilters(tasks, filter) {
+    if (!filter)
+      return tasks;
+    let result = tasks;
+    if (filter.status) {
+      result = result.filter((t) => t.status === filter.status);
+    }
+    if (filter.assignee) {
+      result = result.filter((t) => t.assignee.includes(filter.assignee));
+    }
+    if (filter.priority) {
+      result = result.filter((t) => t.priority === filter.priority);
+    }
+    if (filter.labels && filter.labels.length > 0) {
+      result = result.filter((t) => filter.labels.some((label) => t.labels.includes(label)));
+    }
+    if (filter.parentTaskId) {
+      result = result.filter((t) => t.parentTaskId === filter.parentTaskId);
+    }
+    return result;
+  }
   async loadTasksFromDirectory(dir, source) {
     const entries = await this.fs.readDir(dir);
     for (const entry of entries) {
@@ -1020,8 +1156,9 @@ class PanelFileSystemAdapter {
   }
 }
 const DEFAULT_STATUSES = ["To Do", "In Progress", "Done"];
+const DEFAULT_PAGE_SIZE = 10;
 function useKanbanData(options) {
-  const { context, actions } = options || {};
+  const { context, actions, pageSize = DEFAULT_PAGE_SIZE } = options || {};
   const [tasks, setTasks] = useState([]);
   const [statuses, setStatuses] = useState(DEFAULT_STATUSES);
   const [isLoading, setIsLoading] = useState(true);
@@ -1030,6 +1167,10 @@ function useKanbanData(options) {
   const [tasksByStatus, setTasksByStatus] = useState(
     /* @__PURE__ */ new Map()
   );
+  const [columnStates, setColumnStates] = useState(
+    /* @__PURE__ */ new Map()
+  );
+  const coreRef = useRef(null);
   const activeFilePathRef = useRef(null);
   const contextRef = useRef(context);
   const actionsRef = useRef(actions);
@@ -1074,22 +1215,26 @@ function useKanbanData(options) {
       setTasks([]);
       setStatuses(DEFAULT_STATUSES);
       setTasksByStatus(/* @__PURE__ */ new Map());
+      setColumnStates(/* @__PURE__ */ new Map());
       setIsLoading(false);
+      coreRef.current = null;
       return;
     }
     setIsLoading(true);
     setError(null);
     try {
       const fileTreeSlice = context.getRepositorySlice("fileTree");
-      if (!((_a = fileTreeSlice == null ? void 0 : fileTreeSlice.data) == null ? void 0 : _a.files)) {
+      if (!((_a = fileTreeSlice == null ? void 0 : fileTreeSlice.data) == null ? void 0 : _a.allFiles)) {
         console.log("[useKanbanData] FileTree not available");
         setIsBacklogProject(false);
         setTasks([]);
         setStatuses(DEFAULT_STATUSES);
         setTasksByStatus(/* @__PURE__ */ new Map());
+        setColumnStates(/* @__PURE__ */ new Map());
+        coreRef.current = null;
         return;
       }
-      const files = fileTreeSlice.data.files;
+      const files = fileTreeSlice.data.allFiles;
       const filePaths = files.map((f) => f.path);
       const fs = new PanelFileSystemAdapter({
         fetchFile: fetchFileContent,
@@ -1106,20 +1251,56 @@ function useKanbanData(options) {
         setTasks([]);
         setStatuses(DEFAULT_STATUSES);
         setTasksByStatus(/* @__PURE__ */ new Map());
+        setColumnStates(/* @__PURE__ */ new Map());
+        coreRef.current = null;
         return;
       }
-      console.log("[useKanbanData] Loading Backlog.md data...");
+      console.log("[useKanbanData] Loading Backlog.md data with pagination...");
       setIsBacklogProject(true);
       await core.initialize();
+      coreRef.current = core;
       const config = core.getConfig();
-      const grouped = core.getTasksByStatus();
-      const allTasks = core.listTasks();
+      const paginatedResult = core.getTasksByStatusPaginated({
+        limit: pageSize,
+        offset: 0,
+        sortBy: "title",
+        sortDirection: "asc"
+      });
+      const newTasksByStatus = /* @__PURE__ */ new Map();
+      const newColumnStates = /* @__PURE__ */ new Map();
+      let allTasks = [];
+      for (const status of paginatedResult.statuses) {
+        const columnResult = paginatedResult.byStatus.get(status);
+        if (columnResult) {
+          newTasksByStatus.set(status, columnResult.items);
+          newColumnStates.set(status, {
+            tasks: columnResult.items,
+            total: columnResult.total,
+            hasMore: columnResult.hasMore,
+            isLoadingMore: false
+          });
+          allTasks = allTasks.concat(columnResult.items);
+        } else {
+          newTasksByStatus.set(status, []);
+          newColumnStates.set(status, {
+            tasks: [],
+            total: 0,
+            hasMore: false,
+            isLoadingMore: false
+          });
+        }
+      }
+      const totalTasks = Array.from(paginatedResult.byStatus.values()).reduce(
+        (sum, col) => sum + col.total,
+        0
+      );
       console.log(
-        `[useKanbanData] Loaded ${allTasks.length} tasks with ${config.statuses.length} statuses`
+        `[useKanbanData] Loaded ${allTasks.length}/${totalTasks} tasks with ${config.statuses.length} statuses (page size: ${pageSize})`
       );
       setStatuses(config.statuses);
       setTasks(allTasks);
-      setTasksByStatus(grouped);
+      setTasksByStatus(newTasksByStatus);
+      setColumnStates(newColumnStates);
     } catch (err) {
       console.error("[useKanbanData] Failed to load Backlog.md data:", err);
       setError(err instanceof Error ? err.message : "Failed to load backlog data");
@@ -1127,13 +1308,84 @@ function useKanbanData(options) {
       setTasks([]);
       setStatuses(DEFAULT_STATUSES);
       setTasksByStatus(/* @__PURE__ */ new Map());
+      setColumnStates(/* @__PURE__ */ new Map());
+      coreRef.current = null;
     } finally {
       setIsLoading(false);
     }
-  }, [context, actions, fetchFileContent]);
+  }, [context, actions, fetchFileContent, pageSize]);
   useEffect(() => {
     loadBacklogData();
   }, [loadBacklogData]);
+  const loadMore = useCallback(
+    async (status) => {
+      const core = coreRef.current;
+      if (!core) {
+        console.warn("[useKanbanData] Core not available for loadMore");
+        return;
+      }
+      const currentState = columnStates.get(status);
+      if (!currentState || !currentState.hasMore || currentState.isLoadingMore) {
+        return;
+      }
+      setColumnStates((prev) => {
+        const newStates = new Map(prev);
+        const state = newStates.get(status);
+        if (state) {
+          newStates.set(status, { ...state, isLoadingMore: true });
+        }
+        return newStates;
+      });
+      try {
+        const currentOffset = currentState.tasks.length;
+        const result = core.loadMoreForStatus(
+          status,
+          currentOffset,
+          {
+            limit: pageSize,
+            sortBy: "title",
+            sortDirection: "asc"
+          }
+        );
+        console.log(
+          `[useKanbanData] Loaded ${result.items.length} more tasks for "${status}" (${currentOffset + result.items.length}/${result.total})`
+        );
+        setColumnStates((prev) => {
+          const newStates = new Map(prev);
+          const state = newStates.get(status);
+          if (state) {
+            const newTasks = [...state.tasks, ...result.items];
+            newStates.set(status, {
+              tasks: newTasks,
+              total: result.total,
+              hasMore: result.hasMore,
+              isLoadingMore: false
+            });
+          }
+          return newStates;
+        });
+        setTasksByStatus((prev) => {
+          const newMap = new Map(prev);
+          const currentTasks = newMap.get(status) || [];
+          newMap.set(status, [...currentTasks, ...result.items]);
+          return newMap;
+        });
+        setTasks((prev) => [...prev, ...result.items]);
+      } catch (err) {
+        console.error(`[useKanbanData] Failed to load more for "${status}":`, err);
+        setError(err instanceof Error ? err.message : "Failed to load more tasks");
+        setColumnStates((prev) => {
+          const newStates = new Map(prev);
+          const state = newStates.get(status);
+          if (state) {
+            newStates.set(status, { ...state, isLoadingMore: false });
+          }
+          return newStates;
+        });
+      }
+    },
+    [columnStates, pageSize]
+  );
   const refreshData = useCallback(async () => {
     await loadBacklogData();
   }, [loadBacklogData]);
@@ -1154,6 +1406,8 @@ function useKanbanData(options) {
     error,
     isBacklogProject,
     tasksByStatus,
+    columnStates,
+    loadMore,
     refreshData,
     updateTaskStatus
   };
@@ -1161,6 +1415,10 @@ function useKanbanData(options) {
 const KanbanColumn = ({
   status,
   tasks,
+  total,
+  hasMore = false,
+  isLoadingMore = false,
+  onLoadMore,
   onTaskClick
 }) => {
   const { theme: theme2 } = useTheme();
@@ -1176,6 +1434,7 @@ const KanbanColumn = ({
         return theme2.colors.border;
     }
   };
+  const remaining = total !== void 0 ? total - tasks.length : 0;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1224,13 +1483,13 @@ const KanbanColumn = ({
                     padding: "2px 8px",
                     borderRadius: theme2.radii[1]
                   },
-                  children: tasks.length
+                  children: total !== void 0 ? `${tasks.length}/${total}` : tasks.length
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxs(
           "div",
           {
             style: {
@@ -1241,131 +1500,190 @@ const KanbanColumn = ({
               overflowY: "auto",
               WebkitOverflowScrolling: "touch"
             },
-            children: tasks.map((task) => /* @__PURE__ */ jsxs(
-              "div",
-              {
-                onClick: () => onTaskClick == null ? void 0 : onTaskClick(task),
-                style: {
-                  background: theme2.colors.surface,
-                  borderRadius: theme2.radii[2],
-                  padding: "12px",
-                  border: `1px solid ${theme2.colors.border}`,
-                  borderLeft: `4px solid ${getPriorityColor(task.priority)}`,
-                  cursor: onTaskClick ? "pointer" : "default",
-                  transition: "all 0.2s ease",
-                  minHeight: "44px"
-                  // Minimum touch target size for mobile
-                },
-                onMouseEnter: (e) => {
-                  if (onTaskClick) {
-                    e.currentTarget.style.transform = "translateY(-2px)";
-                    e.currentTarget.style.boxShadow = `0 4px 8px ${theme2.colors.border}`;
-                  }
-                },
-                onMouseLeave: (e) => {
-                  if (onTaskClick) {
-                    e.currentTarget.style.transform = "translateY(0)";
-                    e.currentTarget.style.boxShadow = "none";
-                  }
-                },
-                children: [
-                  /* @__PURE__ */ jsx(
-                    "h4",
-                    {
-                      style: {
-                        margin: "0 0 8px 0",
-                        fontSize: theme2.fontSizes[2],
-                        color: theme2.colors.text,
-                        fontWeight: theme2.fontWeights.medium
-                      },
-                      children: task.title
+            children: [
+              tasks.map((task) => /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  onClick: () => onTaskClick == null ? void 0 : onTaskClick(task),
+                  style: {
+                    background: theme2.colors.surface,
+                    borderRadius: theme2.radii[2],
+                    padding: "12px",
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderLeft: `4px solid ${getPriorityColor(task.priority)}`,
+                    cursor: onTaskClick ? "pointer" : "default",
+                    transition: "all 0.2s ease",
+                    minHeight: "44px"
+                    // Minimum touch target size for mobile
+                  },
+                  onMouseEnter: (e) => {
+                    if (onTaskClick) {
+                      e.currentTarget.style.transform = "translateY(-2px)";
+                      e.currentTarget.style.boxShadow = `0 4px 8px ${theme2.colors.border}`;
                     }
-                  ),
-                  task.description && /* @__PURE__ */ jsx(
-                    "p",
-                    {
-                      style: {
-                        margin: "0 0 8px 0",
-                        fontSize: theme2.fontSizes[1],
-                        color: theme2.colors.textSecondary,
-                        overflow: "hidden",
-                        textOverflow: "ellipsis",
-                        display: "-webkit-box",
-                        WebkitLineClamp: 2,
-                        WebkitBoxOrient: "vertical",
-                        lineHeight: "1.4"
-                      },
-                      children: task.description
+                  },
+                  onMouseLeave: (e) => {
+                    if (onTaskClick) {
+                      e.currentTarget.style.transform = "translateY(0)";
+                      e.currentTarget.style.boxShadow = "none";
                     }
-                  ),
-                  task.labels && task.labels.length > 0 && /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      style: {
-                        display: "flex",
-                        gap: "4px",
-                        flexWrap: "wrap",
-                        marginBottom: "8px"
-                      },
-                      children: task.labels.map((label) => /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          style: {
-                            fontSize: theme2.fontSizes[0],
-                            color: theme2.colors.primary,
-                            background: `${theme2.colors.primary}20`,
-                            padding: "2px 8px",
-                            borderRadius: theme2.radii[1],
-                            fontWeight: theme2.fontWeights.medium
-                          },
-                          children: label
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "h4",
+                      {
+                        style: {
+                          margin: "0 0 8px 0",
+                          fontSize: theme2.fontSizes[2],
+                          color: theme2.colors.text,
+                          fontWeight: theme2.fontWeights.medium
                         },
-                        label
-                      ))
-                    }
-                  ),
-                  /* @__PURE__ */ jsxs(
-                    "div",
-                    {
-                      style: {
-                        display: "flex",
-                        alignItems: "center",
-                        justifyContent: "space-between",
-                        fontSize: theme2.fontSizes[0],
-                        color: theme2.colors.textMuted
-                      },
-                      children: [
-                        /* @__PURE__ */ jsx(
-                          "span",
-                          {
-                            style: {
-                              fontFamily: theme2.fonts.monospace
-                            },
-                            children: task.id
-                          }
-                        ),
-                        task.assignee && task.assignee.length > 0 && /* @__PURE__ */ jsxs(
+                        children: task.title
+                      }
+                    ),
+                    task.description && /* @__PURE__ */ jsx(
+                      "p",
+                      {
+                        style: {
+                          margin: "0 0 8px 0",
+                          fontSize: theme2.fontSizes[1],
+                          color: theme2.colors.textSecondary,
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          display: "-webkit-box",
+                          WebkitLineClamp: 2,
+                          WebkitBoxOrient: "vertical",
+                          lineHeight: "1.4"
+                        },
+                        children: task.description
+                      }
+                    ),
+                    task.labels && task.labels.length > 0 && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        style: {
+                          display: "flex",
+                          gap: "4px",
+                          flexWrap: "wrap",
+                          marginBottom: "8px"
+                        },
+                        children: task.labels.map((label) => /* @__PURE__ */ jsx(
                           "span",
                           {
                             style: {
-                              color: theme2.colors.textSecondary
+                              fontSize: theme2.fontSizes[0],
+                              color: theme2.colors.primary,
+                              background: `${theme2.colors.primary}20`,
+                              padding: "2px 8px",
+                              borderRadius: theme2.radii[1],
+                              fontWeight: theme2.fontWeights.medium
                             },
-                            children: [
-                              task.assignee.length,
-                              " assignee",
-                              task.assignee.length !== 1 ? "s" : ""
-                            ]
-                          }
-                        )
-                      ]
+                            children: label
+                          },
+                          label
+                        ))
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      "div",
+                      {
+                        style: {
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "space-between",
+                          fontSize: theme2.fontSizes[0],
+                          color: theme2.colors.textMuted
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx(
+                            "span",
+                            {
+                              style: {
+                                fontFamily: theme2.fonts.monospace
+                              },
+                              children: task.id
+                            }
+                          ),
+                          task.assignee && task.assignee.length > 0 && /* @__PURE__ */ jsxs(
+                            "span",
+                            {
+                              style: {
+                                color: theme2.colors.textSecondary
+                              },
+                              children: [
+                                task.assignee.length,
+                                " assignee",
+                                task.assignee.length !== 1 ? "s" : ""
+                              ]
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                },
+                task.id
+              )),
+              hasMore && onLoadMore && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: onLoadMore,
+                  disabled: isLoadingMore,
+                  style: {
+                    background: theme2.colors.background,
+                    border: `1px dashed ${theme2.colors.border}`,
+                    borderRadius: theme2.radii[2],
+                    padding: "12px",
+                    cursor: isLoadingMore ? "wait" : "pointer",
+                    color: theme2.colors.textSecondary,
+                    fontSize: theme2.fontSizes[1],
+                    fontWeight: theme2.fontWeights.medium,
+                    transition: "all 0.2s ease",
+                    minHeight: "44px",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: "8px"
+                  },
+                  onMouseEnter: (e) => {
+                    if (!isLoadingMore) {
+                      e.currentTarget.style.background = theme2.colors.backgroundSecondary;
+                      e.currentTarget.style.borderColor = theme2.colors.primary;
+                      e.currentTarget.style.color = theme2.colors.primary;
                     }
-                  )
-                ]
-              },
-              task.id
-            ))
+                  },
+                  onMouseLeave: (e) => {
+                    e.currentTarget.style.background = theme2.colors.background;
+                    e.currentTarget.style.borderColor = theme2.colors.border;
+                    e.currentTarget.style.color = theme2.colors.textSecondary;
+                  },
+                  children: isLoadingMore ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          display: "inline-block",
+                          width: "14px",
+                          height: "14px",
+                          border: `2px solid ${theme2.colors.border}`,
+                          borderTopColor: theme2.colors.primary,
+                          borderRadius: "50%",
+                          animation: "spin 1s linear infinite"
+                        }
+                      }
+                    ),
+                    "Loading..."
+                  ] }) : `Load more (${remaining} remaining)`
+                }
+              )
+            ]
           }
-        )
+        ),
+        /* @__PURE__ */ jsx("style", { children: `
+          @keyframes spin {
+            to { transform: rotate(360deg); }
+          }
+        ` })
       ]
     }
   );
@@ -1626,9 +1944,10 @@ const KanbanPanelContent = ({
   var _a, _b;
   const { theme: theme2 } = useTheme();
   const [_selectedTask, setSelectedTask] = useState(null);
-  const { statuses, tasksByStatus, error, isBacklogProject, refreshData } = useKanbanData({
+  const { statuses, tasksByStatus, columnStates, loadMore, error, isBacklogProject, refreshData } = useKanbanData({
     context,
-    actions
+    actions,
+    pageSize: 10
   });
   const handleTaskClick = (task) => {
     setSelectedTask(task);
@@ -1774,11 +2093,16 @@ const KanbanPanelContent = ({
             },
             children: statuses.map((status) => {
               const columnTasks = tasksByStatus.get(status) || [];
+              const columnState = columnStates.get(status);
               return /* @__PURE__ */ jsx(
                 KanbanColumn,
                 {
                   status,
                   tasks: columnTasks,
+                  total: columnState == null ? void 0 : columnState.total,
+                  hasMore: columnState == null ? void 0 : columnState.hasMore,
+                  isLoadingMore: columnState == null ? void 0 : columnState.isLoadingMore,
+                  onLoadMore: () => loadMore(status),
                   onTaskClick: handleTaskClick
                 },
                 status