Sidebar Navigation - Copy this React, Tailwind Component to your project

Necesito en mi barra lateral aside de html5 generar una lista de opciones en donde la primer opcion SOCOS debera expandir los sub niveles y en la opcion socos debera tener un icono de arriba abajo. para expandir o reducir. <ul class="nav flex column"> <li class="nav item p 0"> <a href="/dytsa/" class="nav link text white p 2" title="Inicio">Inicio</a> </li> <li class="nav item p 0"> <a href="#" class="nav link bg black rounded text white p 2 mb 2" title="Servicios">SOCOS</a> <ul class="nav flex column p 0"> <li class="nav item p 0"> <a href="/dytsa/list/" class="rounded nav link text white p 2 ps 3" title="Listado">Listado</a> </li> <li class="nav item p 0"> <a href="/dytsa/articles/" class="rounded nav link text white p 2 ps 3" title="Artículos">Artículos</a> </li> <li class="nav item p 0"> <a href="/dytsa/orders/" class="rounded nav link text white p 2 ps 3" title="Pedidos">Pedidos</a> </li> <li class="nav item p 0"> <a href="/dytsa/clients/" class="rounded nav link text white p 2 ps 3" title="Clientes">Clientes</a> </li> <li class="nav item p 0"> <a href="/dytsa/users/" class="rounded nav link text white p 2 ps 3" title="Usuarios">Usuarios</a> </li> <li class="nav item p 0"> <a href="/dytsa/plants/" class="rounded nav link text white p 2 ps 3" title="Plantas">Plantas</a> </li> </ul> </li> </ul>