Finished controllers UI

src/components/layout/Sidebar.tsx

@@ -5,12 +5,14 @@ import {
   RadioTower,
   Settings,
   Wrench,
+  Router
 } from 'lucide-react';
 
 import logoIcon from '@/assets/logo-icon.png';
 
 const items = [
   ['Painel', Gauge],
+  ['Controladores', Router],
   ['Configuração UDP2RAW', RadioTower],
   ['Provisionamento', Wrench],
   ['Registos de Atividade', FileClock],
@@ -57,18 +59,16 @@ export function Sidebar({
               key={label}
               type="button"
               onClick={() => onSelect(label)}
-              className={`group flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-semibold transition-all duration-200 ${
-                isActive
+              className={`group flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-semibold transition-all duration-200 ${isActive
                   ? 'border border-blue-500/20 bg-blue-500/15 text-white shadow-[0_0_25px_rgba(59,130,246,0.12)]'
                   : 'border border-transparent text-slate-300 hover:border-white/5 hover:bg-white/[0.035] hover:text-white'
-              }`}
+                }`}
             >
               <div
-                className={`rounded-xl p-2 transition ${
-                  isActive
+                className={`rounded-xl p-2 transition ${isActive
                     ? 'bg-blue-500/10 text-blue-300'
                     : 'bg-white/[0.03] text-slate-400 group-hover:text-slate-200'
-                }`}
+                  }`}
               >
                 <Icon size={17} />
               </div>