chore: initial project setup with backend, frontend, CI/CD, and documentation

Add complete NexaFabric project structure including: - FastAPI backend with SQLAlchemy models, JWT auth, RBAC, audit logging, and provider interfaces - React + TypeScript frontend with Vite, Tailwind CSS, TanStack Query, and Zustand - Docker Compose configuration for PostgreSQL, Redis, API, worker, frontend, and nginx - GitHub Actions and GitLab CI workflows for testing, linting, building, and security scanning - Environment
2026-07-09 12:10:35 +02:00
commit 14e7710120
83 changed files with 2887 additions and 0 deletions
@@ -0,0 +1,48 @@
+import { Save, Wand2 } from "lucide-react";
+
+import { PageHeader } from "../components/PageHeader";
+
+export function PolicyDesigner() {
+  return (
+    <>
+      <PageHeader title="Policy Designer" subtitle="Build tenant-aware microsegmentation policies and inspect their intended impact." />
+      <div className="grid gap-4 lg:grid-cols-[1fr_360px]">
+        <section className="rounded-md border border-border bg-panel p-4">
+          <div className="grid gap-4 md:grid-cols-2">
+            {["Source", "Destination", "Service", "Action", "Direction", "Logging"].map((label) => (
+              <label key={label} className="text-sm">
+                {label}
+                <select className="mt-1 h-10 w-full rounded-md border border-border bg-transparent px-3">
+                  <option>{label === "Action" ? "allow" : label === "Direction" ? "ingress" : "Any"}</option>
+                </select>
+              </label>
+            ))}
+          </div>
+          <label className="mt-4 block text-sm">
+            Description
+            <input className="mt-1 h-10 w-full rounded-md border border-border bg-transparent px-3" placeholder="Policy intent" />
+          </label>
+          <div className="mt-5 flex gap-3">
+            <button className="inline-flex h-10 items-center gap-2 rounded-md border border-border px-4 text-sm">
+              <Wand2 size={18} />
+              Dry Run
+            </button>
+            <button className="inline-flex h-10 items-center gap-2 rounded-md bg-accent px-4 text-sm text-white">
+              <Save size={18} />
+              Save
+            </button>
+          </div>
+        </section>
+        <aside className="rounded-md border border-border bg-panel p-4">
+          <div className="mb-3 font-medium">Impact Preview</div>
+          <div className="space-y-3 text-sm text-slate-600 dark:text-slate-300">
+            <div className="rounded-md border border-border p-3">Affected VMs: calculated after dry run</div>
+            <div className="rounded-md border border-border p-3">Conflicts: none detected in draft</div>
+            <div className="rounded-md border border-border p-3">Generated rules: preview required before apply</div>
+          </div>
+        </aside>
+      </div>
+    </>
+  );
+}
+