UI: task sessions in agent detail, ApprovalCard extraction, and company settings page

Show task sessions list in AgentDetail with per-session reset. Extract
ApprovalCard into standalone component from Approvals and Inbox pages,
reducing duplication. Add CompanySettings page with issuePrefix configuration.
Fix Sidebar active state for settings route. Display sessionDisplayId
in agent properties. Various cleanups to Approvals and Inbox pages.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

ui/src/pages/CompanySettings.tsx

@@ -0,0 +1,80 @@
+import { useEffect } from "react";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { useCompany } from "../context/CompanyContext";
+import { useBreadcrumbs } from "../context/BreadcrumbContext";
+import { companiesApi } from "../api/companies";
+import { queryKeys } from "../lib/queryKeys";
+import { Button } from "@/components/ui/button";
+import { Settings } from "lucide-react";
+
+export function CompanySettings() {
+  const { selectedCompany, selectedCompanyId } = useCompany();
+  const { setBreadcrumbs } = useBreadcrumbs();
+  const queryClient = useQueryClient();
+
+  const settingsMutation = useMutation({
+    mutationFn: (requireApproval: boolean) =>
+      companiesApi.update(selectedCompanyId!, {
+        requireBoardApprovalForNewAgents: requireApproval,
+      }),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: queryKeys.companies.all });
+    },
+  });
+
+  useEffect(() => {
+    setBreadcrumbs([
+      { label: selectedCompany?.name ?? "Company", href: "/dashboard" },
+      { label: "Settings" },
+    ]);
+  }, [setBreadcrumbs, selectedCompany?.name]);
+
+  if (!selectedCompany) {
+    return (
+      <div className="text-sm text-muted-foreground">
+        No company selected. Select a company from the switcher above.
+      </div>
+    );
+  }
+
+  return (
+    <div className="max-w-2xl space-y-6">
+      <div className="flex items-center gap-2">
+        <Settings className="h-5 w-5 text-muted-foreground" />
+        <h1 className="text-lg font-semibold">Company Settings</h1>
+      </div>
+
+      <div className="space-y-4">
+        <div className="text-xs font-medium text-muted-foreground uppercase tracking-wide">
+          Hiring
+        </div>
+        <div className="flex items-center justify-between gap-3 rounded-md border border-border px-4 py-3">
+          <div>
+            <div className="text-sm font-medium">
+              Require board approval for new hires
+            </div>
+            <div className="text-xs text-muted-foreground">
+              New agent hires stay pending until approved by board.
+            </div>
+          </div>
+          <Button
+            size="sm"
+            variant={
+              selectedCompany.requireBoardApprovalForNewAgents
+                ? "default"
+                : "outline"
+            }
+            onClick={() =>
+              settingsMutation.mutate(
+                !selectedCompany.requireBoardApprovalForNewAgents,
+              )
+            }
+            disabled={settingsMutation.isPending}
+          >
+            {selectedCompany.requireBoardApprovalForNewAgents ? "On" : "Off"}
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}