@checkstack/ai-frontend 0.1.3 → 0.1.4

package/CHANGELOG.md

@@ -1,5 +1,48 @@
 # @checkstack/ai-frontend
 
+## 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.4",
   "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

@@ -34,7 +34,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

package/src/pages/ChatPage.tsx

@@ -445,8 +445,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">