fix(web): correct task checkbox toggling in multi-section memos

Fixed a bug where clicking checkboxes in task lists would toggle the wrong
checkbox when a memo contained multiple sections with separate task lists.

The issue was that TaskListItem was counting tasks only within the immediate
parent list (ul/ol), but the toggleTaskAtIndex function counts all tasks
globally across the entire memo. This caused index misalignment.

Changes:
- Add containerRef to MemoContentContext for proper task scoping
- Pass memoContentContainerRef through context in MemoContent component
- Update TaskListItem to count all tasks within the container scope

This ensures task indices are calculated consistently with the markdown
manipulation logic, fixing checkbox toggling in complex multi-section memos.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Steven 2025-11-04 09:25:15 +08:00
parent 9b72963e08
commit d30ff2898f
3 changed files with 12 additions and 2 deletions

View file

@ -19,6 +19,9 @@ export interface MemoContentContextType {
/** Parent page path (for navigation) */
parentPage?: string;
/** Reference to the container element for the memo content */
containerRef?: React.RefObject<HTMLDivElement>;
}
export const MemoContentContext = createContext<MemoContentContextType>({

View file

@ -44,8 +44,14 @@ export const TaskListItem: React.FC<TaskListItemProps> = ({ checked, ...props })
if (taskIndexStr !== null) {
taskIndex = parseInt(taskIndexStr);
} else {
// Fallback: Calculate index by counting previous task list items
const allTaskItems = listItem.closest("ul, ol")?.querySelectorAll("li.task-list-item") || [];
// Fallback: Calculate index by counting ALL task list items in the memo
// Use the container ref from context for proper scoping
const container = context.containerRef?.current;
if (!container) {
return;
}
const allTaskItems = container.querySelectorAll("li.task-list-item");
for (let i = 0; i < allTaskItems.length; i++) {
if (allTaskItems[i] === listItem) {
taskIndex = i;

View file

@ -49,6 +49,7 @@ const MemoContent = observer((props: Props) => {
readonly: !allowEdit,
disableFilter: props.disableFilter,
parentPage: props.parentPage,
containerRef: memoContentContainerRef,
};
// Initial compact mode.