Help Please. Random Qoute Machine

[profsaini]

Hi friends.
I’m having challenges passing my random color as props to QouteAndAuthor component.
I have a component QouteAndAuthor for qoute and author UI.
I’m generating random color in App.js
Passing this color to QouteAndAuthor.js component not working
Kindly check and your suggestion on how to fix this.
Github link: GitHub - Profsain/React-Random-Qoute-Machine: React random qoute machine Free Code Camp Frontend Development Project
My apology my code is really messy Newbe things.
Thanks.

[kevinSmith]

If I log out props from QuoteAndAuthorComponent, I see this:

{
  "quotes": {
    "quote": "The mind is everything. What you think you become.",
    "author": "Buddha",
    "accentColor": "#66664D"
  },
  "accentColor": {
    "quote": "The mind is everything. What you think you become.",
    "author": "Buddha",
    "accentColor": "#66664D"
  },
  "style": {}
}

Do you see the issue? And check here, in App.js:

        <QuoteAndAuthor
          quotes={this.state}
          generateRandomQuote={this.generateRandomQuote}
          accentColor={this.state}
          style={{"color": this.accentColor}}
        /> 

You are saving all of state into two different variables, so in the subcomponent, you don’t get the props shape that you want.

[profsaini]

Thank you very much. I removed the double passing of state and it works.
I appreciate you.