@splyntra/dashboard 0.3.0

package/src/lib/project-context.tsx

@@ -0,0 +1,47 @@
+// SPDX-License-Identifier: AGPL-3.0-only
+"use client";
+
+import { createContext, useContext, useEffect, useState, useCallback } from "react";
+import { useQueryClient } from "@tanstack/react-query";
+import { getActiveProject, setActiveProject } from "@/lib/api";
+
+interface ProjectContextValue {
+  /** Active project id, or "" for the API key's default project. */
+  projectId: string;
+  setProjectId: (id: string) => void;
+}
+
+const ProjectContext = createContext<ProjectContextValue>({
+  projectId: "",
+  setProjectId: () => {},
+});
+
+export function ProjectProvider({ children }: { children: React.ReactNode }) {
+  const [projectId, setProjectIdState] = useState("");
+  const queryClient = useQueryClient();
+
+  // Hydrate from localStorage on mount (avoids SSR mismatch).
+  useEffect(() => {
+    setProjectIdState(getActiveProject());
+  }, []);
+
+  const setProjectId = useCallback(
+    (id: string) => {
+      setActiveProject(id);
+      setProjectIdState(id);
+      // Switching project changes the scope of every query — refetch all.
+      queryClient.invalidateQueries();
+    },
+    [queryClient]
+  );
+
+  return (
+    <ProjectContext.Provider value={{ projectId, setProjectId }}>
+      {children}
+    </ProjectContext.Provider>
+  );
+}
+
+export function useProject(): ProjectContextValue {
+  return useContext(ProjectContext);
+}

package/src/lib/slots.ts

@@ -0,0 +1,50 @@
+// SPDX-License-Identifier: AGPL-3.0-only
+// Extension slots for the dashboard. The open build registers nothing, so these
+// are empty; the private frontend/cloud-screens package calls registerNavItem
+// (from a module imported by the cloud web build) to contribute nav entries for
+// its screens. The screens' page files are composed into the app/ route tree at
+// cloud-build time — see the cloud-screens README.
+//
+// This keeps one dashboard codebase: the open viewer is fully usable alone, and
+// commercial screens mount in without the open repo importing any private code.
+
+export interface NavSlotItem {
+  href: string;
+  label: string;
+  /** lucide-react icon name, resolved by the Sidebar against its icon map. */
+  icon: string;
+  /** Optional feature flag that must be enabled for this item to render. */
+  feature?: string;
+}
+
+const navItems: NavSlotItem[] = [];
+
+/** Register a sidebar nav item. Called by commercial screen packages. */
+export function registerNavItem(item: NavSlotItem): void {
+  if (!navItems.some((i) => i.href === item.href)) {
+    navItems.push(item);
+  }
+}
+
+/** Nav items contributed by extension slots (empty in OSS). */
+export function navSlotItems(): readonly NavSlotItem[] {
+  return navItems;
+}
+
+// Widget slots: locations where a commercial build can mount a React component
+// (e.g. the org switcher in the sidebar). Empty in OSS.
+import type { ComponentType } from "react";
+
+export type WidgetSlot = "sidebarTop";
+
+const widgets: Record<WidgetSlot, ComponentType[]> = { sidebarTop: [] };
+
+/** Mount a component into a named widget slot. Called by commercial packages. */
+export function registerWidget(slot: WidgetSlot, component: ComponentType): void {
+  widgets[slot].push(component);
+}
+
+/** Components contributed to a widget slot (empty in OSS). */
+export function slotWidgets(slot: WidgetSlot): readonly ComponentType[] {
+  return widgets[slot];
+}

package/src/middleware.ts

@@ -0,0 +1,12 @@
+// SPDX-License-Identifier: AGPL-3.0-only
+import NextAuth from "next-auth";
+import { authConfig } from "@/auth.config";
+
+// Edge middleware uses the DB-free config to gate routes (the `authorized`
+// callback). Full credential verification happens in the Node auth instance.
+export const { auth: middleware } = NextAuth(authConfig);
+
+export const config = {
+  // Protect everything except Next internals and static assets.
+  matcher: ["/((?!_next/static|_next/image|favicon.ico).*)"],
+};

package/src/types/trace.ts

@@ -0,0 +1,55 @@
+// SPDX-License-Identifier: AGPL-3.0-only
+/**
+ * Trace types - the core data model surfaced in the dashboard.
+ */
+
+export interface Trace {
+  traceId: string;
+  agentId: string;
+  workflowId?: string;
+  status: "ok" | "error";
+  latencyMs: number;
+  totalTokens: number;
+  costUsd: number;
+  riskScore: number;
+  riskSeverity: "NONE" | "LOW" | "MEDIUM" | "HIGH" | "CRITICAL";
+  detections: Detection[];
+  spans: Span[];
+  startedAt: string;
+  completedAt: string;
+  orgId: string;
+  projectId: string;
+  environment: string;
+}
+
+export interface Span {
+  spanId: string;
+  parentSpanId?: string;
+  type: "agent" | "llm_call" | "tool_call" | "step";
+  name: string;
+  status: "ok" | "error";
+  latencyMs: number;
+  tokens?: TokenUsage;
+  input?: Record<string, unknown>;
+  output?: Record<string, unknown>;
+  detections: Detection[];
+  startedAt: string;
+}
+
+export interface TokenUsage {
+  promptTokens: number;
+  completionTokens: number;
+  totalTokens: number;
+  model: string;
+  costUsd: number;
+}
+
+export interface Detection {
+  detector: "pii" | "secrets" | "injection";
+  category: string;
+  severity: "LOW" | "MEDIUM" | "HIGH" | "CRITICAL";
+  confidence: number;
+  description: string;
+  beta: boolean;
+  spanId?: string;
+}

package/tailwind.config.js

@@ -0,0 +1,26 @@
+// SPDX-License-Identifier: AGPL-3.0-only
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: ["./src/**/*.{js,ts,jsx,tsx,mdx}"],
+  theme: {
+    extend: {
+      colors: {
+        splyntra: {
+          50: "#f0f4ff",
+          100: "#dbe4ff",
+          500: "#4c6ef5",
+          600: "#3b5bdb",
+          700: "#364fc7",
+          900: "#1c2541",
+        },
+        risk: {
+          low: "#51cf66",
+          medium: "#fcc419",
+          high: "#ff6b6b",
+          critical: "#c92a2a",
+        },
+      },
+    },
+  },
+  plugins: [require("@tailwindcss/typography")],
+};

package/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [{ "name": "next" }],
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": [
+    "node_modules",
+    "vitest.config.ts",
+    "vitest.setup.ts",
+    "src/**/*.test.ts",
+    "src/**/*.test.tsx"
+  ]
+}