text: import React, { useEffect, useState } from 'react'
  import Protected from 'src/components/protected/protected'
  import {
      CSidebarNav,
      CSidebarNavDropdown,
      CSidebarNavTitle,
      CNavItem,
      CSidebarNavItem,
      CNavLink,
      CNav,
      CButton
  } from '@coreui/react'
  
  import { NavLink } from 'react-router-dom';
  import _nav from './_nav';
  
  import * as BsIcon from "react-icons/bs";
  
  
  const NavItemSwitcher = props => {
      const { _component } = props
      switch (_component._tag) {
          case "CSidebarNavItem":
              return (
                  <Protected id={_component.id}>
                      <CNavLink to={_component.to} style={navStyle} >
                          {_component.icon}
                          {_component.name}
                      </CNavLink>
                  </Protected>
              )
              break;
          case "CSidebarNavDropdown":
              return (
                  <Protected id={_component.id}>
                      <CSidebarNavDropdown style={navDropDownStyle} name={_component.name} icon={_component.icon} >
                          {
                              _component.hasOwnProperty("_children") ?
                                  _component._children.map(_child =>
                                      <NavItemSwitcher _component={_child} />
                                  ) : <>
                                  </>
                          }
                      </CSidebarNavDropdown>
                  </Protected>
              )
              break
          default:
              break;
      }
  }
  
  const ProtectedNav = () => {
      return (
          <CSidebarNav>
              {
                  _nav.map(component => (
                      <NavItemSwitcher _component={component} />
                  ))
              }
          </CSidebarNav>
      );
  };
  
  const navStyle = {
      color: "#ffffff",
      padding: "16px"
  }
  
  const navDropDownStyle = {
      color: "#ffffff",
  }
  
  export default ProtectedNav;