Как поменять стиль элемента по определённому условию?

Question

[Richard Millie]

Мне нужно по клику на кнопку перекрасить соседний див в синий цвет. Компонент кнопка, и компонент див находятся на одном уровне.

<App>
<ComponentButton onClick = {..} />
<ConmponentDiv color = {..}/>
</App

Как правильно создать action который вызывает клик, а также в редаксе хранить цвет, который я передаю в ConmponentDiv?
компонент div:

const ComponentDiv = () => {
    const style = {
        color: "blue"
    }

    return (

        <div style={style}>
            hello
        </div>

    )
}

export default ComponentDiv;

компонент для кнопки:

const ComponentButton = () => {
    return (
            <button
                onClick={...}
                className="btn">click me
            </button>
    );
};

export default ComponentButton;

Answer 1

[Роман Александрович]

const ComponentDiv = () => {
    const styleBlue = {
        color: "blue"
    }
    const styleRed = {
        color: "red"
    }
    return (

        <div style={true?styleBlue:styleRed}> //вместо true доставьте свою переменную
            hello
        </div>

    )
}

export default ComponentDiv;