Need help with basic react app. I have 3 javascript files below and 1 css file. How to render the color when selecting it from the menu. I already have the menu rendered and formatted, but when selecting a color from the 4 options on the menu no color is displayed. To make the color render, just pass in a CSS attribute called mystyle which should have 1 line of code in the Block.js file. Im unsure of what should be passed in

---App.js

import './App.css';

import 'bootstrap/dist/css/bootstrap.min.css';

import Feed from './Feed'

import Block from './Block'

function App() {

return (

Blockstagram

);

}

export default App;

---Block.js

import React from 'react';

class Block extends React.Component {

constructor(props) { super(props); }

render() {

const mystyle = {

//Add 1 line here

};

return (

//Add line here

}>

>

);

}

}

export default Block;

---Feed.js

import React from 'react';

import Block from './Block';

class Feed extends React.Component {

state = {

// ADD CODE HERE

}

addBlock = (color) => {

this.setState({

})

}

pickColorlayout = () => {

if (this.state.showopt == false) {

this.setState({

showopt: true

})

}

else{

this.setState({

showopt: false

})

}

}

render() {

return (

{}

+ Post Block

{ this.state.showopt ?

this.addBlock("rgb(134, 5, 5)")}>

this.addBlock("rgb(21, 0, 141)")}>

this.addBlock("rgb(59, 110, 0)")}>

this.addBlock("rgb(58, 0, 97)")}>

: null }

);

}

}

export default Feed;

-App.css

.App {

text-align: center;

}

.blockers{

height: 3000px;

width: 300px;

margin: 60px;

position: relative;

display: flex;

}

.bottom{

width: 300px;

height: 40px;

background-color: rgb(212, 212, 212);

margin-top: -60px;

display: flex;

justify-content: center;

align-items: center;

}

.white{

width: 250px;

height: 25px;

background-color: white;

}

/* Alignment for feed so that everythings falls in the center*/

.mainfeed{

display: flex;

flex-direction: row;

align-items: center;

}

/* CSS Atributes for area where you input new block posts */

.input{

display: flex;

flex-direction: column-reverse;

width: 100%;

align-items: center;

}

.button {

/*Color of button*/

background-color: #a0a0a0;

border: none;

/*Color of text*/

color: white;

/*Size of box*/

padding: 12px 32px;

/*Where text should go*/

text-align: center;

display: inline-block;

font-size: 16px;

margin: 2px;

/*What mouse type is when hovering over*/

cursor: pointer;

position: fixed;

/*Positions relative to page, rmb right means how much dist away from right side*/

right: 150px;

top: 200px;

border-radius: 30px;

}

/*Color when hovering over*/

.button:hover{

background-color: #cecece;

}

.pickblock{

height: 350px;

width: 300px;

margin: 60px;

background-color: #a0a0a0;

position: fixed;

right: 20px;

top: 250px;

display: flex;

align-items: center;

justify-content: center;

}

.red{

/*Size of the icon*/

height: 75px;

width: 75px;

background-color: rgb(134, 5, 5);

/*Margin is the area around the object, 1 argument specifies all 4 sides*/

/*Two means first value top and bottom, and second arg left right*/

/*Three means first to top, second right and left, and third is bottom*/

/*Four is self explanatory*/

margin: 25px;

/*Removes pointy edges around icon*/

border-radius: 10px;

/*Remove line around red icon*/

border: 0px;

}

.red:hover{

background-color: rgb(187, 84, 84);

}

.blue{

height: 75px;

width: 75px;

background-color: rgb(21, 0, 141);

margin: 25px;

/*Removes pointy edges around icon*/

border-radius: 10px;

/*Remove line around red icon*/

border: 0px;

}

.blue:hover{

background-color: rgb(90, 80, 145);

}

.green{

height: 75px;

width: 75px;

background-color: rgb(59, 110, 0);

margin: 25px;

/*Removes pointy edges around icon*/

border-radius: 10px;

/*Remove line around red icon*/

border: 0px;

}

.green:hover{

background-color: rgb(109, 126, 90);

}

.purple{

height: 75px;

width: 75px;

background-color: rgb(58, 0, 97);

margin: 25px;

/*Removes pointy edges around icon*/

border-radius: 10px;

/*Remove line around red icon*/

border: 0px;

}

.purple:hover{

background-color: rgb(80, 65, 90);

}

Blockstagram + Post Block