JSX element 'div' has no corresponding closing tag- Error

Question

I am having trouble knowing when to use brackets with slash </> or <> When and where to close these tags? Is there someplace to run this code and have it edit this?

function Sidebar({initialSelectedIcon= 'Home'}){ const [selected, setSelected] = useState(initialSelectedIcon) return(

   <SidebarOption 
        Icon = {selected = 'Home'? RiHome7Fill : RiHome7Line}
        text = 'Home' 
        isActive = {Boolean(selected = 'Home')}
        setSelected = {setSelected} 
        redirect = {'/'} 
   />
   
   <SidebarOption 
        Icon = {selected = 'Explore'? FaHashtag : BiHash}
        text = "Explore" 
        isActive = {Boolean(selected = 'Explore')}
        setSelected = {setSelected} 
   />
   
   <div>Notifications</div>
   <div>Messages</div> 
   <div>Bookmarks</div>
   <div>Lists</div>
   <div>Profile</div>
   <div>More</div>
    
    <div className = {style.tweetButton}>Mint</div>
    <div className = {style.profileLeft}></div>
    <div className = {style.profileRight}>
    <div className = {style.details}>
    <div className = {style.name}>dustinCar</div>
    <div className = {style.handle}>@dusto69</div>
    
    </div>
        <FiMoreHorizontal />
    </div>
    
)

}

export default SidebarOption