@arcote.tech/arc-chat 0.7.23 → 0.7.24

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arcote.tech/arc-chat",
   "type": "module",
-  "version": "0.7.23",
+  "version": "0.7.24",
   "private": false,
   "description": "Chat module with AI integration for Arc framework",
   "main": "./src/index.ts",
@@ -10,12 +10,12 @@
     "type-check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@arcote.tech/arc": "^0.7.23",
-    "@arcote.tech/arc-ai": "^0.7.23",
-    "@arcote.tech/arc-ai-voice": "^0.7.23",
-    "@arcote.tech/arc-auth": "^0.7.23",
-    "@arcote.tech/arc-ds": "^0.7.23",
-    "@arcote.tech/platform": "^0.7.23",
+    "@arcote.tech/arc": "^0.7.24",
+    "@arcote.tech/arc-ai": "^0.7.24",
+    "@arcote.tech/arc-ai-voice": "^0.7.24",
+    "@arcote.tech/arc-auth": "^0.7.24",
+    "@arcote.tech/arc-ds": "^0.7.24",
+    "@arcote.tech/platform": "^0.7.24",
     "lucide-react": ">=0.400.0",
     "react": ">=18.0.0",
     "typescript": "^5.0.0"

package/src/aggregates/message.ts

@@ -83,6 +83,11 @@ export const createMessageAggregate = <
      * tylko ulotnym sygnałem advisory.
      */
     error: string().optional(),
+    /**
+     * Assistant rows: stabilny kod błędu (np. "insufficient_credits") — pozwala
+     * UI pokazać dedykowany komunikat + CTA zamiast surowego `error`.
+     */
+    errorCode: string().optional(),
     /**
      * Assistant rows: generacja przerwana bez wyniku (restart serwera
      * mid-stream). Ustawiane przez `generationInterrupted` (lazy repair w
@@ -172,6 +177,7 @@ export const createMessageAggregate = <
         previousResponseId: string().optional(),
         usage: string().optional(),
         error: string().optional(),
+        errorCode: string().optional(),
       },
       async (ctx, event) => {
         const p = event.payload;
@@ -180,6 +186,7 @@ export const createMessageAggregate = <
           previousResponseId: p.previousResponseId,
           usage: p.usage,
           error: p.error,
+          errorCode: p.errorCode,
           isGenerating: false,
         } as any);
       },
@@ -370,6 +377,7 @@ export const createMessageAggregate = <
         previousResponseId: string().optional(),
         usage: string().optional(),
         error: string().optional(),
+        errorCode: string().optional(),
       }).handle(
         ONLY_SERVER &&
         (async (ctx, params) => {
@@ -379,6 +387,7 @@ export const createMessageAggregate = <
             previousResponseId: params.previousResponseId,
             usage: params.usage,
             error: params.error,
+            errorCode: params.errorCode,
           });
           return { ok: true };
         }),

package/src/chat-builder.ts

@@ -51,6 +51,16 @@ export interface ChatReactComponentOptions {
    * advancement bars. Scrolls with messages.
    */
   footer?: ReactNode;
+  /**
+   * Slot na cały composer (input + przycisk + UI interaktywnych narzędzi).
+   * Patrz `ChatComponentConfig.renderComposer` — pozwala zastąpić obszar inputu
+   * własnym UI (np. „brak kredytów"). Historia wiadomości zostaje widoczna.
+   */
+  renderComposer?: (props: {
+    isDisabled: boolean;
+    isWaitingInteractive: boolean;
+    children: ReactNode;
+  }) => ReactNode;
 }
 
 // ─── Chat Data ──────────────────────────────────────────────────
@@ -410,6 +420,7 @@ export class ArcChat<const Data extends ArcChatData = DefaultChatData> {
       alias: aliasOverride ?? name,
       recordUsage: aiConfig.recordUsage,
       billTo: billTo ?? undefined,
+      assertCredits: aiConfig.assertCredits,
       attachments: attachmentsBridge,
     };
 
