How do I create a Logout link (with icon) at the footer of the sidebar ? (in React)

[axilaris]

How do I create a Logout link (with icon) at the footer of the sidebar ? (in React)

[mrholek]

@axilaris <CNavItem> should be wrapped in <CSidebarNav>

[axilaris]

@mrholek
Thanks a lot. it manage to disappear the icon and text altogether when collapse.

but i actually want the icon to appear when collapse. what can be done ?

      <CSidebarNav>
        <CNavItem customClassName="nav-icon">
          <CNavLink to='/logout'>
            <CIcon icon={cilAccountLogout} className="me-2" />
            Logout
          </CNavLink>
        </CNavItem>
      </CSidebarNav>

another way i thought is this, but this disappear the icon but not the text. its the other way round that i want. icon should be maintain when collapse.

      <CSidebarFooter style={{ cursor: 'pointer' }}>               

            <CIcon icon={cilAccountLogout} height={20} onClick={handleLogout}/>      
            <div onClick={handleLogout} style={{fontSize: 15 }}> Logout</div>  


        <CSidebarToggler
          onClick={() => dispatch({ type: 'set', sidebarUnfoldable: !unfoldable })}
        />        
      </CSidebarFooter>

[axilaris]

@mrholek I'ved posted this issue also on stackoverflow. https://stackoverflow.com/questions/78282849/coreui-how-do-i-create-a-logout-link-with-icon-at-the-footer-csidebarfooter

Thanks.