From 3cc0fffef4eb589f037d186f4edfc49e37994109 Mon Sep 17 00:00:00 2001
From: zubiden <19638254+zubiden@users.noreply.github.com>
Date: Wed, 4 Jun 2025 20:41:36 +0200
Subject: [PATCH] Checkbox Group: Fix duplicate state (#5970)

---
 src/components/common/DeleteMessageModal.tsx | 12 ++++++------
 src/components/middle/message/Poll.tsx       |  1 +
 src/components/ui/CheckboxGroup.tsx          | 16 ++++++----------
 3 files changed, 13 insertions(+), 16 deletions(-)

diff --git a/src/components/common/DeleteMessageModal.tsx b/src/components/common/DeleteMessageModal.tsx
index cc1cd8eb9..a4cbc8528 100644
--- a/src/components/common/DeleteMessageModal.tsx
+++ b/src/components/common/DeleteMessageModal.tsx
@@ -116,9 +116,9 @@ const DeleteMessageModal: FC<OwnProps & StateProps> = ({
     permissions, havePermissionChanged, handlePermissionChange, resetPermissions,
   } = useManagePermissions(chat?.defaultBannedRights);
 
-  const [peerIdsToDeleteAll, setPeerIdsToDeleteAll] = useState<string[] | undefined>(undefined);
-  const [peerIdsToBan, setPeerIdsToBan] = useState<string[] | undefined>(undefined);
-  const [peerIdsToReportSpam, setPeerIdsToReportSpam] = useState<string[] | undefined>(undefined);
+  const [peerIdsToDeleteAll, setPeerIdsToDeleteAll] = useState<string[]>([]);
+  const [peerIdsToBan, setPeerIdsToBan] = useState<string[]>([]);
+  const [peerIdsToReportSpam, setPeerIdsToReportSpam] = useState<string[]>([]);
   const [isMediaDropdownOpen, setIsMediaDropdownOpen] = useState(false);
   const [isAdditionalOptionsVisible, setIsAdditionalOptionsVisible] = useState(false);
   const [shouldDeleteForAll, setShouldDeleteForAll] = useState(true);
@@ -330,9 +330,9 @@ const DeleteMessageModal: FC<OwnProps & StateProps> = ({
 
   useEffect(() => {
     if (!isOpen && prevIsOpen) {
-      setPeerIdsToReportSpam(undefined);
-      setPeerIdsToDeleteAll(undefined);
-      setPeerIdsToBan(undefined);
+      setPeerIdsToReportSpam([]);
+      setPeerIdsToDeleteAll([]);
+      setPeerIdsToBan([]);
       setShouldDeleteForAll(true);
       setIsMediaDropdownOpen(false);
       setIsAdditionalOptionsVisible(false);
diff --git a/src/components/middle/message/Poll.tsx b/src/components/middle/message/Poll.tsx
index 929bf12f4..f44558567 100644
--- a/src/components/middle/message/Poll.tsx
+++ b/src/components/middle/message/Poll.tsx
@@ -276,6 +276,7 @@ const Poll: FC<OwnProps> = ({
             ? (
               <CheckboxGroup
                 options={answers}
+                selected={chosenOptions}
                 onChange={handleCheckboxChange}
                 disabled={message.isScheduled || isSubmitting}
                 loadingOptions={isSubmitting ? chosenOptions : undefined}
diff --git a/src/components/ui/CheckboxGroup.tsx b/src/components/ui/CheckboxGroup.tsx
index 43da1d848..c3d41ec7b 100644
--- a/src/components/ui/CheckboxGroup.tsx
+++ b/src/components/ui/CheckboxGroup.tsx
@@ -1,6 +1,6 @@
 import type { ChangeEvent } from 'react';
 import type { FC, TeactNode } from '../../lib/teact/teact';
-import React, { memo, useState } from '../../lib/teact/teact';
+import React, { memo } from '../../lib/teact/teact';
 
 import type { ApiUser } from '../../api/types';
 
@@ -22,7 +22,7 @@ export type IRadioOption = {
 type OwnProps = {
   id?: string;
   options: IRadioOption[];
-  selected?: string[];
+  selected: string[];
   disabled?: boolean;
   nestedCheckbox?: boolean;
   loadingOptions?: string[];
@@ -42,14 +42,12 @@ const CheckboxGroup: FC<OwnProps> = ({
   onChange,
   className,
 }) => {
-  const [values, setValues] = useState<string[]>(selected || []);
-
   const handleChange = useLastCallback((event: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption) => {
     const { value, checked } = event.currentTarget;
     let newValues: string[];
 
     if (checked) {
-      newValues = [...values, value];
+      newValues = [...selected, value];
       if (nestedOptionList && value) {
         newValues.push(nestedOptionList.value);
       }
@@ -61,7 +59,7 @@ const CheckboxGroup: FC<OwnProps> = ({
         });
       }
     } else {
-      newValues = values.filter((v) => v !== value);
+      newValues = selected.filter((v) => v !== value);
       if (nestedOptionList && value === nestedOptionList.value) {
         nestedOptionList.nestedOptions?.forEach((nestedOption) => {
           newValues = newValues.filter((v) => v !== nestedOption.value);
@@ -74,12 +72,10 @@ const CheckboxGroup: FC<OwnProps> = ({
         }
       }
     }
-
-    setValues(newValues);
     onChange(newValues);
   });
   const getCheckedNestedCount = useLastCallback((nestedOptions: IRadioOption[]) => {
-    const checkedCount = nestedOptions?.filter((nestedOption) => values.includes(nestedOption.value)).length;
+    const checkedCount = nestedOptions?.filter((nestedOption) => selected.includes(nestedOption.value)).length;
     return checkedCount > 0 ? checkedCount : nestedOptions.length;
   });
 
@@ -98,7 +94,7 @@ const CheckboxGroup: FC<OwnProps> = ({
             nestedCheckbox={nestedCheckbox}
             nestedCheckboxCount={getCheckedNestedCount(option.nestedOptions ?? [])}
             nestedOptionList={option}
-            values={values}
+            values={selected}
             isRound={isRound}
           />
         );