@checkstack/ai-frontend 0.1.3 → 0.1.5

package/CHANGELOG.md

@@ -1,5 +1,105 @@
 # @checkstack/ai-frontend
 
+## 0.1.5
+
+### Patch Changes
+
+- b50916d: Fix "Date cannot be represented in JSON Schema" crashing the AI chat. Zod v4's
+  `toJSONSchema()` throws on `z.date()` (and even `z.coerce.date()`) by default,
+  and the chat hit this in TWO places:
+
+  - **`@checkstack/backend-api`** `toJsonSchema()` (the OpenAPI generator and AI
+    tool-introspection / MCP substrate) called it with no options.
+  - **`@checkstack/ai-backend`** the agent loop hands the Vercel AI SDK the raw
+    Zod tool input, and the SDK runs its OWN `toJSONSchema()` (throwing) to build
+    the model-facing tool schema - so a single date field in any tool input
+    crashed every chat turn (the whole tool list is projected before the model is
+    called).
+
+  Both now render dates as `{ type: "string", format: "date-time" }` (their wire
+  shape) and degrade other unrepresentable types to `{}` instead of throwing.
+
+  For the model boundary, a single `dateSafeModelSchema()` helper hands the SDK a
+  ready-made date-safe schema plus a validator that COERCES the ISO strings the
+  model emits back into real `Date`s before parsing with the original schema
+  (refinements and the downstream RPC client, which expects `Date`s, keep
+  working). A single `toModelSchema()` entry point applies this at EVERY point a
+  schema is handed to the model - chat tool inputs, the headless agent runner's
+  tool inputs (the automation "AI Action"), and `generateObject` structured
+  output - gated so non-date schemas are untouched, so individual tool / agent
+  definitions never special-case dates. Regression tests cover the converter, the
+  AI tool serializer, and the model-schema generation + coercion helper, including
+  the full inbound round-trip with the exact ISO shape a live model emits
+  (`...T22:00:00Z`, no milliseconds).
+
+  **Timezone correctness.** Because the model produces dates as text, the chat now
+  enforces an unambiguous wire contract: a date-time tool argument MUST be RFC 3339
+  with an explicit timezone offset. Zone-less (`2026-07-01T22:00:00`) and date-only
+  (`2026-07-01`) values are rejected with a model-readable error (the model
+  self-repairs), instead of being silently interpreted in the pod's local zone -
+  which would resolve the same string to different instants across pods. To resolve
+  an operator's bare "22:00", the browser's IANA timezone is sent with every chat
+  turn and folded into the system prompt, so each operator's times are interpreted
+  in their own zone by default. When no browser zone is available (a headless
+  automation AI Action), the reference zone falls back to the host/container
+  timezone (`TZ`), not UTC. A format-matrix test covers every common shape a model
+  might emit. The chat UI shows the operator which timezone is in use, and the
+  `TZ` override is documented for operators.
+
+  **Current time in context.** The model has no clock, so the system prompt now
+  includes the current instant (UTC plus the reference-zone wall clock), letting it
+  resolve relative dates like "today at 10:00" without asking. Applied to both the
+  chat and the headless agent runner, computed per turn/run so it is never stale.
+
+  **Less-strict topic classifier.** The chat's off-topic pre-classifier was
+  refusing legitimate requests like "create a maintenance" because maintenances
+  (and several other domains) were not listed. The classifier now enumerates the
+  full domain set and treats any create/list/update/delete action on a platform
+  resource as on-topic by default.
+
+## 0.1.4
+
+### Patch Changes
+
+- 9d8961c: Fix the double-scrolling on the AI chat page (`/ai/chat`). The page sized its
+  layout with a fixed `calc(100vh - 220px)` height, which overshot the available
+  space when the page subtitle wrapped to two lines - so the whole page scrolled
+  on top of the message list's own scroll.
+
+  `PageLayout` gains an opt-in `fillHeight` prop that fills the viewport via a
+  bounded flex height chain (established in the app shell) instead of viewport
+  math; the chat page uses it so only the message list scrolls and the page itself
+  never does. Normal document-flow pages are unaffected (they still scroll the
+  main area as before).
+
+- fb705df: Upgrade React 18 to React 19 across the platform.
+
+  **BREAKING (runtime frontend plugins):** React is shared as a Module Federation
+  singleton, so the host now provides **React 19** to every runtime plugin.
+  Frontend plugins built against React 18 must be rebuilt against React 19
+  (`react` / `react-dom` `^19`). The scaffold templates and the host/plugin MF
+  `requiredVersion` are updated to `^19`. `react` (and now `react-dom`) are pinned
+  to a single version across the workspace via syncpack so the singleton can never
+  skew (react and react-dom must match exactly).
+
+  The React 19 removed-API surface was audited - the codebase used only no-arg
+  `useRef()` (now `useRef<T | undefined>(undefined)`); no `ReactDOM.render`,
+  legacy context, string refs, or function-component `defaultProps`. This also
+  clears the `IMPORT_IS_UNDEFINED` build warnings for `React.use` /
+  `React.useOptimistic` (react-router 7 feature-detection), which React 19 exports.
+
+  The downstream `*-frontend` packages (and `@checkstack/infrastructure-common`)
+  receive only the mechanical `react` dependency bump (`patch`); the framework
+  packages carrying the shared-singleton change are bumped `minor`.
+
+- Updated dependencies [9d8961c]
+- Updated dependencies [fb705df]
+  - @checkstack/ui@1.15.0
+  - @checkstack/frontend-api@0.8.0
+  - @checkstack/ai-common@0.1.2
+  - @checkstack/common@0.14.1
+  - @checkstack/integration-common@0.7.2
+
 ## 0.1.3
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/ai-frontend",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "license": "Elastic-2.0",
   "type": "module",
   "main": "src/index.tsx",