@@ -419,7 +430,12 @@ export class ArcChat<const Data extends ArcChatData = DefaultChatData> {
 
     const streamRoute = createChatStreamRoute({
       name,
-      userToken,
+      // Spójnie z message aggregate (linia ~306): gdy consumer zawęża czat
+      // przez `.protectBy(Y)`, scope klienta trzyma token Y i tym tokenem
+      // posługują się query/mutate. Stream route musi chronić TYM SAMYM
+      // tokenem — inaczej route wymaga bazowego `userToken` (X), klient
+      // wysyła Y i dostaje 403 mimo ważnego logowania.
+      userToken: protectByToken ?? userToken,
       messageElement: Message,
     });
 
@@ -444,6 +460,7 @@ export class ArcChat<const Data extends ArcChatData = DefaultChatData> {
         renderTextarea: options.renderTextarea,
         labels: options.labels,
         footer: options.footer,
+        renderComposer: options.renderComposer,
       });
     }
 

package/src/listeners/ai-generation-listener.ts

@@ -10,6 +10,7 @@ import type {
   LLMProvider,
   ToolCall,
 } from "@arcote.tech/arc-ai";
+import { InsufficientCreditsError } from "@arcote.tech/arc-ai";
 import {
   finalize,
   publish,
@@ -62,6 +63,13 @@ export interface AiGenerationListenerConfig {
    * listener can treat the pair as always-present in the call site.
    */
   billTo?: (tokenParams: Record<string, any>) => string;
+  /**
+   * Pre-flight gate z `ai()` factory (`ai.assertCredits`). Wołane RAZ przed
+   * pierwszym `provider.streamComplete` — rzuca `InsufficientCreditsError` gdy
+   * scope nie ma kredytów. No-op gdy undefined / billing bez readera salda.
+   * Wymaga `billTo` (chat-builder wymusza je razem z recordUsage).
+   */
+  assertCredits?: (ctx: any, scopeId: string) => Promise<void>;
   /**
    * Wiązanie z fragmentem `arc-files` — wstrzykiwany przez chat-builder gdy
    * consumer woła `.attachFiles({ File })`.
@@ -273,6 +281,8 @@ interface RunLoopConfig {
   recordUsage?: AiGenerationListenerConfig["recordUsage"];
   /** Token-params → scopeId mapper from chat-builder `.billTo(...)`. */
   billTo?: AiGenerationListenerConfig["billTo"];
+  /** Pre-flight gate — see `AiGenerationListenerConfig.assertCredits`. */
+  assertCredits?: AiGenerationListenerConfig["assertCredits"];
   /** Attachments bridge — see `AiGenerationListenerConfig.attachments`. */
   attachments?: AiGenerationListenerConfig["attachments"];
   /** ArcFile records dla attachmentów ostatniego user msg (resolved przed
@@ -362,6 +372,16 @@ async function runGenerationLoop(config: RunLoopConfig) {
       const filesForRequest =
         executionCount === 0 ? config.initialAttachments : undefined;
 
+      // Pre-flight gate — RAZ, przed pierwszym wywołaniem providera. Rzuca
+      // InsufficientCreditsError gdy scope nie ma kredytów; łapie catch poniżej
+      // i zamyka turn z errorCode "insufficient_credits" (UI pokazuje CTA).
+      if (executionCount === 0 && config.assertCredits && config.billTo) {
+        const billingScopeId = config.billTo(
+          ((ctx as any).$auth?.params as Record<string, any>) ?? {},
+        );
+        await config.assertCredits(ctx, billingScopeId);
+      }
+
       const result = await provider.streamComplete(
         {
           model,
@@ -580,11 +600,20 @@ async function runGenerationLoop(config: RunLoopConfig) {
       executionCount++;
     }
   } catch (err) {
-    const errorMsg = `AI error: ${err instanceof Error ? err.message : String(err)}`;
+    // Brak kredytów → rozróżnialny errorCode, by UI pokazało komunikat + CTA
+    // „Dokup kredyty" zamiast generycznego błędu.
+    const isCredits =
+      err instanceof InsufficientCreditsError ||
+      (err as any)?.code === "insufficient_credits";
+    const errorMsg = isCredits
+      ? "Brak kredytów AI"
+      : `AI error: ${err instanceof Error ? err.message : String(err)}`;
+    const errorCode = isCredits ? "insufficient_credits" : undefined;
     if (currentTurnId) {
       publish(currentTurnId, {
         type: "error",
         error: errorMsg,
+        errorCode,
         executionCount,
       });
       try {
@@ -592,6 +621,7 @@ async function runGenerationLoop(config: RunLoopConfig) {
           messageId: currentTurnId,
           blocks: "[]",
           error: errorMsg,
+          errorCode,
         });
       } catch {}
       finalize(currentTurnId, { error: errorMsg, executionCount });
@@ -689,6 +719,7 @@ export function createAiGenerationListener(config: AiGenerationListenerConfig) {
         alias: config.alias,
         recordUsage: config.recordUsage,
         billTo: config.billTo,
+        assertCredits: config.assertCredits,
         attachments: config.attachments,
         initialAttachments,
         preCreatedAssistantMessageId: (
@@ -812,6 +843,7 @@ export function createAiResumeListener(config: AiGenerationListenerConfig) {
         alias: config.alias,
         recordUsage: config.recordUsage,
         billTo: config.billTo,
+        assertCredits: config.assertCredits,
         attachments: config.attachments,
         preCreatedAssistantMessageId: (
           event.payload as { assistantMessageId?: string }
@@ -911,6 +943,7 @@ export function createAiRetryListener(config: AiGenerationListenerConfig) {
         alias: config.alias,
         recordUsage: config.recordUsage,
         billTo: config.billTo,
+        assertCredits: config.assertCredits,
         preCreatedAssistantMessageId: assistantMsgId,
       });
     });

package/src/react/chat-component.tsx

@@ -76,6 +76,18 @@ interface ChatComponentConfig {
    * after the last message/tool. Scrolls with messages.
    */
   footer?: ReactNode;
+  /**
+   * Slot na CAŁY composer (pole tekstowe + przycisk wysłania + UI odpowiedzi
+   * interaktywnych narzędzi). Gdy ustawiony, konsument decyduje co wyrenderować
+   * w miejscu inputu — np. komunikat „brak kredytów" zamiast inputu. Otrzymuje
+   * `children` (domyślny composer) do warunkowego użycia. Historia wiadomości
+   * (timeline) renderuje się zawsze, niezależnie od tego slotu.
+   */
+  renderComposer?: (props: {
+    isDisabled: boolean;
+    isWaitingInteractive: boolean;
+    children: ReactNode;
+  }) => ReactNode;
 }
 
 export function createChatComponent(
@@ -91,6 +103,7 @@ export function createChatComponent(
     renderTextarea,
     labels,
     footer,
+    renderComposer,
   } = config;
   const toolsMap = new Map(tools.map((t) => [t.name, t]));
   const isServerTool = (toolName: string) =>
@@ -140,7 +153,10 @@ export function createChatComponent(
           .map((m: any) => m._id as string),
       [historyData],
     );
-    const overlays = useAssistantOverlays(chatName, generatingIds);
+    // Token scope'u czatu jawnie do streamu — stream-fetch nie przechodzi
+    // przez wire, więc bez tego nie ma nagłówka Authorization → 401.
+    const streamToken = scope.useToken?.() ?? null;
+    const overlays = useAssistantOverlays(chatName, generatingIds, streamToken);
 
     // ─── Derywacja ────────────────────────────────────────────────
     const derived = useMemo(
@@ -362,6 +378,39 @@ export function createChatComponent(
       );
     }
 
+    const isDisabled = derived.busy || derived.hasWaitingInteractive;
+    const composerContent = createElement(Chat, {
+      messages: [],
+      models: [{ value: "gpt-5", label: "GPT-5" }],
+      defaultModel: "gpt-5",
+      onSend: handleSend,
+      showModelSelector,
+      showWebSearch,
+      renderSendButton,
+      // Default = VoiceTextarea (chat z dyktowaniem out-of-the-box).
+      // Konsument może podać własny `renderTextarea` (np. czysty
+      // TextareaField gdy świadomie wyłącza voice).
+      renderTextarea:
+        renderTextarea ??
+        (({ value, onChange, placeholder, rows }) =>
+          createElement(VoiceTextarea, {
+            value,
+            onChange,
+            placeholder,
+            rows,
+          })),
+      disabled: isDisabled,
+    });
+    // Slot na cały composer — konsument może zastąpić input własnym UI (np.
+    // komunikat „brak kredytów"). Timeline powyżej renderuje się zawsze.
+    const composer = renderComposer
+      ? renderComposer({
+          isDisabled,
+          isWaitingInteractive: derived.hasWaitingInteractive,
+          children: composerContent,
+        })
+      : composerContent;
+
     return createElement(
       ChatInputProvider,
       null,
@@ -374,28 +423,7 @@ export function createChatComponent(
           ...timelineElements,
           footer,
         ),
-        createElement(Chat, {
-          messages: [],
-          models: [{ value: "gpt-5", label: "GPT-5" }],
-          defaultModel: "gpt-5",
-          onSend: handleSend,
-          showModelSelector,
-          showWebSearch,
-          renderSendButton,
-          // Default = VoiceTextarea (chat z dyktowaniem out-of-the-box).
-          // Konsument może podać własny `renderTextarea` (np. czysty
-          // TextareaField gdy świadomie wyłącza voice).
-          renderTextarea:
-            renderTextarea ??
-            (({ value, onChange, placeholder, rows }) =>
-              createElement(VoiceTextarea, {
-                value,
-                onChange,
-                placeholder,
-                rows,
-              })),
-          disabled: derived.busy || derived.hasWaitingInteractive,
-        }),
+        composer,
       ),
     );
   }

