hex-audit 0.4.0

package/dashboard/app/access/AccessClient.tsx

@@ -0,0 +1,402 @@
+'use client';
+
+import { useState, useMemo } from 'react';
+import { FilterableTable, type FilterableColumn } from '@/components/FilterableTable';
+import { CodeReference } from '@/components/CodeReference';
+import { ConfidenceBadge } from '@/components/ConfidenceBadge';
+
+// ─── Types ──────────────────────────────────────────────────────────
+
+interface Evidence {
+  file: string;
+  line_start: number;
+  line_end: number;
+  snippet?: string;
+}
+
+interface AccessFunction {
+  contract: string;
+  function: string;
+  visibility: string;
+  state_mutability: string | null;
+  modifiers: string[];
+  evidence: Evidence;
+}
+
+interface RoleFunctionRef {
+  contract: string;
+  function: string;
+}
+
+interface Role {
+  role: string;
+  description: string;
+  confidence: string;
+  derived_from: string;
+  reasoning: string;
+  modifier: string | null;
+  functions: RoleFunctionRef[];
+  warnings: string[];
+  kind?: 'access_control' | 'state_check' | 'guard' | 'unknown';
+  is_likely_access_control?: boolean;
+}
+
+const KIND_BADGE: Record<NonNullable<Role['kind']>, string> = {
+  access_control: 'bg-accent-subtle text-accent',
+  state_check: 'bg-[var(--medium)]/15 text-[var(--medium)]',
+  guard: 'bg-[var(--low)]/15 text-[var(--low)]',
+  unknown: 'bg-[var(--neutral)]/15 text-[var(--neutral)]',
+};
+
+function isLikely(role: Role): boolean {
+  // Default to true for backwards compatibility with older access-control.json files.
+  return role.is_likely_access_control ?? true;
+}
+
+// ─── Helpers ────────────────────────────────────────────────────────
+
+const VISIBILITY_STYLES: Record<string, string> = {
+  external: 'bg-[var(--critical)]/15 text-[var(--critical)]',
+  public: 'bg-[var(--high)]/15 text-[var(--high)]',
+  internal: 'bg-[var(--low)]/15 text-[var(--low)]',
+  private: 'bg-[var(--neutral)]/15 text-[var(--neutral)]',
+};
+
+function VisibilityBadge({ visibility }: { visibility: string }) {
+  const style = VISIBILITY_STYLES[visibility] ?? 'bg-[var(--neutral)]/15 text-[var(--neutral)]';
+  return (
+    <span className={`inline-flex items-center rounded-sm px-2 py-0.5 text-caption font-medium ${style}`}>
+      {visibility}
+    </span>
+  );
+}
+
+const TABS = ['All', 'State-Changing', 'Read-Only'] as const;
+type Tab = (typeof TABS)[number];
+
+// ─── Columns ────────────────────────────────────────────────────────
+
+function makeColumns(anyoneFnKeys: Set<string>, roleLookup: Map<string, string[]>, showMutability: boolean): FilterableColumn<AccessFunction>[] {
+  const cols: FilterableColumn<AccessFunction>[] = [
+    {
+      id: 'contract',
+      header: 'Contract',
+      accessorKey: 'contract',
+      enableColumnFilter: true,
+      cell: (row) => <span className="font-medium text-text-primary">{row.contract}</span>,
+    },
+    {
+      id: 'function',
+      header: 'Function',
+      accessorKey: 'function',
+      cell: (row) => (
+        <span className="font-mono text-body text-text-secondary">{row.function}</span>
+      ),
+    },
+    {
+      id: 'caller',
+      header: 'Who can call',
+      accessorKey: 'function',
+      cell: (row) => {
+        const key = `${row.contract}::${row.function}`;
+        const roles = roleLookup.get(key) ?? [];
+        const isAnyone = anyoneFnKeys.has(key);
+        if (roles.length === 0 && !isAnyone) return <span className="text-text-tertiary">--</span>;
+        return (
+          <div className="flex flex-wrap gap-1">
+            {isAnyone && (
+              <span className="inline-flex items-center rounded-md bg-[var(--critical)]/10 px-2 py-0.5 text-caption font-medium text-[var(--critical)]">
+                Anyone
+              </span>
+            )}
+            {roles.filter(r => r.toLowerCase() !== 'anyone' && r.toLowerCase() !== 'public').map((role) => (
+              <span key={role} className="inline-flex items-center rounded-md bg-accent-subtle px-2 py-0.5 text-caption font-medium text-accent">
+                {role}
+              </span>
+            ))}
+          </div>
+        );
+      },
+    },
+    {
+      id: 'visibility',
+      header: 'Visibility',
+      accessorKey: 'visibility',
+      enableColumnFilter: true,
+      cell: (row) => <VisibilityBadge visibility={row.visibility} />,
+    },
+  ];
+
+  if (showMutability) {
+    cols.push({
+      id: 'mutability',
+      header: 'Mutability',
+      accessorKey: 'state_mutability',
+      cell: (row) => <span className="text-caption text-text-tertiary">{row.state_mutability ?? '--'}</span>,
+    });
+  }
+
+  cols.push(
+    {
+      id: 'modifiers',
+      header: 'Modifiers',
+      accessorKey: 'modifiers',
+      cell: (row) =>
+        row.modifiers.length > 0 ? (
+          <div className="flex flex-wrap gap-1">
+            {row.modifiers.map((mod: string) => (
+              <span
+                key={mod}
+                className="inline-flex items-center rounded-sm bg-surface-3 px-2 py-0.5 text-caption text-text-secondary"
+              >
+                {mod}
+              </span>
+            ))}
+          </div>
+        ) : (
+          <span className="text-text-tertiary">--</span>
+        ),
+    },
+    {
+      id: 'location',
+      header: 'Location',
+      accessorKey: 'evidence',
+      cell: (row) => (
+        <CodeReference
+          file={row.evidence.file}
+          lineStart={row.evidence.line_start}
+          lineEnd={row.evidence.line_end}
+          snippet={row.evidence.snippet}
+        />
+      ),
+    },
+  );
+
+  return cols;
+}
+
+// ─── Component ──────────────────────────────────────────────────────
+
+interface AccessClientProps {
+  writeFunctions: AccessFunction[];
+  readOnlyFunctions: AccessFunction[];
+  anyoneFnKeys: string[];
+  anyoneRole: Role | null;
+  otherRoles: Role[];
+  allRoles: Role[];
+}
+
+export function AccessClient({
+  writeFunctions,
+  readOnlyFunctions,
+  anyoneFnKeys,
+  otherRoles,
+  allRoles,
+}: AccessClientProps) {
+  const [activeTab, setActiveTab] = useState<Tab>('All');
+  const [showUnprotectedOnly, setShowUnprotectedOnly] = useState(false);
+  const [showInferred, setShowInferred] = useState(false);
+  const anyoneSet = useMemo(() => new Set(anyoneFnKeys), [anyoneFnKeys]);
+
+  const inferredRoles = useMemo(
+    () => otherRoles.filter((r) => !isLikely(r)),
+    [otherRoles],
+  );
+  const visibleRoles = useMemo(
+    () => (showInferred ? otherRoles : otherRoles.filter(isLikely)),
+    [otherRoles, showInferred],
+  );
+
+  // Build function → roles lookup — only count *likely* access control roles
+  // so a setter with `whenNotPaused` doesn't get tagged as "callable by paused".
+  const roleLookup = useMemo(() => {
+    const map = new Map<string, string[]>();
+    for (const role of allRoles) {
+      if (!isLikely(role)) continue;
+      for (const fn of role.functions) {
+        const key = `${fn.contract}::${fn.function}`;
+        const existing = map.get(key) ?? [];
+        existing.push(role.role);
+        map.set(key, existing);
+      }
+    }
+    return map;
+  }, [allRoles]);
+
+  const allFunctions = useMemo(
+    () => [...writeFunctions, ...readOnlyFunctions],
+    [writeFunctions, readOnlyFunctions],
+  );
+
+  const unprotectedFunctions = useMemo(() => {
+    return writeFunctions.filter((fn) => anyoneSet.has(`${fn.contract}::${fn.function}`));
+  }, [writeFunctions, anyoneSet]);
+
+  const displayedData = useMemo(() => {
+    switch (activeTab) {
+      case 'All':
+        return allFunctions;
+      case 'State-Changing':
+        return showUnprotectedOnly ? unprotectedFunctions : writeFunctions;
+      case 'Read-Only':
+        return readOnlyFunctions;
+    }
+  }, [activeTab, showUnprotectedOnly, allFunctions, writeFunctions, readOnlyFunctions, unprotectedFunctions]);
+
+  const showMutability = activeTab === 'All' || activeTab === 'Read-Only';
+  const columns = useMemo(
+    () => makeColumns(anyoneSet, roleLookup, showMutability),
+    [anyoneSet, roleLookup, showMutability],
+  );
+
+  return (
+    <>
+      {/* Segmented control */}
+      <div className="mb-sp-5 flex flex-wrap items-center gap-sp-3">
+        <div className="inline-flex overflow-x-auto rounded-md bg-surface-3 p-1">
+          {TABS.map((tab) => (
+            <button
+              key={tab}
+              type="button"
+              onClick={() => {
+                setActiveTab(tab);
+                if (tab !== 'State-Changing') setShowUnprotectedOnly(false);
+              }}
+              className={`whitespace-nowrap rounded-sm px-sp-3 py-1.5 text-body font-medium ${
+                activeTab === tab
+                  ? 'bg-surface-2 text-text-primary shadow-sm'
+                  : 'text-text-secondary hover:text-text-primary'
+              }`}
+            >
+              {tab}
+              <span className="ml-1.5 text-caption opacity-60">
+                {tab === 'All' && allFunctions.length}
+                {tab === 'State-Changing' && writeFunctions.length}
+                {tab === 'Read-Only' && readOnlyFunctions.length}
+              </span>
+            </button>
+          ))}
+        </div>
+
+        {/* Unprotected toggle — only visible on State-Changing tab */}
+        {activeTab === 'State-Changing' && unprotectedFunctions.length > 0 && (
+          <button
+            type="button"
+            onClick={() => setShowUnprotectedOnly((v) => !v)}
+            className={`rounded-sm px-sp-3 py-1.5 text-body font-medium ${
+              showUnprotectedOnly
+                ? 'bg-[var(--critical)]/15 text-[var(--critical)] shadow-sm'
+                : 'bg-surface-3 text-text-secondary hover:text-text-primary'
+            }`}
+          >
+            Unprotected only
+            <span className="ml-1.5 text-caption opacity-60">{unprotectedFunctions.length}</span>
+          </button>
+        )}
+      </div>
+
+      {/* Table */}
+      <div className="mb-sp-6">
+        <FilterableTable
+          columns={columns}
+          data={displayedData}
+          defaultOpen={true}
+          rowClassName={(row) => {
+            const key = `${row.contract}::${row.function}`;
+            return anyoneSet.has(key)
+              ? 'bg-[var(--critical)]/5 hover:bg-[var(--critical)]/10'
+              : 'bg-surface-1 hover:bg-surface-3';
+          }}
+        />
+      </div>
+
+      {/* Role cards */}
+      {otherRoles.length > 0 && (
+        <div className="mb-sp-6">
+          <div className="mb-sp-3 flex items-center justify-between gap-sp-3">
+            <h3 className="text-heading font-medium text-text-primary">
+              Roles
+              <span className="ml-2 text-caption font-normal text-text-tertiary">
+                {visibleRoles.length} shown · {inferredRoles.length} inferred / unknown hidden
+              </span>
+            </h3>
+            {inferredRoles.length > 0 && (
+              <button
+                type="button"
+                onClick={() => setShowInferred((v) => !v)}
+                aria-pressed={showInferred}
+                className={`rounded-md px-3 py-1.5 text-caption font-medium focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent ${
+                  showInferred
+                    ? 'bg-accent text-surface-0'
+                    : 'bg-surface-3 text-text-secondary hover:text-text-primary'
+                }`}
+              >
+                {showInferred ? 'Hide' : 'Show'} inferred / unknown ({inferredRoles.length})
+              </button>
+            )}
+          </div>
+          <div className="grid gap-sp-3 sm:grid-cols-2">
+            {visibleRoles.map((role) => (
+              <div
+                key={role.role}
+                className={`rounded-md border bg-surface-2 p-sp-4 ${
+                  isLikely(role) ? 'border-border-default' : 'border-dashed border-border-emphasis opacity-90'
+                }`}
+              >
+                <div className="mb-sp-2 flex items-center justify-between gap-sp-2">
+                  <div className="flex items-center gap-sp-2">
+                    <h4 className="text-heading font-medium text-text-primary">{role.role}</h4>
+                    {role.kind && (
+                      <span className={`inline-flex items-center rounded-md px-2 py-0.5 text-caption font-medium ${KIND_BADGE[role.kind]}`}>
+                        {role.kind.replace('_', ' ')}
+                      </span>
+                    )}
+                  </div>
+                  <ConfidenceBadge level={role.confidence} derivedFrom={role.derived_from} />
+                </div>
+                <p className="mb-sp-3 text-body text-text-secondary">{role.description}</p>
+
+                {role.modifier && (
+                  <p className="mb-sp-2 text-caption text-text-tertiary">
+                    Modifier:{' '}
+                    <code className="rounded-sm bg-surface-0 px-1.5 py-0.5 text-text-secondary">
+                      {role.modifier}
+                    </code>
+                  </p>
+                )}
+
+                {role.functions.length > 0 && (
+                  <div className="mb-sp-2">
+                    <p className="mb-1 text-caption font-medium uppercase text-text-tertiary">
+                      Functions ({role.functions.length})
+                    </p>
+                    <div className="flex flex-wrap gap-1">
+                      {role.functions.map((fn) => (
+                        <span
+                          key={`${fn.contract}::${fn.function}`}
+                          className="inline-flex items-center rounded-sm bg-surface-3 px-2 py-0.5 font-mono text-caption text-text-secondary"
+                        >
+                          {fn.contract}.{fn.function}
+                        </span>
+                      ))}
+                    </div>
+                  </div>
+                )}
+
+                {role.warnings.length > 0 && (
+                  <div className="mt-sp-2 space-y-1 border-t border-border-subtle pt-sp-2">
+                    {role.warnings.map((w, i) => (
+                      <p key={i} className="text-caption text-[var(--medium)]">
+                        {w}
+                      </p>
+                    ))}
+                  </div>
+                )}
+              </div>
+            ))}
+          </div>
+        </div>
+      )}
+    </>
+  );
+}

