@agent-platform/ui 0.0.6 → 0.0.8

package/dist/components/agent/provider/agent-provider.js

@@ -1,26 +1,40 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { useAgentChat } from '../../../modules/agent/use-agent-chat';
 import { AgentContext } from './agent-context';
 import { resolveAgentRuntimeConfig } from './runtime-config';
-import { useAgentChatInternal } from './use-agent-chat';
 /**
  * エージェントチャット機能を提供する内部Provider
  * 公開APIは AgentScreen / AgentPopupWidget を使用する。
  */
-export function AgentProvider({ children, agentId, executeClientTool, onError, authToken, getAuthToken, getAgentHeaders, disableToolApiAuthHeader, }) {
+export function AgentProvider({ children, agentId, onError, authToken, getAuthToken, getAgentHeaders, disableToolApiAuthHeader, toolApprovalLabels, }) {
     const runtimeConfig = resolveAgentRuntimeConfig();
-    const value = useAgentChatInternal({
+    const value = useAgentChat({
         config: {
             endpoint: runtimeConfig.endpoint,
             agentId,
             apiBaseUrl: runtimeConfig.apiBaseUrl,
-            executeClientTool,
             onError,
             authToken,
             getAuthToken,
             getAgentHeaders,
             disableToolApiAuthHeader,
+            toolApprovalLabels,
         },
     });
-    return _jsx(AgentContext.Provider, { value: value, children: children });
+    const contextValue = useMemo(() => value, [
+        value.config,
+        value.clearChat,
+        value.error,
+        value.isLoading,
+        value.messages,
+        value.pendingToolCalls,
+        value.activeApprovalRequest,
+        value.approveToolCall,
+        value.rejectToolCall,
+        value.sendMessage,
+        value.threadId,
+    ]);
+    return _jsx(AgentContext.Provider, { value: contextValue, children: children });
 }

package/dist/components/agent/provider/index.d.ts

@@ -1,4 +1,4 @@
 export { useAgentContext } from './agent-context';
 export type { AgentProviderProps } from './agent-provider';
 export { AgentProvider } from './agent-provider';
-export type { AgentContextValue, AgentMessage, AgentProviderConfig, AgentStreamEvent, ClientToolExecutor, FinishPayload, MessageContentPart, ToolCallData, ToolCallState, ToolCallStatus, ToolResultData, } from './types';
+export type { ActiveToolApprovalRequest, AgentContextValue, AgentMessage, AgentProviderConfig, ToolApprovalLabels, AgentStreamEvent, FinishPayload, MessageContentPart, ToolCallData, ToolCallState, ToolCallStatus, ToolResultData, } from './types';

package/dist/components/agent/provider/runtime-config.js

@@ -1,15 +1,24 @@
 const isDevelopment = process.env.NODE_ENV === 'development';
 const PRODUCTION_AGENT_ENDPOINT = 'https://agent-server-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api/agent';
 const DEVELOPMENT_AGENT_ENDPOINT = 'http://localhost:3002/api/agent';
-const FIXED_API_BASE_URL = isDevelopment
-    ? 'http://localhost:3001/api'
-    : 'https://demo-scout-api-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api';
+const PRODUCTION_API_BASE_URL = 'https://demo-scout-api-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api';
+const DEVELOPMENT_API_BASE_URL = 'http://localhost:3001/api';
 function normalizeUrl(url) {
     return url.replace(/\/$/, '');
 }
 export function resolveAgentRuntimeConfig() {
+    const endpoint = process.env.NEXT_PUBLIC_AGENT_ENDPOINT
+        ? process.env.NEXT_PUBLIC_AGENT_ENDPOINT
+        : isDevelopment
+            ? DEVELOPMENT_AGENT_ENDPOINT
+            : PRODUCTION_AGENT_ENDPOINT;
+    const apiBaseUrl = process.env.NEXT_PUBLIC_API_URL
+        ? process.env.NEXT_PUBLIC_API_URL
+        : isDevelopment
+            ? DEVELOPMENT_API_BASE_URL
+            : PRODUCTION_API_BASE_URL;
     return {
-        endpoint: normalizeUrl(isDevelopment ? DEVELOPMENT_AGENT_ENDPOINT : PRODUCTION_AGENT_ENDPOINT),
-        apiBaseUrl: normalizeUrl(FIXED_API_BASE_URL),
+        endpoint: normalizeUrl(endpoint),
+        apiBaseUrl: normalizeUrl(apiBaseUrl),
     };
 }

package/dist/components/agent/provider/types.d.ts

@@ -2,7 +2,7 @@ export type { AgentStreamEvent, ToolCallData, ToolResultData, FinishPayload, Mes
 /**
  * ツール実行状態
  */
-export type ToolCallStatus = 'pending' | 'executing' | 'completed' | 'error';
+export type ToolCallStatus = 'pending' | 'awaiting-approval' | 'executing' | 'completed' | 'error';
 /**
  * ツールコール状態（UI表示用）
  */
@@ -12,25 +12,23 @@ export interface ToolCallState {
     result?: unknown;
     error?: string;
 }
-/**
- * クライアントツール実行関数型
- */
-export type ClientToolExecutor = (toolCall: import('@agent-platform/server').ToolCallData) => Promise<{
-    output: unknown;
-    isError?: boolean;
-}>;
+export interface ActiveToolApprovalRequest {
+    toolCall: import('@agent-platform/server').ToolCallData;
+    actionLabel: string;
+    riskLevel: 'read' | 'write' | 'destructive';
+}
+export interface ToolApprovalLabels {
+    title?: string;
+    description?: string;
+    approveButton?: string;
+    rejectButton?: string;
+}
 export type AgentHeadersProvider = () => Record<string, string> | Promise<Record<string, string>>;
 /**
  * AgentProvider設定
  */
 export interface AgentProviderConfig {
     agentId?: string;
-    /** 通信先URLは packages/ui 内部のruntime-configで解決される */
-    /**
-     * @deprecated 旧実装との後方互換用。
-     * executeOn: 'client' のツールをブラウザ側で実行するコールバック
-     */
-    executeClientTool?: ClientToolExecutor;
     onError?: (error: string) => void;
     /** 静的なJWTトークン */
     authToken?: string;
@@ -40,6 +38,8 @@ export interface AgentProviderConfig {
     getAgentHeaders?: AgentHeadersProvider;
     /** trueの場合、Tool APIへのAuthorizationヘッダー付与を無効化する */
     disableToolApiAuthHeader?: boolean;
+    /** 承認UI文言の上書き */
+    toolApprovalLabels?: ToolApprovalLabels;
 }
 /**
  * Agent通信先を解決済みの内部設定
@@ -57,8 +57,10 @@ export interface AgentContextValue {
     isLoading: boolean;
     error: string | null;
     pendingToolCalls: ToolCallState[];
+    activeApprovalRequest: ActiveToolApprovalRequest | null;
+    approveToolCall: () => void;
+    rejectToolCall: () => void;
     sendMessage: (message: string) => Promise<void>;
-    loadThread: (threadId: string) => Promise<void>;
     clearChat: () => void;
     config: ResolvedAgentRuntimeConfig;
 }

package/dist/components/agent/types.d.ts

@@ -1,4 +1,5 @@
-import type { ReactNode } from "react";
+import type { ReactNode } from 'react';
+import type { ActiveToolApprovalRequest, ToolApprovalLabels, ToolCallState } from './provider/types';
 export interface AgentHeaderProps {
     historyLabel?: string;
     onHistoryClick?: () => void;
@@ -31,9 +32,33 @@ export interface AgentInputProps {
     isLoading?: boolean;
     className?: string;
 }
+export interface AgentChatStateShape {
+    showHeader: boolean;
+    effectiveHeaderProps: AgentHeaderProps;
+    showGreeting: boolean;
+    greetingProps?: AgentGreetingProps;
+    showHomeCards: boolean;
+    cards?: AgentHomeCardProps[];
+    onCardClick?: (cardId: string) => void;
+    autoShowMessages: boolean;
+    showInput: boolean;
+    effectiveInputProps: AgentInputProps;
+    className?: string;
+    children?: ReactNode;
+    messages: import('@agent-platform/server').AgentMessage[];
+    pendingToolCalls: ToolCallState[];
+    activeApprovalRequest: ActiveToolApprovalRequest | null;
+    approveToolCall: () => void;
+    rejectToolCall: () => void;
+    toolApprovalLabels?: ToolApprovalLabels;
+    error: string | null;
+    isLoading: boolean;
+    mergedToolNameLabels: Record<string, string>;
+    hasMessages: boolean;
+}
 export interface AgentContainerProps {
     showHeader?: boolean;
-    headerProps?: Omit<AgentHeaderProps, "className">;
+    headerProps?: Omit<AgentHeaderProps, 'className'>;
     showGreeting?: boolean;
     greetingProps?: AgentGreetingProps;
     showHomeCards?: boolean;
@@ -50,7 +75,7 @@ export interface AgentContainerProps {
      */
     autoShowMessages?: boolean;
     showInput?: boolean;
-    inputProps?: Omit<AgentInputProps, "className">;
+    inputProps?: Omit<AgentInputProps, 'className'>;
     className?: string;
     children?: ReactNode;
 }

package/dist/components/ui/button.d.ts

@@ -1,7 +1,7 @@
 import { type VariantProps } from 'class-variance-authority';
 import type * as React from 'react';
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    variant?: "destructive" | "link" | "default" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-export { AgentScreen, AgentPopupWidget } from './components/agent';
-export type { AgentScreenProps, AgentPopupWidgetProps, AgentHomeCardProps, } from './components/agent';
+export { AgentScreen } from './components/agent';
+export type { AgentScreenProps, AgentHomeCardProps } from './components/agent';

package/dist/index.js

@@ -1 +1 @@
-export { AgentScreen, AgentPopupWidget } from './components/agent';
+export { AgentScreen } from './components/agent';

package/dist/modules/agent/agent.repository.d.ts

@@ -0,0 +1,58 @@
+import type { AgentStreamEvent, ToolCallData } from '../../components/agent/provider/types';
+export interface ToolExecutionResult {
+    output: unknown;
+    isError?: boolean;
+}
+export interface ContinuePayload {
+    threadId: string | null;
+    agentId: string;
+    toolResults: {
+        toolCallId: string;
+        result: unknown;
+        isError?: boolean;
+    }[];
+    toolCalls: {
+        toolCallId: string;
+        toolName: string;
+        args: unknown;
+    }[];
+}
+export interface SendChatParams {
+    endpoint: string;
+    threadId: string | null;
+    message: string;
+    agentId: string;
+    headers: Record<string, string>;
+    signal?: AbortSignal;
+}
+export interface ContinueChatParams {
+    endpoint: string;
+    payload: ContinuePayload;
+    headers: Record<string, string>;
+    signal?: AbortSignal;
+}
+export interface ExecuteToolCallParams {
+    toolCall: ToolCallData;
+    apiBaseUrl: string;
+    authHeaders: Record<string, string>;
+}
+export interface AgentRepository {
+    buildAgentHeaders: (getAgentHeaders?: () => Record<string, string> | Promise<Record<string, string>>) => Promise<Record<string, string>>;
+    buildToolApiHeaders: () => Promise<Record<string, string>>;
+    sendChat: (params: SendChatParams) => Promise<Response>;
+    continueChat: (params: ContinueChatParams) => Promise<Response>;
+    collectStreamEvents: (response: Response, options?: CollectStreamEventsOptions) => Promise<AgentStreamEvent[]>;
+    executeToolCall: (params: ExecuteToolCallParams) => Promise<ToolExecutionResult>;
+    parseErrorResponse: (response: Response, fallback: string) => Promise<string>;
+}
+export interface CollectStreamEventsOptions {
+    onEvents?: (events: AgentStreamEvent[]) => void;
+}
+interface CreateAgentRepositoryOptions {
+    fetchFn?: typeof fetch;
+    authToken?: string;
+    getAuthToken?: () => string | Promise<string>;
+    disableToolApiAuthHeader?: boolean;
+}
+export declare function createAgentRepository(options: CreateAgentRepositoryOptions): AgentRepository;
+export {};

package/dist/modules/agent/agent.repository.js

@@ -0,0 +1,235 @@
+function parseSSEBuffer(buffer) {
+    const events = [];
+    const lines = buffer.split('\n');
+    const remaining = lines.pop() || '';
+    for (const line of lines) {
+        if (!line.startsWith('data: ')) {
+            continue;
+        }
+        const jsonString = line.slice(6);
+        if (!jsonString) {
+            continue;
+        }
+        try {
+            const event = JSON.parse(jsonString);
+            events.push(event);
+        }
+        catch (error) {
+            console.warn('Failed to parse SSE event:', error);
+        }
+    }
+    return { events, remaining };
+}
+function isLikelyJwtToken(token) {
+    const normalized = token.startsWith('Bearer ') ? token.slice(7) : token;
+    return normalized.split('.').length === 3;
+}
+function buildToolEndpointRequest(toolCall, apiBaseUrl) {
+    if (!toolCall.apiRequest) {
+        return null;
+    }
+    const { apiRequest, input } = toolCall;
+    const inputData = (input ?? {});
+    const method = apiRequest.method.toUpperCase();
+    let path = apiRequest.path;
+    const usedParams = new Set();
+    for (const paramName of apiRequest.pathParams) {
+        const value = inputData[paramName];
+        if (value === undefined) {
+            continue;
+        }
+        path = path.replace(`{${paramName}}`, encodeURIComponent(String(value)));
+        usedParams.add(paramName);
+    }
+    const queryParams = {};
+    const bodyData = {};
+    for (const key of apiRequest.queryParams) {
+        const value = inputData[key];
+        if (value === undefined) {
+            continue;
+        }
+        queryParams[key] = String(value);
+        usedParams.add(key);
+    }
+    for (const key of apiRequest.bodyFields) {
+        const value = inputData[key];
+        if (value === undefined) {
+            continue;
+        }
+        bodyData[key] = value;
+        usedParams.add(key);
+    }
+    for (const [key, value] of Object.entries(inputData)) {
+        if (usedParams.has(key) || value === undefined) {
+            continue;
+        }
+        if (method === 'GET' || method === 'DELETE') {
+            queryParams[key] = String(value);
+            continue;
+        }
+        bodyData[key] = value;
+    }
+    const queryString = new URLSearchParams(queryParams).toString();
+    return {
+        method,
+        url: `${apiBaseUrl}${path}${queryString ? `?${queryString}` : ''}`,
+        bodyData,
+    };
+}
+export function createAgentRepository(options) {
+    const { fetchFn = fetch, authToken, getAuthToken, disableToolApiAuthHeader = false, } = options;
+    const resolveToken = async () => {
+        return getAuthToken ? getAuthToken() : authToken;
+    };
+    return {
+        buildAgentHeaders: async (getAgentHeaders) => {
+            const headers = {
+                'Content-Type': 'application/json',
+            };
+            const token = await resolveToken();
+            if (token) {
+                headers.Authorization = token.startsWith('Bearer ') ? token : `Bearer ${token}`;
+            }
+            const customHeaders = getAgentHeaders ? await getAgentHeaders() : undefined;
+            if (!customHeaders) {
+                return headers;
+            }
+            for (const [key, value] of Object.entries(customHeaders)) {
+                if (value) {
+                    headers[key] = value;
+                }
+            }
+            return headers;
+        },
+        buildToolApiHeaders: async () => {
+            const headers = {};
+            if (disableToolApiAuthHeader) {
+                return headers;
+            }
+            const token = await resolveToken();
+            if (!token) {
+                return headers;
+            }
+            const resolvedToken = token.startsWith('Bearer ') ? token : `Bearer ${token}`;
+            if (!isLikelyJwtToken(resolvedToken)) {
+                return headers;
+            }
+            headers.Authorization = resolvedToken;
+            return headers;
+        },
+        sendChat: async ({ endpoint, threadId, message, agentId, headers, signal }) => {
+            return fetchFn(`${endpoint}/chat`, {
+                method: 'POST',
+                headers,
+                credentials: 'include',
+                body: JSON.stringify({ threadId, message, agentId }),
+                signal,
+            });
+        },
+        continueChat: async ({ endpoint, payload, headers, signal }) => {
+            return fetchFn(`${endpoint}/chat/tool-result`, {
+                method: 'POST',
+                headers,
+                credentials: 'include',
+                body: JSON.stringify(payload),
+                signal,
+            });
+        },
+        collectStreamEvents: async (response, options) => {
+            const reader = response.body?.getReader();
+            if (!reader) {
+                return [];
+            }
+            const decoder = new TextDecoder();
+            const events = [];
+            let buffer = '';
+            try {
+                while (true) {
+                    const { done, value } = await reader.read();
+                    if (done) {
+                        break;
+                    }
+                    buffer += decoder.decode(value, { stream: true });
+                    const parsed = parseSSEBuffer(buffer);
+                    buffer = parsed.remaining;
+                    events.push(...parsed.events);
+                    if (parsed.events.length > 0) {
+                        options?.onEvents?.(parsed.events);
+                    }
+                }
+                if (buffer.startsWith('data: ')) {
+                    try {
+                        const event = JSON.parse(buffer.slice(6));
+                        events.push(event);
+                        options?.onEvents?.([event]);
+                    }
+                    catch (error) {
+                        console.warn('Failed to parse remaining SSE event:', error);
+                    }
+                }
+                return events;
+            }
+            finally {
+                reader.releaseLock();
+            }
+        },
+        executeToolCall: async ({ toolCall, apiBaseUrl, authHeaders }) => {
+            const request = buildToolEndpointRequest(toolCall, apiBaseUrl);
+            if (!request) {
+                return { output: 'No API endpoint defined for this tool', isError: true };
+            }
+            try {
+                const fetchOptions = {
+                    method: request.method,
+                    headers: {
+                        'Content-Type': 'application/json',
+                        ...authHeaders,
+                    },
+                    credentials: 'include',
+                };
+                if ((request.method === 'POST' || request.method === 'PUT' || request.method === 'PATCH') &&
+                    Object.keys(request.bodyData).length > 0) {
+                    fetchOptions.body = JSON.stringify(request.bodyData);
+                }
+                const response = await fetchFn(request.url, fetchOptions);
+                const text = await response.text();
+                let data;
+                try {
+                    data = text ? JSON.parse(text) : null;
+                }
+                catch {
+                    data = { raw: text, status: response.status };
+                }
+                if (!response.ok) {
+                    return { output: data, isError: true };
+                }
+                return { output: data };
+            }
+            catch (error) {
+                return {
+                    output: error instanceof Error ? error.message : 'Network error',
+                    isError: true,
+                };
+            }
+        },
+        parseErrorResponse: async (response, fallback) => {
+            let errorMessage = fallback;
+            try {
+                const contentType = response.headers.get('content-type');
+                if (contentType?.includes('application/json')) {
+                    const errorData = await response.json();
+                    if (typeof errorData?.error === 'string') {
+                        return errorData.error;
+                    }
+                    if (typeof errorData?.message === 'string') {
+                        return errorData.message;
+                    }
+                }
+            }
+            catch (error) {
+                console.warn('Failed to parse error response:', error);
+            }
+            return errorMessage;
+        },
+    };
+}

package/dist/modules/agent/agent.repository.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/modules/agent/agent.repository.test.js

@@ -0,0 +1,64 @@
+import { describe, expect, it, vi } from 'vitest';
+import { createAgentRepository } from './agent.repository';
+describe('createAgentRepository', () => {
+    it('parseErrorResponseはjsonのerror/messageを優先して返す', async () => {
+        const repository = createAgentRepository({
+            fetchFn: vi.fn(),
+            getAuthToken: undefined,
+            authToken: undefined,
+            disableToolApiAuthHeader: false,
+        });
+        const response = new Response(JSON.stringify({ error: 'failed' }), {
+            status: 400,
+            headers: { 'content-type': 'application/json' },
+        });
+        await expect(repository.parseErrorResponse(response, 'fallback')).resolves.toBe('failed');
+    });
+    it('collectStreamEventsはSSEのdata行をイベント配列に変換する', async () => {
+        const repository = createAgentRepository({
+            fetchFn: vi.fn(),
+            getAuthToken: undefined,
+            authToken: undefined,
+            disableToolApiAuthHeader: false,
+        });
+        const stream = new ReadableStream({
+            start(controller) {
+                controller.enqueue(new TextEncoder().encode('data: {"type":"text-delta","payload":{"text":"hi"}}\n\n'));
+                controller.close();
+            },
+        });
+        const response = new Response(stream);
+        const events = await repository.collectStreamEvents(response);
+        expect(events).toEqual([{ type: 'text-delta', payload: { text: 'hi' } }]);
+    });
+    it('collectStreamEventsはストリーム完了前にonEventsを呼び出す', async () => {
+        const repository = createAgentRepository({
+            fetchFn: vi.fn(),
+            getAuthToken: undefined,
+            authToken: undefined,
+            disableToolApiAuthHeader: false,
+        });
+        const encoder = new TextEncoder();
+        let closeStream = null;
+        const stream = new ReadableStream({
+            start(controller) {
+                controller.enqueue(encoder.encode('data: {"type":"text-delta","payload":{"text":"hel"}}\n\n'));
+                closeStream = () => {
+                    controller.enqueue(encoder.encode('data: {"type":"text-delta","payload":{"text":"lo"}}\n\n'));
+                    controller.close();
+                };
+            },
+        });
+        const response = new Response(stream);
+        const onEvents = vi.fn();
+        const collectPromise = repository.collectStreamEvents(response, { onEvents });
+        await new Promise((resolve) => setTimeout(resolve, 0));
+        expect(onEvents).toHaveBeenCalledWith([{ type: 'text-delta', payload: { text: 'hel' } }]);
+        closeStream?.();
+        const events = await collectPromise;
+        expect(events).toEqual([
+            { type: 'text-delta', payload: { text: 'hel' } },
+            { type: 'text-delta', payload: { text: 'lo' } },
+        ]);
+    });
+});

package/dist/modules/agent/domain/chat-state.d.ts

@@ -0,0 +1,64 @@
+import type { AgentMessage, ToolCallData, ToolCallState, ToolCallStatus } from '../../../components/agent/provider/types';
+export interface AgentChatState {
+    messages: AgentMessage[];
+    threadId: string | null;
+    isLoading: boolean;
+    error: string | null;
+    pendingToolCalls: Map<string, ToolCallState>;
+}
+export interface StartChatPayload {
+    userMessageId: string;
+    text: string;
+    assistantMessageId: string;
+}
+export interface UpsertToolCallStatePayload {
+    toolCall: ToolCallData;
+    status: ToolCallStatus;
+    result?: unknown;
+    error?: string;
+}
+export type AgentChatAction = {
+    type: 'START_CHAT';
+    payload: StartChatPayload;
+} | {
+    type: 'START_ASSISTANT_MESSAGE';
+    payload: {
+        assistantMessageId: string;
+    };
+} | {
+    type: 'UPDATE_ASSISTANT_PROGRESS';
+    payload: {
+        assistantMessageId: string;
+        text: string;
+        toolCalls: ToolCallData[];
+    };
+} | {
+    type: 'FINISH_ASSISTANT_MESSAGE';
+    payload: {
+        assistantMessageId: string;
+    };
+} | {
+    type: 'UPSERT_TOOL_CALL_STATE';
+    payload: UpsertToolCallStatePayload;
+} | {
+    type: 'SET_LOADING';
+    payload: {
+        isLoading: boolean;
+    };
+} | {
+    type: 'SET_ERROR';
+    payload: {
+        error: string | null;
+    };
+} | {
+    type: 'SET_THREAD_ID';
+    payload: {
+        threadId: string;
+    };
+} | {
+    type: 'RESET_CHAT';
+};
+export declare function createInitialChatState(): AgentChatState;
+export declare function appendIntentText(current: string, intentMessage: string): string;
+export declare function selectPendingToolCalls(state: AgentChatState): ToolCallState[];
+export declare function chatStateReducer(state: AgentChatState, action: AgentChatAction): AgentChatState;