Checkbox Group: Fix duplicate state (#5970)

This commit is contained in:
zubiden 2025-06-04 20:41:36 +02:00 committed by Alexander Zinchuk
parent 91b8463b35
commit 3cc0fffef4
3 changed files with 13 additions and 16 deletions

View File

@ -116,9 +116,9 @@ const DeleteMessageModal: FC<OwnProps & StateProps> = ({
permissions, havePermissionChanged, handlePermissionChange, resetPermissions, permissions, havePermissionChanged, handlePermissionChange, resetPermissions,
} = useManagePermissions(chat?.defaultBannedRights); } = useManagePermissions(chat?.defaultBannedRights);
const [peerIdsToDeleteAll, setPeerIdsToDeleteAll] = useState<string[] | undefined>(undefined); const [peerIdsToDeleteAll, setPeerIdsToDeleteAll] = useState<string[]>([]);
const [peerIdsToBan, setPeerIdsToBan] = useState<string[] | undefined>(undefined); const [peerIdsToBan, setPeerIdsToBan] = useState<string[]>([]);
const [peerIdsToReportSpam, setPeerIdsToReportSpam] = useState<string[] | undefined>(undefined); const [peerIdsToReportSpam, setPeerIdsToReportSpam] = useState<string[]>([]);
const [isMediaDropdownOpen, setIsMediaDropdownOpen] = useState(false); const [isMediaDropdownOpen, setIsMediaDropdownOpen] = useState(false);
const [isAdditionalOptionsVisible, setIsAdditionalOptionsVisible] = useState(false); const [isAdditionalOptionsVisible, setIsAdditionalOptionsVisible] = useState(false);
const [shouldDeleteForAll, setShouldDeleteForAll] = useState(true); const [shouldDeleteForAll, setShouldDeleteForAll] = useState(true);
@ -330,9 +330,9 @@ const DeleteMessageModal: FC<OwnProps & StateProps> = ({
useEffect(() => { useEffect(() => {
if (!isOpen && prevIsOpen) { if (!isOpen && prevIsOpen) {
setPeerIdsToReportSpam(undefined); setPeerIdsToReportSpam([]);
setPeerIdsToDeleteAll(undefined); setPeerIdsToDeleteAll([]);
setPeerIdsToBan(undefined); setPeerIdsToBan([]);
setShouldDeleteForAll(true); setShouldDeleteForAll(true);
setIsMediaDropdownOpen(false); setIsMediaDropdownOpen(false);
setIsAdditionalOptionsVisible(false); setIsAdditionalOptionsVisible(false);

View File

@ -276,6 +276,7 @@ const Poll: FC<OwnProps> = ({
? ( ? (
<CheckboxGroup <CheckboxGroup
options={answers} options={answers}
selected={chosenOptions}
onChange={handleCheckboxChange} onChange={handleCheckboxChange}
disabled={message.isScheduled || isSubmitting} disabled={message.isScheduled || isSubmitting}
loadingOptions={isSubmitting ? chosenOptions : undefined} loadingOptions={isSubmitting ? chosenOptions : undefined}

View File

@ -1,6 +1,6 @@
import type { ChangeEvent } from 'react'; import type { ChangeEvent } from 'react';
import type { FC, TeactNode } from '../../lib/teact/teact'; 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'; import type { ApiUser } from '../../api/types';
@ -22,7 +22,7 @@ export type IRadioOption = {
type OwnProps = { type OwnProps = {
id?: string; id?: string;
options: IRadioOption[]; options: IRadioOption[];
selected?: string[]; selected: string[];
disabled?: boolean; disabled?: boolean;
nestedCheckbox?: boolean; nestedCheckbox?: boolean;
loadingOptions?: string[]; loadingOptions?: string[];
@ -42,14 +42,12 @@ const CheckboxGroup: FC<OwnProps> = ({
onChange, onChange,
className, className,
}) => { }) => {
const [values, setValues] = useState<string[]>(selected || []);
const handleChange = useLastCallback((event: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption) => { const handleChange = useLastCallback((event: ChangeEvent<HTMLInputElement>, nestedOptionList?: IRadioOption) => {
const { value, checked } = event.currentTarget; const { value, checked } = event.currentTarget;
let newValues: string[]; let newValues: string[];
if (checked) { if (checked) {
newValues = [...values, value]; newValues = [...selected, value];
if (nestedOptionList && value) { if (nestedOptionList && value) {
newValues.push(nestedOptionList.value); newValues.push(nestedOptionList.value);
} }
@ -61,7 +59,7 @@ const CheckboxGroup: FC<OwnProps> = ({
}); });
} }
} else { } else {
newValues = values.filter((v) => v !== value); newValues = selected.filter((v) => v !== value);
if (nestedOptionList && value === nestedOptionList.value) { if (nestedOptionList && value === nestedOptionList.value) {
nestedOptionList.nestedOptions?.forEach((nestedOption) => { nestedOptionList.nestedOptions?.forEach((nestedOption) => {
newValues = newValues.filter((v) => v !== nestedOption.value); newValues = newValues.filter((v) => v !== nestedOption.value);
@ -74,12 +72,10 @@ const CheckboxGroup: FC<OwnProps> = ({
} }
} }
} }
setValues(newValues);
onChange(newValues); onChange(newValues);
}); });
const getCheckedNestedCount = useLastCallback((nestedOptions: IRadioOption[]) => { 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; return checkedCount > 0 ? checkedCount : nestedOptions.length;
}); });
@ -98,7 +94,7 @@ const CheckboxGroup: FC<OwnProps> = ({
nestedCheckbox={nestedCheckbox} nestedCheckbox={nestedCheckbox}
nestedCheckboxCount={getCheckedNestedCount(option.nestedOptions ?? [])} nestedCheckboxCount={getCheckedNestedCount(option.nestedOptions ?? [])}
nestedOptionList={option} nestedOptionList={option}
values={values} values={selected}
isRound={isRound} isRound={isRound}
/> />
); );