@gagandeep023/api-gateway 0.1.0

package/dist/frontend/GatewayDashboard.css

@@ -0,0 +1,303 @@
+/* @gagandeep023/api-gateway - Dashboard Styles
+   Override --gw-* CSS custom properties to match your theme. */
+
+.gw-dashboard {
+  --gw-bg-primary: #0a0a0a;
+  --gw-bg-card: #1a1a1a;
+  --gw-border: #2a2a2a;
+  --gw-border-light: #3a3a3a;
+  --gw-text-primary: #e0e0e0;
+  --gw-text-secondary: #b0b0b0;
+  --gw-text-muted: #888888;
+  --gw-accent: #64ffda;
+  --gw-danger: #cc4444;
+  --gw-warning: #ffd93d;
+  --gw-radius: 12px;
+  --gw-radius-sm: 8px;
+  --gw-font-mono: 'JetBrains Mono', 'Fira Code', monospace;
+  --gw-transition: 0.2s ease;
+
+  color: var(--gw-text-primary);
+}
+
+.gw-header {
+  margin-bottom: 40px;
+}
+
+.gw-header h1 {
+  font-size: 2rem;
+  color: var(--gw-text-primary);
+  margin: 0 0 8px;
+}
+
+.gw-header p {
+  color: var(--gw-text-secondary);
+  font-size: 0.95rem;
+  margin: 0;
+}
+
+.gw-status-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 12px;
+  padding: 4px 12px;
+  border-radius: 20px;
+  font-size: 0.8rem;
+  font-family: var(--gw-font-mono);
+  background: rgba(100, 255, 218, 0.1);
+  color: var(--gw-accent);
+  border: 1px solid rgba(100, 255, 218, 0.2);
+}
+
+.gw-status-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--gw-accent);
+  animation: gw-pulse 2s infinite;
+}
+
+@keyframes gw-pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.4; }
+}
+
+.gw-stats-grid {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 16px;
+  margin-bottom: 32px;
+}
+
+.gw-stat-card {
+  background: var(--gw-bg-card);
+  border: 1px solid var(--gw-border);
+  border-radius: var(--gw-radius-sm);
+  padding: 20px;
+  transition: border-color var(--gw-transition);
+}
+
+.gw-stat-card:hover {
+  border-color: var(--gw-border-light);
+}
+
+.gw-stat-label {
+  font-size: 0.8rem;
+  color: var(--gw-text-secondary);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  margin-bottom: 8px;
+}
+
+.gw-stat-value {
+  font-size: 1.8rem;
+  font-weight: 700;
+  color: var(--gw-text-primary);
+  font-family: var(--gw-font-mono);
+}
+
+.gw-stat-value.gw-accent {
+  color: var(--gw-accent);
+}
+
+.gw-stat-value.gw-danger {
+  color: var(--gw-danger);
+}
+
+.gw-stat-value.gw-warning {
+  color: var(--gw-warning);
+}
+
+.gw-charts-row {
+  display: grid;
+  grid-template-columns: 2fr 1fr;
+  gap: 24px;
+  margin-bottom: 32px;
+}
+
+.gw-chart-card {
+  background: var(--gw-bg-card);
+  border: 1px solid var(--gw-border);
+  border-radius: var(--gw-radius);
+  padding: 24px;
+}
+
+.gw-chart-title {
+  font-size: 0.9rem;
+  color: var(--gw-text-secondary);
+  margin-bottom: 16px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.gw-logs-section {
+  background: var(--gw-bg-card);
+  border: 1px solid var(--gw-border);
+  border-radius: var(--gw-radius);
+  padding: 24px;
+}
+
+.gw-logs-title {
+  font-size: 0.9rem;
+  color: var(--gw-text-secondary);
+  margin-bottom: 16px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.gw-logs-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-family: var(--gw-font-mono);
+  font-size: 0.8rem;
+}
+
+.gw-logs-table th {
+  text-align: left;
+  padding: 8px 12px;
+  color: var(--gw-text-muted);
+  border-bottom: 1px solid var(--gw-border);
+  font-weight: 500;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  font-size: 0.7rem;
+}
+
+.gw-logs-table td {
+  padding: 8px 12px;
+  color: var(--gw-text-secondary);
+  border-bottom: 1px solid rgba(42, 42, 42, 0.5);
+}
+
+.gw-logs-table tr:hover td {
+  color: var(--gw-text-primary);
+  background: rgba(255, 255, 255, 0.02);
+}
+
+.gw-method-badge {
+  padding: 2px 8px;
+  border-radius: 4px;
+  font-size: 0.7rem;
+  font-weight: 600;
+}
+
+.gw-method-get {
+  background: rgba(100, 255, 218, 0.1);
+  color: var(--gw-accent);
+}
+
+.gw-method-post {
+  background: rgba(255, 217, 61, 0.1);
+  color: var(--gw-warning);
+}
+
+.gw-method-delete {
+  background: rgba(255, 107, 107, 0.1);
+  color: var(--gw-danger);
+}
+
+.gw-status-ok {
+  color: var(--gw-accent);
+}
+
+.gw-status-error {
+  color: var(--gw-danger);
+}
+
+.gw-status-rate-limit {
+  color: var(--gw-warning);
+}
+
+.gw-config-section {
+  margin-top: 32px;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 24px;
+}
+
+.gw-config-card {
+  background: var(--gw-bg-card);
+  border: 1px solid var(--gw-border);
+  border-radius: var(--gw-radius);
+  padding: 24px;
+}
+
+.gw-config-card h3 {
+  font-size: 0.9rem;
+  color: var(--gw-text-secondary);
+  margin: 0 0 16px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.gw-tier-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 0;
+  border-bottom: 1px solid rgba(42, 42, 42, 0.5);
+}
+
+.gw-tier-name {
+  color: var(--gw-accent);
+  font-family: var(--gw-font-mono);
+  font-size: 0.85rem;
+}
+
+.gw-tier-detail {
+  color: var(--gw-text-muted);
+  font-size: 0.8rem;
+}
+
+@media (max-width: 900px) {
+  .gw-stats-grid {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+  .gw-charts-row {
+    grid-template-columns: 1fr;
+  }
+
+  .gw-config-section {
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (max-width: 768px) {
+  .gw-logs-section {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    padding: 16px;
+  }
+
+  .gw-logs-table {
+    min-width: 600px;
+  }
+
+  .gw-header h1 {
+    font-size: 1.6rem;
+  }
+}
+
+@media (max-width: 600px) {
+  .gw-stats-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .gw-stat-card {
+    padding: 16px;
+  }
+
+  .gw-stat-value {
+    font-size: 1.5rem;
+  }
+
+  .gw-chart-card {
+    padding: 16px;
+  }
+
+  .gw-config-card {
+    padding: 16px;
+  }
+}

package/dist/frontend/index.d.mts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface GatewayDashboardProps {
+    apiBaseUrl: string;
+}
+declare function GatewayDashboard({ apiBaseUrl }: GatewayDashboardProps): react_jsx_runtime.JSX.Element;
+
+export { GatewayDashboard, type GatewayDashboardProps };

package/dist/frontend/index.d.ts

@@ -0,0 +1,8 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface GatewayDashboardProps {
+    apiBaseUrl: string;
+}
+declare function GatewayDashboard({ apiBaseUrl }: GatewayDashboardProps): react_jsx_runtime.JSX.Element;
+
+export { GatewayDashboard, type GatewayDashboardProps };

package/dist/frontend/index.js

@@ -0,0 +1,270 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/frontend/index.ts
+var frontend_exports = {};
+__export(frontend_exports, {
+  GatewayDashboard: () => GatewayDashboard
+});
+module.exports = __toCommonJS(frontend_exports);
+
+// src/frontend/GatewayDashboard.tsx
+var import_react = require("react");
+var import_recharts = require("recharts");
+var import_jsx_runtime = require("react/jsx-runtime");
+function useGatewayApi(apiBaseUrl, path) {
+  const [data, setData] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    fetch(`${apiBaseUrl}${path}`).then((r) => r.json()).then(setData).catch(() => {
+    });
+  }, [apiBaseUrl, path]);
+  return { data };
+}
+function GatewayDashboard({ apiBaseUrl }) {
+  const [analytics, setAnalytics] = (0, import_react.useState)(null);
+  const [rpmHistory, setRpmHistory] = (0, import_react.useState)([]);
+  const { data: config } = useGatewayApi(apiBaseUrl, "/gateway/config");
+  const { data: logsData } = useGatewayApi(apiBaseUrl, "/gateway/logs?limit=20");
+  const eventSourceRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    const es = new EventSource(`${apiBaseUrl}/gateway/analytics/live`);
+    eventSourceRef.current = es;
+    es.onmessage = (event) => {
+      const data = JSON.parse(event.data);
+      setAnalytics(data);
+      setRpmHistory((prev) => {
+        const next = [
+          ...prev,
+          { time: (/* @__PURE__ */ new Date()).toLocaleTimeString(), rpm: data.requestsPerMinute }
+        ];
+        return next.slice(-20);
+      });
+    };
+    return () => {
+      es.close();
+    };
+  }, [apiBaseUrl]);
+  const getMethodClass = (method) => {
+    switch (method) {
+      case "GET":
+        return "gw-method-get";
+      case "POST":
+        return "gw-method-post";
+      case "DELETE":
+        return "gw-method-delete";
+      default:
+        return "gw-method-get";
+    }
+  };
+  const getStatusClass = (code) => {
+    if (code === 429) return "gw-status-rate-limit";
+    if (code >= 400) return "gw-status-error";
+    return "gw-status-ok";
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-dashboard", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { children: "API Gateway Dashboard" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: "Real-time monitoring for the API gateway and rate limiter" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-status-badge", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-status-dot" }),
+        "Live"
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stats-grid", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Total Requests" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value", children: analytics?.totalRequests ?? 0 })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Requests / Min" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value gw-accent", children: analytics?.requestsPerMinute ?? 0 })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Error Rate" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `gw-stat-value ${analytics && analytics.errorRate > 5 ? "gw-danger" : ""}`, children: [
+          analytics?.errorRate ?? 0,
+          "%"
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Avg Response Time" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-value", children: [
+          analytics?.avgResponseTime ?? 0,
+          "ms"
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stats-grid", style: { marginBottom: 32 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Rate Limit Hits" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value gw-warning", children: analytics?.rateLimitHits ?? 0 })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Active IPs" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value", children: analytics?.activeClients ?? 0 })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Active Key Sessions" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value", children: analytics?.activeKeyUses ?? 0 })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-stat-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-label", children: "Rate Limit Tiers" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-stat-value", children: config ? Object.keys(config.rateLimits.tiers).length : 0 })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-charts-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-chart-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-chart-title", children: "Requests Per Minute" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height: 250, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_recharts.LineChart, { data: rpmHistory, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "var(--gw-border, #2a2a2a)" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.XAxis, { dataKey: "time", tick: { fill: "var(--gw-text-muted, #888)", fontSize: 11 } }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.YAxis, { tick: { fill: "var(--gw-text-muted, #888)", fontSize: 11 } }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_recharts.Tooltip,
+            {
+              contentStyle: { background: "var(--gw-bg-card, #1a1a1a)", border: "1px solid var(--gw-border, #2a2a2a)", borderRadius: 8 },
+              labelStyle: { color: "var(--gw-text-muted, #888)" }
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_recharts.Line,
+            {
+              type: "monotone",
+              dataKey: "rpm",
+              stroke: "var(--gw-accent, #64ffda)",
+              strokeWidth: 2,
+              dot: false,
+              activeDot: { r: 4, fill: "var(--gw-accent, #64ffda)" }
+            }
+          )
+        ] }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-chart-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-chart-title", children: "Top Endpoints" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height: 250, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          import_recharts.BarChart,
+          {
+            data: analytics?.topEndpoints ?? [],
+            layout: "vertical",
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.CartesianGrid, { strokeDasharray: "3 3", stroke: "var(--gw-border, #2a2a2a)" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.XAxis, { type: "number", tick: { fill: "var(--gw-text-muted, #888)", fontSize: 11 } }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_recharts.YAxis,
+                {
+                  dataKey: "path",
+                  type: "category",
+                  tick: { fill: "var(--gw-text-muted, #888)", fontSize: 10 },
+                  width: 120
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_recharts.Tooltip,
+                {
+                  contentStyle: { background: "var(--gw-bg-card, #1a1a1a)", border: "1px solid var(--gw-border, #2a2a2a)", borderRadius: 8 }
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_recharts.Bar, { dataKey: "count", fill: "var(--gw-accent, #64ffda)", radius: [0, 4, 4, 0] })
+            ]
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-logs-section", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "gw-logs-title", children: "Recent Requests" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("table", { className: "gw-logs-table", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tr", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "Time" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "Method" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "Path" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "Status" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "Duration" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { children: "IP" })
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tbody", { children: [
+          (logsData?.logs ?? []).map((log, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("tr", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { children: new Date(log.timestamp).toLocaleTimeString() }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `gw-method-badge ${getMethodClass(log.method)}`, children: log.method }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { children: log.path }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { className: getStatusClass(log.statusCode), children: log.statusCode }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("td", { children: [
+              log.responseTime,
+              "ms"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { children: log.ip })
+          ] }, i)),
+          (!logsData?.logs || logsData.logs.length === 0) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { colSpan: 6, style: { textAlign: "center", color: "var(--gw-text-muted, #666)" }, children: "No requests logged yet. Make some API calls to see data here." }) })
+        ] })
+      ] })
+    ] }),
+    config && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-config-section", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-config-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: "Rate Limit Tiers" }),
+        Object.entries(config.rateLimits.tiers).map(([name, tier]) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: name }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: tier.algorithm === "none" ? "unlimited" : `${tier.maxRequests} req / ${(tier.windowMs || 6e4) / 1e3}s` })
+        ] }, name))
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-config-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: "IP Rules" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Mode" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.ipRules.mode })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Allowlist" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.ipRules.allowlist.length === 0 ? "empty" : config.ipRules.allowlist.length + " IPs" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Blocklist" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.ipRules.blocklist.length === 0 ? "empty" : config.ipRules.blocklist.length + " IPs" })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-config-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: "Global Limit" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Max Requests" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "gw-tier-detail", children: [
+            config.rateLimits.globalLimit.maxRequests,
+            " / ",
+            config.rateLimits.globalLimit.windowMs / 1e3,
+            "s"
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Default Tier" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.rateLimits.defaultTier })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Active Keys" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.activeKeys })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "gw-tier-item", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-name", children: "Active Key Sessions" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gw-tier-detail", children: config.activeKeyUses })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GatewayDashboard
+});
+//# sourceMappingURL=index.js.map