package/dashboard/app/access/ReadOnlyFunctions.tsx

@@ -0,0 +1,114 @@
+'use client';
+
+import { useState } from 'react';
+
+interface Evidence {
+  file: string;
+  line_start: number;
+  line_end: number;
+  snippet?: string;
+}
+
+interface AccessFunction {
+  contract: string;
+  function: string;
+  visibility: string;
+  state_mutability: string | null;
+  modifiers: string[];
+  evidence: Evidence;
+}
+
+const VISIBILITY_STYLES: Record<string, string> = {
+  external: 'bg-[var(--critical)]/15 text-[var(--critical)]',
+  public: 'bg-[var(--high)]/15 text-[var(--high)]',
+  internal: 'bg-[var(--low)]/15 text-[var(--low)]',
+  private: 'bg-[var(--neutral)]/15 text-[var(--neutral)]',
+};
+
+function VisibilityBadge({ visibility }: { visibility: string }) {
+  const style = VISIBILITY_STYLES[visibility] ?? 'bg-[var(--neutral)]/15 text-[var(--neutral)]';
+  return (
+    <span className={`inline-flex items-center rounded-sm px-2 py-0.5 text-caption font-medium ${style}`}>
+      {visibility}
+    </span>
+  );
+}
+
+export function ReadOnlyFunctions({
+  functions,
+  anyoneFnKeys,
+}: {
+  functions: AccessFunction[];
+  anyoneFnKeys: string[];
+}) {
+  const [expanded, setExpanded] = useState(false);
+  const anyoneSet = new Set(anyoneFnKeys);
+
+  return (
+    <div className="mb-sp-6">
+      <button
+        type="button"
+        onClick={() => setExpanded(!expanded)}
+        className="flex w-full items-center gap-2 rounded-md border border-border-default bg-surface-2 px-sp-4 py-sp-3 text-left hover:bg-surface-3"
+      >
+        <svg
+          className={`h-4 w-4 text-text-tertiary ${expanded ? 'rotate-90' : ''}`}
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+          strokeWidth={2}
+        >
+          <path strokeLinecap="round" strokeLinejoin="round" d="m9 5 7 7-7 7" />
+        </svg>
+        <span className="text-body font-medium text-text-primary">
+          Read-Only Functions ({functions.length})
+        </span>
+        <span className="text-caption text-text-tertiary">view / pure</span>
+      </button>
+
+      {expanded && (
+        <div className="mt-2 overflow-x-auto rounded-md border border-border-default">
+          <table className="w-full text-left text-body">
+            <thead className="border-b border-border-default bg-surface-2 text-caption font-medium uppercase tracking-wider text-text-tertiary">
+              <tr>
+                <th className="px-sp-4 py-sp-2">Contract</th>
+                <th className="px-sp-4 py-sp-2">Function</th>
+                <th className="px-sp-4 py-sp-2">Visibility</th>
+                <th className="px-sp-4 py-sp-2">Mutability</th>
+                <th className="px-sp-4 py-sp-2">Location</th>
+              </tr>
+            </thead>
+            <tbody className="divide-y divide-border-subtle">
+              {functions.map((fn) => {
+                const key = `${fn.contract}::${fn.function}`;
+                const isAnyone = anyoneSet.has(key);
+                return (
+                  <tr
+                    key={key}
+                    className={
+                      isAnyone
+                        ? 'bg-[var(--critical)]/5 hover:bg-[var(--critical)]/10'
+                        : 'bg-surface-1 hover:bg-surface-3'
+                    }
+                  >
+                    <td className="px-sp-4 py-sp-2 font-medium text-text-primary">{fn.contract}</td>
+                    <td className="px-sp-4 py-sp-2 font-mono text-body text-text-secondary">{fn.function}</td>
+                    <td className="px-sp-4 py-sp-2">
+                      <VisibilityBadge visibility={fn.visibility} />
+                    </td>
+                    <td className="px-sp-4 py-sp-2 text-caption text-text-tertiary">
+                      {fn.state_mutability ?? '--'}
+                    </td>
+                    <td className="px-sp-4 py-sp-2 font-mono text-caption text-text-tertiary">
+                      {fn.evidence.file}:{fn.evidence.line_start}
+                    </td>
+                  </tr>
+                );
+              })}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  );
+}

package/dashboard/app/access/page.tsx

@@ -0,0 +1,118 @@
+import { readJsonFile } from '@/lib/data';
+import { NotYetGenerated } from '@/components/NotYetGenerated';
+import { AccessClient } from './AccessClient';
+
+// ─── Types ──────────────────────────────────────────────────────────
+
+interface Evidence {
+  file: string;
+  line_start: number;
+  line_end: number;
+  snippet?: string;
+}
+
+interface AccessFunction {
+  contract: string;
+  function: string;
+  visibility: string;
+  state_mutability: string | null;
+  modifiers: string[];
+  evidence: Evidence;
+}
+
+interface RoleFunctionRef {
+  contract: string;
+  function: string;
+}
+
+interface Role {
+  role: string;
+  description: string;
+  confidence: string;
+  derived_from: string;
+  reasoning: string;
+  modifier: string | null;
+  functions: RoleFunctionRef[];
+  warnings: string[];
+  kind?: 'access_control' | 'state_check' | 'guard' | 'unknown';
+  is_likely_access_control?: boolean;
+}
+
+interface AccessControl {
+  functions: AccessFunction[];
+  roles: Role[];
+}
+
+// ─── Component ──────────────────────────────────────────────────────
+
+export default function AccessPage() {
+  const data = readJsonFile<AccessControl>('access-control.json');
+
+  if (!data) {
+    return (
+      <div>
+        <h2 className="mb-sp-5 text-title font-semibold text-text-primary">Access Control</h2>
+        <NotYetGenerated command="hex access" />
+      </div>
+    );
+  }
+
+  const { functions, roles } = data;
+
+  const externalFunctions = functions.filter(
+    (fn) => fn.visibility === 'external' || fn.visibility === 'public',
+  );
+
+  const writeFunctions = externalFunctions.filter(
+    (fn) => fn.state_mutability !== 'view' && fn.state_mutability !== 'pure',
+  );
+  const readOnlyFunctions = externalFunctions.filter(
+    (fn) => fn.state_mutability === 'view' || fn.state_mutability === 'pure',
+  );
+
+  const anyoneRole = roles.find(
+    (r) => r.role.toLowerCase() === 'anyone' || r.role.toLowerCase() === 'public',
+  );
+  const otherRoles = roles.filter(
+    (r) => r.role.toLowerCase() !== 'anyone' && r.role.toLowerCase() !== 'public',
+  );
+
+  const anyoneFnKeys = anyoneRole?.functions.map((f) => `${f.contract}::${f.function}`) ?? [];
+
+  // Unprotected count: state-changing functions callable by anyone
+  const writeFnKeys = new Set(writeFunctions.map((fn) => `${fn.contract}::${fn.function}`));
+  const unprotectedCount = anyoneFnKeys.filter((k) => writeFnKeys.has(k)).length;
+
+  return (
+    <div>
+      <h2 className="mb-sp-5 text-title font-semibold text-text-primary">Access Control</h2>
+
+      {/* Summary strip */}
+      <div className="mb-sp-5 flex flex-wrap gap-sp-3">
+        <div className="flex items-center gap-2 rounded-md border border-border-default bg-surface-2 px-sp-4 py-sp-2">
+          <span className="text-heading font-semibold text-text-primary">{externalFunctions.length}</span>
+          <span className="text-caption text-text-secondary">Total</span>
+        </div>
+        <div className="flex items-center gap-2 rounded-md border border-border-default bg-surface-2 px-sp-4 py-sp-2">
+          <span className="text-heading font-semibold text-text-primary">{writeFunctions.length}</span>
+          <span className="text-caption text-text-secondary">State-Changing</span>
+        </div>
+        {unprotectedCount > 0 && (
+          <div className="flex items-center gap-2 rounded-md border border-[var(--critical)]/30 bg-[var(--critical)]/5 px-sp-4 py-sp-2">
+            <span className="text-heading font-semibold text-[var(--critical)]">{unprotectedCount}</span>
+            <span className="text-caption text-[var(--critical)]/80">Unprotected</span>
+          </div>
+        )}
+      </div>
+
+      <AccessClient
+        writeFunctions={writeFunctions}
+        readOnlyFunctions={readOnlyFunctions}
+        anyoneFnKeys={anyoneFnKeys}
+        anyoneRole={anyoneRole ?? null}
+        otherRoles={otherRoles}
+        allRoles={roles}
+      />
+    </div>
+  );
+}

package/dashboard/app/api/code/route.ts

@@ -0,0 +1,35 @@
+import { NextRequest, NextResponse } from 'next/server';
+import fs from 'node:fs';
+import path from 'node:path';
+
+function getProjectDir(): string {
+  return process.env.HEX_PROJECT_DIR ?? process.env.SOLAUDIT_PROJECT_DIR ?? process.cwd();
+}
+
+export async function GET(request: NextRequest) {
+  const file = request.nextUrl.searchParams.get('file');
+  const start = parseInt(request.nextUrl.searchParams.get('start') ?? '1', 10);
+  const end = parseInt(request.nextUrl.searchParams.get('end') ?? '0', 10);
+
+  if (!file) {
+    return NextResponse.json({ error: 'Missing file parameter' }, { status: 400 });
+  }
+
+  // Security: resolve and validate path is within project directory
+  const projectDir = getProjectDir();
+  const resolved = path.resolve(projectDir, file);
+  if (!resolved.startsWith(path.resolve(projectDir))) {
+    return NextResponse.json({ error: 'Path outside project directory' }, { status: 403 });
+  }
+
+  try {
+    const content = fs.readFileSync(resolved, 'utf-8');
+    const lines = content.split('\n');
+    const startLine = Math.max(1, start);
+    const endLine = end > 0 ? Math.min(end, lines.length) : lines.length;
+    const slice = lines.slice(startLine - 1, endLine).join('\n');
+    return NextResponse.json({ code: slice });
+  } catch {
+    return NextResponse.json({ error: `File not found: ${file}` }, { status: 404 });
+  }
+}