package/src/react/use-assistant-overlays.ts

@@ -56,6 +56,8 @@ const HEARTBEAT_TIMEOUT_MS = 12_000;
 export function useAssistantOverlays(
   chatName: string,
   generatingIds: readonly string[],
+  /** Bieżący token scope'u czatu — ten sam, którym chroni route `protectBy`. */
+  token?: string | null,
 ): ReadonlyMap<string, AssistantOverlay> {
   const [overlays, setOverlays] = useState<Map<string, AssistantOverlay>>(
     () => new Map(),
@@ -64,6 +66,14 @@ export function useAssistantOverlays(
   const [reopenNonce, setReopenNonce] = useState(0);
   const connsRef = useRef<Map<string, Connection>>(new Map());
 
+  // Token w refie: fetch streamu czyta zawsze świeżą wartość bez wpinania
+  // tokenu do deps effectu — odświeżenie/rotacja tokenu nie zrywa żywych
+  // połączeń. Stream to `fetch` (nie EventSource), więc może wysłać
+  // `Authorization` jawnie zamiast polegać na ciasteczku `arc_token`
+  // (które ustawia tylko OAuth callback) — inaczej route zwraca 401.
+  const tokenRef = useRef(token);
+  tokenRef.current = token;
+
   const idsKey = generatingIds.join("|");
 
   useEffect(() => {
@@ -120,10 +130,14 @@ export function useAssistantOverlays(
           // czasie mógł już zrobić lazy repair `interrupted` w DB).
           let res: Response | null = null;
           for (let attempt = 0; ; attempt++) {
+            const tok = tokenRef.current;
             res = await fetch(`/route/chat/${chatName}/stream/${messageId}`, {
               credentials: "include",
               signal: ctrl.signal,
-              headers: { Accept: "text/event-stream" },
+              headers: {
+                Accept: "text/event-stream",
+                ...(tok ? { Authorization: `Bearer ${tok}` } : {}),
+              },
             });
             if (res.status !== 410) break;
             if (attempt >= MAX_410_RETRIES) {

package/src/streaming/stream-registry.ts

@@ -156,7 +156,13 @@ export type PublishableEvent =
       executionCount?: number;
     }
   | { type: "usage_update"; usage: TokenUsage }
-  | { type: "error"; error: string; executionCount?: number };
+  | {
+      type: "error";
+      error: string;
+      /** Stabilny kod błędu (np. "insufficient_credits") dla UI/CTA. */
+      errorCode?: string;
+      executionCount?: number;
+    };
 
 /**
  * Apply the event to the in-memory `currentBlocks` (via the shared