Fix: アンテナ絞り込み条件設定画面のタブが切り替えられない問題 (#917)

This commit is contained in:
KMY(雪あすか) 2024-11-29 13:25:51 +09:00 committed by GitHub
parent 8d94a8dfac
commit 69f679e05b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -186,13 +186,15 @@ const TextList: React.FC<{
}; };
const RadioPanel: React.FC<{ const RadioPanel: React.FC<{
antennaId: string;
items: { title: string; value: string }[]; items: { title: string; value: string }[];
valueLengths: number[]; valueLengths: number[];
alertMessage: React.ReactElement; alertMessage: React.ReactElement;
onChange: (value: string) => void; onChange: (value: string) => void;
}> = ({ items, valueLengths, alertMessage, onChange }) => { }> = ({ antennaId, items, valueLengths, alertMessage, onChange }) => {
const [error, setError] = useState(false); const [error, setError] = useState(false);
const [value, setValue] = useState(''); const [value, setValue] = useState('');
const [lastAntennaId, setLastAntennaId] = useState('');
useEffect(() => { useEffect(() => {
if (valueLengths.length >= 2) { if (valueLengths.length >= 2) {
@ -203,7 +205,11 @@ const RadioPanel: React.FC<{
}, [valueLengths]); }, [valueLengths]);
useEffect(() => { useEffect(() => {
if (items.length > 0) { if (
items.length > 0 &&
valueLengths.length === items.length &&
antennaId !== lastAntennaId
) {
for (let i = 0; i < valueLengths.length; i++) { for (let i = 0; i < valueLengths.length; i++) {
const length = valueLengths[i] ?? 0; const length = valueLengths[i] ?? 0;
const item = items[i] ?? { value: '' }; const item = items[i] ?? { value: '' };
@ -215,7 +221,7 @@ const RadioPanel: React.FC<{
} }
setValue(items[0]?.value ?? ''); setValue(items[0]?.value ?? '');
} }
}, [items, valueLengths, setValue, onChange]); }, [antennaId, lastAntennaId, items, valueLengths, setValue, onChange]);
const handleChange = useCallback( const handleChange = useCallback(
({ currentTarget }: React.MouseEvent<HTMLButtonElement>) => { ({ currentTarget }: React.MouseEvent<HTMLButtonElement>) => {
@ -223,9 +229,12 @@ const RadioPanel: React.FC<{
if (value !== selected) { if (value !== selected) {
onChange(selected); onChange(selected);
setValue(selected); setValue(selected);
// Set the flag for the first manual tab change.
setLastAntennaId(antennaId);
} }
}, },
[value, setValue, onChange], [value, setValue, onChange, setLastAntennaId, antennaId],
); );
return ( return (
@ -585,6 +594,7 @@ const AntennaSetting: React.FC<{
<div className='scrollable antenna-setting'> <div className='scrollable antenna-setting'>
<RadioPanel <RadioPanel
antennaId={id}
items={rangeRadioItems} items={rangeRadioItems}
valueLengths={rangeRadioLengths} valueLengths={rangeRadioLengths}
alertMessage={ alertMessage={
@ -617,6 +627,7 @@ const AntennaSetting: React.FC<{
)} )}
<RadioPanel <RadioPanel
antennaId={id}
items={contentRadioItems} items={contentRadioItems}
valueLengths={contentRadioLengths} valueLengths={contentRadioLengths}
alertMessage={ alertMessage={