Initial project structure cleanup

2026-05-08 16:57:55 +01:00
commit 8075104243
59 changed files with 22335 additions and 0 deletions
@@ -0,0 +1,83 @@
+import {
+  FileClock,
+  Gauge,
+  RadioTower,
+  Settings,
+  Shield,
+  Wrench,
+} from 'lucide-react';
+
+const items = [
+  ['Dashboard', Gauge],
+  ['UDP2RAW Config', RadioTower],
+  ['Provisioning', Wrench],
+  ['Activity Logs', FileClock],
+  ['Workstation', Settings],
+] as const;
+
+type SidebarProps = {
+  active: string;
+  onSelect: (value: string) => void;
+};
+
+export function Sidebar({
+  active,
+  onSelect,
+}: SidebarProps) {
+  return (
+    <aside className="flex h-screen w-64 flex-col border-r border-white/10 bg-ink-950 px-4 py-5">
+      <div className="mb-8 flex items-center gap-3">
+        <div className="rounded-2xl bg-blue-500/15 p-3 text-blue-300">
+          <Shield />
+        </div>
+
+        <div>
+          <h1 className="font-bold text-white">
+            Litoral Regas
+          </h1>
+
+          <p className="text-xs text-slate-400">
+            VPN Orchestrator
+          </p>
+        </div>
+      </div>
+
+      <nav className="space-y-1">
+        {items.map(([label, Icon]) => {
+          const isActive = active === label;
+
+          return (
+            <button
+              key={label}
+              type="button"
+              onClick={() => onSelect(label)}
+              className={`flex w-full items-center gap-3 rounded-xl px-3 py-3 text-left text-sm font-medium transition ${
+                isActive
+                  ? 'bg-blue-500/15 text-blue-200'
+                  : 'text-slate-300 hover:bg-white/5 hover:text-white'
+              }`}
+            >
+              <Icon size={18} />
+              {label}
+            </button>
+          );
+        })}
+      </nav>
+
+      <div className="mt-auto rounded-2xl border border-white/10 bg-white/[0.03] p-4">
+        <div className="flex items-center gap-2 text-sm text-green-300">
+          <span className="h-2 w-2 rounded-full bg-green-400" />
+          Backend connected
+        </div>
+
+        <p className="mt-2 text-xs text-slate-400">
+          localhost:8080
+        </p>
+
+        <div className="mt-5 border-t border-white/10 pt-4 text-xs text-slate-500">
+          Version 1.0.0
+        </div>
+      </div>
+    </aside>
+  );
+}