React. Как передать сигнал в дочерний компонент?

Изучаю React и столкнулся с проблемой.

Мне нужно дать дочернему компоненту (Button) "сигнал" о том что нужно изменить стейт active на false, но не могу никак передать. Если передаю через prop просто false, то не меняет так как useEffect не вызывается потому что состояние не менялось. Понимаю что что-то делаю не так, пытался исправить разными способами, но решение так и не нашел. Буду благодарен за помощь.

FastFilter.jsx

export const FastFilter = () => {
    const [selectedIncludes, setSelectedIncludes] = useState([])
    const [activeStatus, setActiveStatus] = useState(false)

    const poolReapeters = (data) => {

    }

    const onButtonActived = (data, state) => {
        const recived = Array.isArray(data.children) ? { children: data.children[1].replace(/\s/g, ''), type: data.type } : data
        if (state) {
            setSelectedIncludes([...selectedIncludes, recived])
        } else {
            setSelectedIncludes([...selectedIncludes.filter(function (name) {
                return name.children !== recived.children
            })])
        }

    }

    const resetCat = () => {
        setActiveStatus(false)
    }

    useEffect(() => {
        poolReapeters(selectedIncludes)
        console.log(selectedIncludes)
    }, [selectedIncludes])

    return (
        <>
            <Title>Швидкий пошук за фiльтрами</Title>
            <Reapeter>
                <Button type={"model"} onActive={onButtonActived} activeStatus={activeStatus}><SiBmw /> BMW</Button>
                <Button type={"model"} onActive={onButtonActived} activeStatus={activeStatus}><SiMercedes /> Mercedes</Button>
                <Button type={"model"} onActive={onButtonActived} activeStatus={activeStatus}><SiAudi /> Audi</Button>
                <Button type={"model"} onActive={onButtonActived} activeStatus={activeStatus}><SiVolkswagen /> Volkswagen</Button>
                <Button type={"model"} onActive={onButtonActived} activeStatus={activeStatus}><SiOpel /> Opel</Button>
            </Reapeter>
            <Reapeter>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Сiра</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Бiла</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Чорна</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Червона</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Синя</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Зелена</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Жовта</Button>
                <Button type={"color"} onActive={onButtonActived} activeStatus={activeStatus}>Коричнева</Button>
            </Reapeter>
            <Reapeter>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>1990-2000</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2000-2005</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2005-2010</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2010-2013</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2013-2017</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2017-2020</Button>
                <Button type={"year"} onActive={onButtonActived} activeStatus={activeStatus}>2020-2023</Button>
            </Reapeter>
            <Reapeter>
                <Button type={"state"} onActive={onButtonActived} activeStatus={activeStatus}>Ідеальний стан</Button>
                <Button type={"state"} onActive={onButtonActived} activeStatus={activeStatus}>Сліди використання</Button>
                <Button type={"state"} onActive={onButtonActived} activeStatus={activeStatus}>Після ДТП</Button>
                <Button type={"state"} onActive={onButtonActived} activeStatus={activeStatus}>На запчастини</Button>
            </Reapeter>
            <Reapeter>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>1.6 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>1.8 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>1.9 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>2.0 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>2.2 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>2.4 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>2.6 л</Button>
                <Button type={"capacity"} onActive={onButtonActived} activeStatus={activeStatus}>2.8 л</Button>
            </Reapeter>
            <Reapeter>
                <Button type={"carType"} onActive={onButtonActived} activeStatus={activeStatus}>Універсал</Button>
                <Button type={"carType"} onActive={onButtonActived} activeStatus={activeStatus}>Седан</Button>
                <Button type={"carType"} onActive={onButtonActived} activeStatus={activeStatus}>Хетчбек</Button>
                <Button type={"carType"} onActive={onButtonActived} activeStatus={activeStatus}>Купе</Button>
            </Reapeter>
            <ButtonApplySearchContainer><ButtonApplySearchSubContainer><ButtonApplySearch>Показати {`(${20})`}</ButtonApplySearch><ButtonApplyReload onClick={resetCat}><IoMdRefresh /></ButtonApplyReload></ButtonApplySearchSubContainer></ButtonApplySearchContainer>
        </>
    )
}

Button.jsx

export const Button = ({ children, onActive, type, activeStatus }) => {
    const [active, setActive] = useState(false)
    const onSelected = () => {
        setActive(active => !active)
    }

    useEffect(() => {
        onActive({ children, type }, active)
    }, [active])

    useEffect(() => {
        console.log(activeStatus)
        if (active) {
            setActive(activeStatus)
        }
    }, [activeStatus])



    return (
        <ButtonStyled isActive={active} onClick={onSelected}>{children}</ButtonStyled>
    )
}