@@ -16,17 +16,17 @@
   "dependencies": {
     "@checkstack/ai-common": "0.1.2",
     "@checkstack/common": "0.14.1",
-    "@checkstack/frontend-api": "0.7.2",
+    "@checkstack/frontend-api": "0.8.0",
     "@checkstack/integration-common": "0.7.2",
-    "@checkstack/ui": "1.14.0",
+    "@checkstack/ui": "1.15.0",
     "lucide-react": "^1.17.0",
-    "react": "^18.3.1",
+    "react": "19.2.7",
     "react-router-dom": "^7.16.0"
   },
   "devDependencies": {
     "typescript": "^5.0.0",
-    "@types/react": "^18.2.0",
+    "@types/react": "^19.0.0",
     "@checkstack/tsconfig": "0.0.7",
-    "@checkstack/scripts": "0.5.0"
+    "@checkstack/scripts": "0.6.0"
   }
 }

package/src/lib/use-chat-turn.ts

@@ -18,6 +18,20 @@ function newId(): string {
     : `${Date.now()}-${Math.random().toString(36).slice(2)}`;
 }
 
+/**
+ * The operator's IANA timezone (e.g. "Europe/Berlin"), sent with every turn so
+ * the backend prompt can resolve bare times like "22:00" into the right offset.
+ * The browser is the authoritative source of the user's wall clock. Returns
+ * undefined where `Intl` is unavailable (the backend then falls back to UTC).
+ */
+function browserTimeZone(): string | undefined {
+  try {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone || undefined;
+  } catch {
+    return undefined;
+  }
+}
+
 /**
  * React hook that drives ONE streaming chat turn against /api/ai/chat. The
  * heavy lifting (SSE parsing, state folding) lives in DOM-free, unit-tested
@@ -34,7 +48,7 @@ export function useChatTurn({
   const [messages, setMessages] = useState<ChatMessage[]>(initialMessages);
   const [streaming, setStreaming] = useState(false);
   const [error, setError] = useState<string | undefined>();
-  const aborter = useRef<AbortController | undefined>();
+  const aborter = useRef<AbortController | undefined>(undefined);
 
   // Shared streaming driver: POST `body` to /chat, start a fresh assistant
   // message (optionally appending a user message first), and fold the SSE
@@ -65,7 +79,9 @@ export function useChatTurn({
           .fetch("/chat", {
             method: "POST",
             headers: { "content-type": "application/json" },
-            body: JSON.stringify(body),
+            // Stamp the operator's timezone on every turn (user message AND
+            // confirm-card decision) so the model resolves bare times correctly.
+            body: JSON.stringify({ timeZone: browserTimeZone(), ...body }),
             signal: controller.signal,
           });
         if (!response.ok || !response.body) {

package/src/pages/ChatPage.tsx

@@ -206,6 +206,16 @@ export function ChatPage() {
   const [copiedError, setCopiedError] = useState(false);
   const bottomRef = useRef<HTMLDivElement>(null);
 
+  // The operator's browser timezone, surfaced as a hint and sent with each turn
+  // so the assistant resolves bare times ("22:00") in this zone by default.
+  const browserTimeZone = useMemo<string | undefined>(() => {
+    try {
+      return Intl.DateTimeFormat().resolvedOptions().timeZone;
+    } catch {
+      return;
+    }
+  }, []);
+
   const {
     messages,
     setMessages,
@@ -445,8 +455,12 @@ export function ChatPage() {
       title="AI assistant"
       subtitle="Chat with Checkstack's built-in assistant. It can read incidents, health checks, and anomalies, and propose automations for you to confirm."
       icon={Sparkles}
+      fillHeight
     >
-      <div className="grid grid-cols-1 md:grid-cols-[260px_1fr] gap-4 h-[calc(100vh-220px)]">
+      {/* `flex-1 min-h-0` fills the fillHeight content area (no viewport math),
+          so only the message list scrolls - the page itself never does, even
+          when the subtitle wraps. */}
+      <div className="grid grid-cols-1 md:grid-cols-[260px_1fr] gap-4 flex-1 min-h-0">
         {/* Conversation sidebar */}
         <Card className="overflow-hidden flex flex-col">
           <CardContent className="p-2 flex flex-col gap-2 overflow-y-auto">
@@ -639,6 +653,12 @@ export function ChatPage() {
               <Send className="w-4 h-4" />
             </Button>
           </div>
+          {browserTimeZone ? (
+            <p className="px-2 pb-2 -mt-1 text-xs text-muted-foreground">
+              Times you mention are interpreted in your timezone (
+              {browserTimeZone}).
+            </p>
+          ) : null}
         </Card>
       </div>