Hi Zac,
If I take it back to basically what you have in the course examples it works – as in the image appears in the block as expected.
I can also add the HTML for the controls and when the image appears in the block so do the controls (expected behaviour)
When I try and add the conditional around the controls HTML the image no longer appears in the block. It seems this bit is what is tripping me up:
) : (
<Fragment>
<p class="image-wrapper">
<img
src={ imgURL }
alt={ imgAlt }
/>
</p>
</Fragment>,
carouselControls && ( <-- THIS IS WHERE IT GOES WRONG
<Fragment>
<a className="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
<span className="carousel-control-prev-icon" aria-hidden="true"></span>
<span className="sr-only">Previous</span>
</a>
<a className="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
<span className="carousel-control-next-icon" aria-hidden="true"></span>
<span className="sr-only">Next</span>
</a>
</Fragment>
) //end carousel controls check
) //end if has image