Checklist: Fix incorrent confetti playback (#6059)

src/components/middle/message/TodoList.tsx

@@ -1,5 +1,5 @@
 import {
-  memo, useEffect, useMemo, useState,
+  memo, useLayoutEffect, useMemo, useState,
 } from '../../../lib/teact/teact';
 import { getActions, getGlobal, withGlobal } from '../../../global';
 
@@ -49,7 +49,7 @@ const TodoList = ({
 
   const canToggle = !message.isScheduled && isCurrentUserPremium && isSynced;
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     const completedIds = completions?.map((c) => c.itemId.toString()) || [];
     setCompletedTasks(completedIds);
   }, [completions]);

src/components/ui/Checkbox.tsx

@@ -48,10 +48,10 @@ type OwnProps = {
   className?: string;
   nestedCheckbox?: boolean;
   nestedCheckboxCount?: number | undefined;
-  nestedOptionList?: IRadioOption;
+  nestedOptionList?: IRadioOption[];
   leftElement?: TeactNode;
   values?: string[];
-  onChange?: (e: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption) => void;
+  onChange?: (e: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption[]) => void;
   onCheck?: (isChecked: boolean) => void;
   onClickLabel?: (e: React.MouseEvent, value?: string) => void;
 };
@@ -190,7 +190,7 @@ const Checkbox: FC<OwnProps> = ({
         <div
           className={buildClassName('nested-checkbox-group', showNested && 'nested-checkbox-group-open')}
         >
-          {nestedOptionList?.nestedOptions?.map((nestedOption) => (
+          {nestedOptionList?.map((nestedOption) => (
             <Checkbox
               key={nestedOption.value}
               leftElement={leftElement}

src/components/ui/CheckboxGroup.tsx

@@ -5,6 +5,7 @@ import { memo } from '../../lib/teact/teact';
 import type { ApiUser } from '../../api/types';
 
 import buildClassName from '../../util/buildClassName';
+import { unique } from '../../util/iteratees';
 
 import useLastCallback from '../../hooks/useLastCallback';
 
@@ -44,34 +45,21 @@ const CheckboxGroup: FC<OwnProps> = ({
   onClickLabel,
   className,
 }) => {
-  const handleChange = useLastCallback((event: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption) => {
+  const handleChange = useLastCallback((event: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption[]) => {
     const { value, checked } = event.currentTarget;
     let newValues: string[];
 
     if (checked) {
-      newValues = [...selected, value];
-      if (nestedOptionList && value) {
-        newValues.push(nestedOptionList.value);
-      }
-      if (nestedOptionList && value === nestedOptionList.value) {
-        nestedOptionList.nestedOptions?.forEach((nestedOption) => {
-          if (!newValues.includes(nestedOption.value)) {
-            newValues.push(nestedOption.value);
-          }
-        });
-      }
+      newValues = unique([...selected, value]);
+      nestedOptionList?.forEach((nestedOption) => {
+        if (!newValues.includes(nestedOption.value)) {
+          newValues.push(nestedOption.value);
+        }
+      });
     } else {
       newValues = selected.filter((v) => v !== value);
-      if (nestedOptionList && value === nestedOptionList.value) {
-        nestedOptionList.nestedOptions?.forEach((nestedOption) => {
-          newValues = newValues.filter((v) => v !== nestedOption.value);
-        });
-      } else if (nestedOptionList) {
-        const nestedOptionValues = nestedOptionList.nestedOptions?.map((nestedOption) => nestedOption.value) || [];
-        const hasOtherNestedValuesChecked = nestedOptionValues.some((nestedValue) => newValues.includes(nestedValue));
-        if (!hasOtherNestedValuesChecked) {
-          newValues = newValues.filter((v) => v !== nestedOptionList.value);
-        }
+      if (nestedOptionList) {
+        newValues = newValues.filter((v) => !nestedOptionList.some((nestedOption) => nestedOption.value === v));
       }
     }
     onChange(newValues);
@@ -97,7 +85,7 @@ const CheckboxGroup: FC<OwnProps> = ({
             onClickLabel={onClickLabel}
             nestedCheckbox={nestedCheckbox}
             nestedCheckboxCount={getCheckedNestedCount(option.nestedOptions ?? [])}
-            nestedOptionList={option}
+            nestedOptionList={option.nestedOptions}
             values={selected}
             isRound={isRound}
           />

src/global/selectors/messages.ts

@@ -662,6 +662,7 @@ export function selectAllowedMessageActionsSlow<T extends GlobalState>(
 
   // https://github.com/telegramdesktop/tdesktop/blob/335095a332607c41a8d20b47e61f5bbd66366d4b/Telegram/SourceFiles/data/data_peer.cpp#L653
   const canEditMessagesIndefinitely = (() => {
+    if (content.todo) return true;
     if (isPrivate) return isChatWithSelf;
     if (isBasicGroup) return false;
     if (isSuperGroup) return hasChatPinPermission;