diff --git a/src/renderer/components/sidebar/GlobalTaskList.tsx b/src/renderer/components/sidebar/GlobalTaskList.tsx
index 37fdc2cb..f5868894 100644
--- a/src/renderer/components/sidebar/GlobalTaskList.tsx
+++ b/src/renderer/components/sidebar/GlobalTaskList.tsx
@@ -401,6 +401,15 @@ const TaskRows = memo(function TaskRows({
);
});
+function areTaskReferencesEqual(prev: readonly GlobalTask[], next: readonly GlobalTask[]): boolean {
+ if (prev === next) return true;
+ if (prev.length !== next.length) return false;
+ for (let i = 0; i < prev.length; i += 1) {
+ if (prev[i] !== next[i]) return false;
+ }
+ return true;
+}
+
interface ProjectTaskGroupProps {
group: ProjectTaskGroupData;
isCollapsed: boolean;
@@ -427,131 +436,159 @@ interface ProjectTaskGroupProps {
getOwnerColorName: TaskOwnerColorResolver;
}
-const ProjectTaskGroup = memo(function ProjectTaskGroup({
- group,
- isCollapsed,
- visibleCount,
- noProjectGroupColor,
- showMoreLabel,
- showLessLabel,
- isPinned,
- isArchived,
- isNewTask,
- isTeamOffline,
- renamingKey,
- formatTeamHeader,
- onToggleGroup,
- onVisibleCountChange,
- onTogglePin,
- onToggleArchive,
- onMarkUnread,
- onRename,
- onDelete,
- onRenameComplete,
- onRenameCancel,
- getDisplaySubject,
- getOwnerColorName,
-}: ProjectTaskGroupProps): React.JSX.Element | null {
- if (group.tasks.length === 0) return null;
+const ProjectTaskGroup = memo(
+ function ProjectTaskGroup({
+ group,
+ isCollapsed,
+ visibleCount,
+ noProjectGroupColor,
+ showMoreLabel,
+ showLessLabel,
+ isPinned,
+ isArchived,
+ isNewTask,
+ isTeamOffline,
+ renamingKey,
+ formatTeamHeader,
+ onToggleGroup,
+ onVisibleCountChange,
+ onTogglePin,
+ onToggleArchive,
+ onMarkUnread,
+ onRename,
+ onDelete,
+ onRenameComplete,
+ onRenameCancel,
+ getDisplaySubject,
+ getOwnerColorName,
+ }: ProjectTaskGroupProps): React.JSX.Element | null {
+ if (group.tasks.length === 0) return null;
- const isNoProjectGroup = group.projectKey === NO_PROJECT_KEY;
- const groupColor = isNoProjectGroup ? noProjectGroupColor : projectColor(group.projectLabel);
- const showMoreVisible = canProjectGroupShowMore(visibleCount, group.tasks.length);
- const showLessVisible = canProjectGroupShowLess(visibleCount, group.tasks.length);
+ const isNoProjectGroup = group.projectKey === NO_PROJECT_KEY;
+ const groupColor = isNoProjectGroup ? noProjectGroupColor : projectColor(group.projectLabel);
+ const showMoreVisible = canProjectGroupShowMore(visibleCount, group.tasks.length);
+ const showLessVisible = canProjectGroupShowLess(visibleCount, group.tasks.length);
- return (
-
-
- {!isCollapsed && (
-
- )}
- {!isCollapsed && (showMoreVisible || showLessVisible) && (
-
- {showMoreVisible && (
-
- onVisibleCountChange(
- group.projectKey,
- getNextProjectGroupVisibleCount(visibleCount, group.tasks.length)
- )
- }
- >
- {showMoreLabel}
-
+ {isCollapsed ? (
+
+ ) : (
+
)}
- {showLessVisible && (
-
- onVisibleCountChange(
- group.projectKey,
- getPreviousProjectGroupVisibleCount(visibleCount, group.tasks.length)
- )
- }
- >
- {showLessLabel}
-
- )}
-
- )}
-
- );
-});
+
+
+ {group.projectLabel}
+
+
+ {group.tasks.length}
+
+
+ {!isCollapsed && (
+
+ )}
+ {!isCollapsed && (showMoreVisible || showLessVisible) && (
+
+ {showMoreVisible && (
+
+ onVisibleCountChange(
+ group.projectKey,
+ getNextProjectGroupVisibleCount(visibleCount, group.tasks.length)
+ )
+ }
+ >
+ {showMoreLabel}
+
+ )}
+ {showLessVisible && (
+
+ onVisibleCountChange(
+ group.projectKey,
+ getPreviousProjectGroupVisibleCount(visibleCount, group.tasks.length)
+ )
+ }
+ >
+ {showLessLabel}
+
+ )}
+
+ )}
+
+ );
+ },
+ (prev, next) =>
+ prev.group.projectKey === next.group.projectKey &&
+ prev.group.projectLabel === next.group.projectLabel &&
+ areTaskReferencesEqual(prev.group.tasks, next.group.tasks) &&
+ prev.isCollapsed === next.isCollapsed &&
+ prev.visibleCount === next.visibleCount &&
+ prev.noProjectGroupColor === next.noProjectGroupColor &&
+ prev.showMoreLabel === next.showMoreLabel &&
+ prev.showLessLabel === next.showLessLabel &&
+ prev.isPinned === next.isPinned &&
+ prev.isArchived === next.isArchived &&
+ prev.isNewTask === next.isNewTask &&
+ prev.isTeamOffline === next.isTeamOffline &&
+ prev.renamingKey === next.renamingKey &&
+ prev.formatTeamHeader === next.formatTeamHeader &&
+ prev.onToggleGroup === next.onToggleGroup &&
+ prev.onVisibleCountChange === next.onVisibleCountChange &&
+ prev.onTogglePin === next.onTogglePin &&
+ prev.onToggleArchive === next.onToggleArchive &&
+ prev.onMarkUnread === next.onMarkUnread &&
+ prev.onRename === next.onRename &&
+ prev.onDelete === next.onDelete &&
+ prev.onRenameComplete === next.onRenameComplete &&
+ prev.onRenameCancel === next.onRenameCancel &&
+ prev.getDisplaySubject === next.getDisplaySubject &&
+ prev.getOwnerColorName === next.getOwnerColorName
+);
export const GlobalTaskList = memo(function GlobalTaskList({
hideHeader = false,