package/dist/frontend/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/frontend/index.ts","../../src/frontend/GatewayDashboard.tsx"],"sourcesContent":["export { GatewayDashboard } from './GatewayDashboard';\nexport type { GatewayDashboardProps } from './GatewayDashboard';\n","import { useState, useEffect, useRef } from 'react';\nimport { LineChart, Line, BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer } from 'recharts';\nimport type { GatewayAnalytics, GatewayConfig, RequestLog } from '../types';\n\nexport interface GatewayDashboardProps {\n  apiBaseUrl: string;\n}\n\ninterface LogsResponse {\n  logs: RequestLog[];\n  limit: number;\n  offset: number;\n}\n\nfunction useGatewayApi<T>(apiBaseUrl: string, path: string): { data: T | null } {\n  const [data, setData] = useState<T | null>(null);\n  useEffect(() => {\n    fetch(`${apiBaseUrl}${path}`)\n      .then(r => r.json())\n      .then(setData)\n      .catch(() => {});\n  }, [apiBaseUrl, path]);\n  return { data };\n}\n\nexport function GatewayDashboard({ apiBaseUrl }: GatewayDashboardProps) {\n  const [analytics, setAnalytics] = useState<GatewayAnalytics | null>(null);\n  const [rpmHistory, setRpmHistory] = useState<{ time: string; rpm: number }[]>([]);\n  const { data: config } = useGatewayApi<GatewayConfig>(apiBaseUrl, '/gateway/config');\n  const { data: logsData } = useGatewayApi<LogsResponse>(apiBaseUrl, '/gateway/logs?limit=20');\n  const eventSourceRef = useRef<EventSource | null>(null);\n\n  useEffect(() => {\n    const es = new EventSource(`${apiBaseUrl}/gateway/analytics/live`);\n    eventSourceRef.current = es;\n\n    es.onmessage = (event) => {\n      const data: GatewayAnalytics = JSON.parse(event.data);\n      setAnalytics(data);\n      setRpmHistory(prev => {\n        const next = [\n          ...prev,\n          { time: new Date().toLocaleTimeString(), rpm: data.requestsPerMinute },\n        ];\n        return next.slice(-20);\n      });\n    };\n\n    return () => {\n      es.close();\n    };\n  }, [apiBaseUrl]);\n\n  const getMethodClass = (method: string) => {\n    switch (method) {\n      case 'GET': return 'gw-method-get';\n      case 'POST': return 'gw-method-post';\n      case 'DELETE': return 'gw-method-delete';\n      default: return 'gw-method-get';\n    }\n  };\n\n  const getStatusClass = (code: number) => {\n    if (code === 429) return 'gw-status-rate-limit';\n    if (code >= 400) return 'gw-status-error';\n    return 'gw-status-ok';\n  };\n\n  return (\n    <div className=\"gw-dashboard\">\n      <div className=\"gw-header\">\n        <h1>API Gateway Dashboard</h1>\n        <p>Real-time monitoring for the API gateway and rate limiter</p>\n        <div className=\"gw-status-badge\">\n          <span className=\"gw-status-dot\" />\n          Live\n        </div>\n      </div>\n\n      {/* Stats Grid */}\n      <div className=\"gw-stats-grid\">\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Total Requests</div>\n          <div className=\"gw-stat-value\">{analytics?.totalRequests ?? 0}</div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Requests / Min</div>\n          <div className=\"gw-stat-value gw-accent\">\n            {analytics?.requestsPerMinute ?? 0}\n          </div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Error Rate</div>\n          <div className={`gw-stat-value ${analytics && analytics.errorRate > 5 ? 'gw-danger' : ''}`}>\n            {analytics?.errorRate ?? 0}%\n          </div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Avg Response Time</div>\n          <div className=\"gw-stat-value\">{analytics?.avgResponseTime ?? 0}ms</div>\n        </div>\n      </div>\n\n      {/* Second Row Stats */}\n      <div className=\"gw-stats-grid\" style={{ marginBottom: 32 }}>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Rate Limit Hits</div>\n          <div className=\"gw-stat-value gw-warning\">\n            {analytics?.rateLimitHits ?? 0}\n          </div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Active IPs</div>\n          <div className=\"gw-stat-value\">{analytics?.activeClients ?? 0}</div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Active Key Sessions</div>\n          <div className=\"gw-stat-value\">{analytics?.activeKeyUses ?? 0}</div>\n        </div>\n        <div className=\"gw-stat-card\">\n          <div className=\"gw-stat-label\">Rate Limit Tiers</div>\n          <div className=\"gw-stat-value\">\n            {config ? Object.keys(config.rateLimits.tiers).length : 0}\n          </div>\n        </div>\n      </div>\n\n      {/* Charts Row */}\n      <div className=\"gw-charts-row\">\n        <div className=\"gw-chart-card\">\n          <div className=\"gw-chart-title\">Requests Per Minute</div>\n          <ResponsiveContainer width=\"100%\" height={250}>\n            <LineChart data={rpmHistory}>\n              <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--gw-border, #2a2a2a)\" />\n              <XAxis dataKey=\"time\" tick={{ fill: 'var(--gw-text-muted, #888)', fontSize: 11 }} />\n              <YAxis tick={{ fill: 'var(--gw-text-muted, #888)', fontSize: 11 }} />\n              <Tooltip\n                contentStyle={{ background: 'var(--gw-bg-card, #1a1a1a)', border: '1px solid var(--gw-border, #2a2a2a)', borderRadius: 8 }}\n                labelStyle={{ color: 'var(--gw-text-muted, #888)' }}\n              />\n              <Line\n                type=\"monotone\"\n                dataKey=\"rpm\"\n                stroke=\"var(--gw-accent, #64ffda)\"\n                strokeWidth={2}\n                dot={false}\n                activeDot={{ r: 4, fill: 'var(--gw-accent, #64ffda)' }}\n              />\n            </LineChart>\n          </ResponsiveContainer>\n        </div>\n\n        <div className=\"gw-chart-card\">\n          <div className=\"gw-chart-title\">Top Endpoints</div>\n          <ResponsiveContainer width=\"100%\" height={250}>\n            <BarChart\n              data={analytics?.topEndpoints ?? []}\n              layout=\"vertical\"\n            >\n              <CartesianGrid strokeDasharray=\"3 3\" stroke=\"var(--gw-border, #2a2a2a)\" />\n              <XAxis type=\"number\" tick={{ fill: 'var(--gw-text-muted, #888)', fontSize: 11 }} />\n              <YAxis\n                dataKey=\"path\"\n                type=\"category\"\n                tick={{ fill: 'var(--gw-text-muted, #888)', fontSize: 10 }}\n                width={120}\n              />\n              <Tooltip\n                contentStyle={{ background: 'var(--gw-bg-card, #1a1a1a)', border: '1px solid var(--gw-border, #2a2a2a)', borderRadius: 8 }}\n              />\n              <Bar dataKey=\"count\" fill=\"var(--gw-accent, #64ffda)\" radius={[0, 4, 4, 0]} />\n            </BarChart>\n          </ResponsiveContainer>\n        </div>\n      </div>\n\n      {/* Recent Logs */}\n      <div className=\"gw-logs-section\">\n        <div className=\"gw-logs-title\">Recent Requests</div>\n        <table className=\"gw-logs-table\">\n          <thead>\n            <tr>\n              <th>Time</th>\n              <th>Method</th>\n              <th>Path</th>\n              <th>Status</th>\n              <th>Duration</th>\n              <th>IP</th>\n            </tr>\n          </thead>\n          <tbody>\n            {(logsData?.logs ?? []).map((log, i) => (\n              <tr key={i}>\n                <td>{new Date(log.timestamp).toLocaleTimeString()}</td>\n                <td>\n                  <span className={`gw-method-badge ${getMethodClass(log.method)}`}>\n                    {log.method}\n                  </span>\n                </td>\n                <td>{log.path}</td>\n                <td className={getStatusClass(log.statusCode)}>{log.statusCode}</td>\n                <td>{log.responseTime}ms</td>\n                <td>{log.ip}</td>\n              </tr>\n            ))}\n            {(!logsData?.logs || logsData.logs.length === 0) && (\n              <tr>\n                <td colSpan={6} style={{ textAlign: 'center', color: 'var(--gw-text-muted, #666)' }}>\n                  No requests logged yet. Make some API calls to see data here.\n                </td>\n              </tr>\n            )}\n          </tbody>\n        </table>\n      </div>\n\n      {/* Config Section */}\n      {config && (\n        <div className=\"gw-config-section\">\n          <div className=\"gw-config-card\">\n            <h3>Rate Limit Tiers</h3>\n            {Object.entries(config.rateLimits.tiers).map(([name, tier]) => (\n              <div key={name} className=\"gw-tier-item\">\n                <span className=\"gw-tier-name\">{name}</span>\n                <span className=\"gw-tier-detail\">\n                  {tier.algorithm === 'none'\n                    ? 'unlimited'\n                    : `${tier.maxRequests} req / ${(tier.windowMs || 60000) / 1000}s`}\n                </span>\n              </div>\n            ))}\n          </div>\n\n          <div className=\"gw-config-card\">\n            <h3>IP Rules</h3>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Mode</span>\n              <span className=\"gw-tier-detail\">{config.ipRules.mode}</span>\n            </div>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Allowlist</span>\n              <span className=\"gw-tier-detail\">\n                {config.ipRules.allowlist.length === 0 ? 'empty' : config.ipRules.allowlist.length + ' IPs'}\n              </span>\n            </div>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Blocklist</span>\n              <span className=\"gw-tier-detail\">\n                {config.ipRules.blocklist.length === 0 ? 'empty' : config.ipRules.blocklist.length + ' IPs'}\n              </span>\n            </div>\n          </div>\n\n          <div className=\"gw-config-card\">\n            <h3>Global Limit</h3>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Max Requests</span>\n              <span className=\"gw-tier-detail\">\n                {config.rateLimits.globalLimit.maxRequests} / {config.rateLimits.globalLimit.windowMs / 1000}s\n              </span>\n            </div>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Default Tier</span>\n              <span className=\"gw-tier-detail\">{config.rateLimits.defaultTier}</span>\n            </div>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Active Keys</span>\n              <span className=\"gw-tier-detail\">{config.activeKeys}</span>\n            </div>\n            <div className=\"gw-tier-item\">\n              <span className=\"gw-tier-name\">Active Key Sessions</span>\n              <span className=\"gw-tier-detail\">{config.activeKeyUses}</span>\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}