flare-chat-core 0.2.0 → 0.2.2

package/src/app/core-chat-entry/useWorkspaceCanvasController.jsx

@@ -0,0 +1,177 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { createDefaultGenerativeRegistry } from 'flare-generative-ui';
+import { parseSourcingCandidates } from '../../contracts/sse-events.js';
+import { requestSourcingSearchApi } from '../../chat-core/pipelines/transport/sourcing-search-api.js';
+import { useWorkspaceCanvasProjection } from './useWorkspaceCanvasProjection.jsx';
+
+export function useWorkspaceCanvasController({
+  apiBaseUrl,
+  projectId,
+  userId,
+  activeSessionId,
+  timeline,
+  composerModeKey,
+  evidenceStrictMode,
+  evidenceHitScoreThreshold,
+  showCanvasPanel,
+  setShowCanvasPanel,
+  canvasActiveTabKey,
+  setCanvasActiveTabKey,
+  canvasFullscreenOpen,
+  setCanvasFullscreenOpen,
+  inputState,
+  themeTokens,
+  languageGuardEnabled,
+  friendlyToneEnabled,
+}) {
+  const [canvasFocusEvidenceAnchorId, setCanvasFocusEvidenceAnchorId] = useState('');
+  const [sourcingLoadedTopK, setSourcingLoadedTopK] = useState(8);
+  const [sourcingHasMore, setSourcingHasMore] = useState(false);
+  const [sourcingLoadingMore, setSourcingLoadingMore] = useState(false);
+  const [sourcingDisplayedResultIds, setSourcingDisplayedResultIds] = useState([]);
+  const sourcingMaxTopK = 100;
+  const hadSourcingEvidenceRef = useRef(false);
+
+  useEffect(() => {
+    hadSourcingEvidenceRef.current = false;
+    setSourcingHasMore(false);
+    setSourcingLoadedTopK(8);
+    setSourcingDisplayedResultIds([]);
+  }, [activeSessionId]);
+
+  const handleUICardAction = useCallback((action) => {
+    const actionType = String(action?.type || action?.action_key || '').trim();
+    if (actionType === 'open_evidence_citation') {
+      const citationId = String(action?.citation_id || '').trim();
+      setShowCanvasPanel(true);
+      setCanvasActiveTabKey('evidence');
+      setCanvasFocusEvidenceAnchorId(citationId ? `retrieval-evidence-${citationId}` : '');
+      return;
+    }
+    if (actionType.includes('canvas') || actionType.includes('evidence') || actionType.includes('sourcing')) {
+      setShowCanvasPanel(true);
+      setCanvasActiveTabKey(actionType.includes('sourcing') ? 'sourcing' : 'evidence');
+    }
+  }, [setCanvasActiveTabKey, setShowCanvasPanel]);
+
+  const generativeRegistry = useMemo(() => {
+    const registry = createDefaultGenerativeRegistry();
+    registry.register('knowledge_search', () => null);
+    registry.register('sourcing_candidates', () => null);
+    return registry;
+  }, []);
+
+  useEffect(() => {
+    if (!canvasFocusEvidenceAnchorId) {
+      return;
+    }
+    const timer = setTimeout(() => setCanvasFocusEvidenceAnchorId(''), 1600);
+    return () => clearTimeout(timer);
+  }, [canvasFocusEvidenceAnchorId]);
+
+  useEffect(() => {
+    const sourcingItem = [...(Array.isArray(timeline.items) ? timeline.items : [])]
+      .reverse()
+      .find((item) => String(item?.type || '').trim() === 'sourcing_candidates');
+    const payload = (
+      sourcingItem?.payload
+      && typeof sourcingItem.payload === 'object'
+      && !Array.isArray(sourcingItem.payload)
+    ) ? sourcingItem.payload : null;
+    if (!payload) {
+      setSourcingHasMore(false);
+      setSourcingLoadedTopK(8);
+      setSourcingDisplayedResultIds([]);
+      return;
+    }
+    const candidates = Array.isArray(payload.candidates) ? payload.candidates : [];
+    const nextIds = candidates
+      .map((item) => String(item?.result_id || item?.id || '').trim())
+      .filter(Boolean);
+    setSourcingDisplayedResultIds(nextIds);
+    setSourcingHasMore(payload.has_more === true);
+    if (Number.isFinite(Number(payload.requested_top_k))) {
+      setSourcingLoadedTopK(Number(payload.requested_top_k));
+    }
+  }, [timeline.items]);
+
+  const handleCanvasSourcingLoadMore = useCallback(async () => {
+    if (sourcingLoadingMore || !sourcingHasMore || sourcingLoadedTopK >= sourcingMaxTopK) {
+      return;
+    }
+    const sourcingItem = [...(Array.isArray(timeline.items) ? timeline.items : [])]
+      .reverse()
+      .find((item) => String(item?.type || '').trim() === 'sourcing_candidates');
+    const payload = (
+      sourcingItem?.payload
+      && typeof sourcingItem.payload === 'object'
+      && !Array.isArray(sourcingItem.payload)
+    ) ? sourcingItem.payload : null;
+    const query = String(payload?.query || '').trim();
+    const currentSessionId = String(activeSessionId || '').trim();
+    if (!query || !currentSessionId) {
+      return;
+    }
+    const nextTopK = Math.min(sourcingLoadedTopK + 8, sourcingMaxTopK);
+    setSourcingLoadingMore(true);
+    try {
+      const { sourcingPayload } = await requestSourcingSearchApi({
+        apiBaseUrl,
+        projectId,
+        userId,
+        sessionId: currentSessionId,
+        query,
+        topK: nextTopK,
+        appendMode: true,
+        lockExistingOrder: true,
+        baseResultIds: sourcingDisplayedResultIds,
+      });
+      timeline.onSourcingCandidates?.(parseSourcingCandidates(sourcingPayload));
+      setSourcingLoadedTopK(Number(sourcingPayload.requested_top_k) || nextTopK);
+      setSourcingHasMore(sourcingPayload.has_more === true);
+    } catch (_error) {
+      setSourcingHasMore(true);
+    } finally {
+      setSourcingLoadingMore(false);
+    }
+  }, [
+    activeSessionId,
+    apiBaseUrl,
+    projectId,
+    sourcingDisplayedResultIds,
+    sourcingHasMore,
+    sourcingLoadedTopK,
+    sourcingLoadingMore,
+    timeline,
+    userId,
+  ]);
+
+  const { canvasPanelNode, renderedTimelineItems } = useWorkspaceCanvasProjection({
+    timelineItems: timeline.items,
+    composerModeKey,
+    evidenceStrictMode,
+    evidenceHitScoreThreshold,
+    showCanvasPanel,
+    canvasFocusEvidenceAnchorId,
+    setCanvasActiveTabKey,
+    hadSourcingEvidenceRef,
+    setShowCanvasPanel,
+    canvasActiveTabKey,
+    canvasFullscreenOpen,
+    setCanvasFullscreenOpen,
+    inputState,
+    themeTokens,
+    languageGuardEnabled,
+    friendlyToneEnabled,
+    sourcingHasMore,
+    sourcingLoadingMore,
+    onCanvasSourcingLoadMore: handleCanvasSourcingLoadMore,
+  });
+
+  return {
+    canvasPanelNode,
+    renderedTimelineItems,
+    handleUICardAction,
+    generativeRegistry,
+  };
+}

package/src/app/core-chat-entry/useWorkspaceCanvasProjection.jsx

@@ -0,0 +1,171 @@
+import React, { useEffect, useMemo } from 'react';
+import { debugCoreLog, getCoreRuntimeMode } from '../../chat-core/runtime/runtimeMode.js';
+import { RESOLVED_UI_LABELS, RESPONSE_STYLE_POLICY } from './constants.js';
+import { selectProjectedCanvasEvidenceItems } from '../selectors/evidenceProjectionSelector.js';
+import {
+  selectCanvasAutoTab,
+  selectCanvasEvidencePresence,
+  selectCanvasTabs,
+  selectResolvedCanvasEvidenceTabKey,
+  selectShouldAutoOpenCanvasForSourcing,
+} from '../selectors/canvasTabsSelector.js';
+import { selectCanvasEvidenceSummary } from '../selectors/canvasEvidenceSummarySelector.js';
+import { selectRenderedTimelineItems } from '../selectors/assistantTextSelector.js';
+import { selectCanvasReportTemplate } from '../selectors/canvasReportTemplateSelector.js';
+import AppCanvasPanel from '../components/AppCanvasPanel.jsx';
+
+export function useWorkspaceCanvasProjection({
+  timelineItems,
+  composerModeKey,
+  evidenceStrictMode,
+  evidenceHitScoreThreshold,
+  showCanvasPanel,
+  canvasFocusEvidenceAnchorId,
+  setCanvasActiveTabKey,
+  hadSourcingEvidenceRef,
+  setShowCanvasPanel,
+  canvasActiveTabKey,
+  canvasFullscreenOpen,
+  setCanvasFullscreenOpen,
+  inputState,
+  themeTokens,
+  languageGuardEnabled,
+  friendlyToneEnabled,
+  sourcingHasMore = false,
+  sourcingLoadingMore = false,
+  onCanvasSourcingLoadMore,
+} = {}) {
+  const canvasEvidenceItems = useMemo(() => selectProjectedCanvasEvidenceItems({
+    timelineItems,
+    composerModeKey,
+    evidenceStrictMode,
+    evidenceHitScoreThreshold,
+  }), [composerModeKey, evidenceHitScoreThreshold, evidenceStrictMode, timelineItems]);
+
+  const canvasReportTemplate = useMemo(
+    () => selectCanvasReportTemplate(timelineItems),
+    [timelineItems],
+  );
+
+  useEffect(() => {
+    const runtimeMode = getCoreRuntimeMode();
+    debugCoreLog('canvas.projection', {
+      mode: runtimeMode.mode,
+      evidenceCount: canvasEvidenceItems.length,
+      hasReportTemplate: Boolean(canvasReportTemplate),
+      timelineTypes: (Array.isArray(timelineItems) ? timelineItems : [])
+        .map((item) => String(item?.type || '').trim())
+        .filter(Boolean),
+    });
+  }, [canvasEvidenceItems.length, canvasReportTemplate, timelineItems]);
+
+  useEffect(() => {
+    const nextAutoTab = selectCanvasAutoTab({
+      canvasEvidenceItems,
+      canvasFocusEvidenceAnchorId,
+      showCanvasPanel,
+      canvasActiveTabKey,
+    });
+    if (nextAutoTab && nextAutoTab !== canvasActiveTabKey) {
+      setCanvasActiveTabKey(nextAutoTab);
+    }
+  }, [
+    canvasActiveTabKey,
+    canvasEvidenceItems,
+    canvasFocusEvidenceAnchorId,
+    setCanvasActiveTabKey,
+    showCanvasPanel,
+  ]);
+
+  const { hasSourcingEvidenceRows, hasRetrievalEvidenceRows } = useMemo(
+    () => selectCanvasEvidencePresence(canvasEvidenceItems),
+    [canvasEvidenceItems],
+  );
+  const isPlanMode = String(composerModeKey || '').trim() === 'requirement_canvas';
+
+  useEffect(() => {
+    if (selectShouldAutoOpenCanvasForSourcing({
+      hasSourcingEvidenceRows,
+      hadSourcingEvidence: hadSourcingEvidenceRef?.current,
+    })) {
+      setShowCanvasPanel(true);
+      setCanvasActiveTabKey('sourcing');
+    }
+    if (hadSourcingEvidenceRef) {
+      hadSourcingEvidenceRef.current = hasSourcingEvidenceRows;
+    }
+  }, [hadSourcingEvidenceRef, hasSourcingEvidenceRows, setCanvasActiveTabKey, setShowCanvasPanel]);
+
+  const canvasTabs = useMemo(() => selectCanvasTabs({
+    isPlanMode,
+    canvasReportTemplate,
+    hasSourcingEvidenceRows,
+    hasRetrievalEvidenceRows,
+    resolvedUILabels: RESOLVED_UI_LABELS,
+  }), [canvasReportTemplate, hasRetrievalEvidenceRows, hasSourcingEvidenceRows, isPlanMode]);
+
+  const resolvedCanvasEvidenceTabKey = useMemo(() => selectResolvedCanvasEvidenceTabKey({
+    hasSourcingEvidenceRows,
+    canvasActiveTabKey,
+  }), [canvasActiveTabKey, hasSourcingEvidenceRows]);
+  const canvasEvidenceSummary = useMemo(
+    () => selectCanvasEvidenceSummary(canvasEvidenceItems),
+    [canvasEvidenceItems],
+  );
+
+  const canvasPanelNode = useMemo(() => (
+    <AppCanvasPanel
+      canvasActiveTabKey={canvasActiveTabKey}
+      showCanvasPanel={showCanvasPanel}
+      resolvedUILabels={RESOLVED_UI_LABELS}
+      canvasFullscreenOpen={canvasFullscreenOpen}
+      canvasTabs={canvasTabs}
+      resolvedCanvasEvidenceTabKey={resolvedCanvasEvidenceTabKey}
+      canvasEvidenceSummary={canvasEvidenceSummary}
+      canvasEvidenceItems={canvasEvidenceItems}
+      canvasFocusEvidenceAnchorId={canvasFocusEvidenceAnchorId}
+      canvasSourcingHasMore={sourcingHasMore}
+      canvasSourcingLoadingMore={sourcingLoadingMore}
+      onCanvasSourcingLoadMore={onCanvasSourcingLoadMore}
+      canvasReportTemplate={canvasReportTemplate}
+      inputState={inputState}
+      setCanvasActiveTabKey={setCanvasActiveTabKey}
+      setCanvasFullscreenOpen={setCanvasFullscreenOpen}
+      setShowCanvasPanel={setShowCanvasPanel}
+      themeTokens={themeTokens}
+    />
+  ), [
+    canvasActiveTabKey,
+    canvasEvidenceItems,
+    canvasEvidenceSummary,
+    canvasFocusEvidenceAnchorId,
+    canvasFullscreenOpen,
+    onCanvasSourcingLoadMore,
+    canvasReportTemplate,
+    sourcingHasMore,
+    sourcingLoadingMore,
+    canvasTabs,
+    inputState,
+    resolvedCanvasEvidenceTabKey,
+    setCanvasActiveTabKey,
+    setCanvasFullscreenOpen,
+    setShowCanvasPanel,
+    showCanvasPanel,
+    themeTokens,
+  ]);
+
+  const renderedTimelineItems = useMemo(() => selectRenderedTimelineItems({
+    timelineItems,
+    languageGuardEnabled,
+    friendlyToneEnabled,
+    responseStylePolicy: RESPONSE_STYLE_POLICY,
+  }), [friendlyToneEnabled, languageGuardEnabled, timelineItems]);
+
+  return {
+    canvasPanelNode,
+    renderedTimelineItems,
+    canvasEvidenceItems,
+  };
+}
+
+export default useWorkspaceCanvasProjection;

package/src/app/core-chat-entry/useWorkspaceComposerController.jsx

@@ -0,0 +1,199 @@
+import React, { useMemo, useState } from 'react';
+import { Typography } from 'antd';
+import ComposerSectionNode from './ComposerSectionNode.jsx';
+import {
+  WORKSPACE_CONTENT_MAX_WIDTH,
+  RESOLVED_UI_LABELS,
+  MODE_SWITCH_OPTIONS,
+  MODE_SUGGESTION_TIP_RULES,
+} from './constants.js';
+import { useAppActionErrorGuards } from './useAppActionErrorGuards.js';
+import {
+  selectLatestAssistantQuestionPendingReply,
+  selectModeSuggestionContextFlags,
+  selectModeSuggestionTipRules,
+} from '../selectors/modeSuggestionSelector.js';
+import { useComposerAttachmentSync } from '../hooks/useComposerAttachmentSync.js';
+import { useSendWithContextRefs } from '../hooks/useSendWithContextRefs.js';
+import { useComposerChooserHandlers } from '../hooks/useComposerChooserHandlers.js';
+import { useUserThresholdProfile } from '../hooks/useUserThresholdProfile.js';
+import TriggerThresholdPopoverContent from '../components/TriggerThresholdPopoverContent.jsx';
+
+const { Text } = Typography;
+
+export function useWorkspaceComposerController({
+  userId,
+  projectId,
+  activeSessionId,
+  realApi,
+  viewModel,
+  apiReadinessGate,
+  blockedApiError,
+  sourceItems,
+  activeWorkspaceTab,
+  setActiveWorkspaceTab,
+  setShowCanvasPanel,
+  setCanvasActiveTabKey,
+  themeTokens,
+}) {
+  const {
+    evidenceStrictMode,
+    setEvidenceStrictMode,
+    evidenceHitScoreThreshold,
+    setEvidenceHitScoreThreshold,
+    languageGuardEnabled,
+    setLanguageGuardEnabled,
+    friendlyToneEnabled,
+    setFriendlyToneEnabled,
+    questionModeSuggestionEnabled,
+    setQuestionModeSuggestionEnabled,
+  } = useUserThresholdProfile({ userId, projectId });
+
+  const [composerModeKey, setComposerModeKey] = useState('auto');
+  const [sourcingChooser, setSourcingChooser] = useState(null);
+  const [, setSourcingChooserDismissDraftKey] = useState('');
+
+  const composerFileList = Array.isArray(viewModel.composer.fileList)
+    ? viewModel.composer.fileList
+    : [];
+
+  const {
+    composerFileListRef,
+    hasNonReadyAttachments,
+    readyAttachmentRefs,
+  } = useComposerAttachmentSync({
+    composerFileList,
+    onSyncFileList: viewModel.composer.onSyncFileList,
+    realSourceApi: realApi?.sourceAPI || null,
+    projectId,
+    userId,
+    activeSessionId,
+  });
+
+  const latestSourcingContext = useMemo(() => {
+    const sourcingItem = [...(Array.isArray(viewModel.timeline.items) ? viewModel.timeline.items : [])]
+      .reverse()
+      .find((item) => String(item?.type || '').trim() === 'sourcing_candidates');
+    const payload = (
+      sourcingItem?.payload
+      && typeof sourcingItem.payload === 'object'
+      && !Array.isArray(sourcingItem.payload)
+    ) ? sourcingItem.payload : {};
+    const latestSourcingQuery = String(payload?.query || '').trim();
+    const latestSourcingResultIds = (Array.isArray(payload?.candidates) ? payload.candidates : [])
+      .map((item) => String(item?.result_id || item?.id || '').trim())
+      .filter(Boolean);
+    return {
+      latestSourcingQuery,
+      latestSourcingResultIds,
+    };
+  }, [viewModel.timeline.items]);
+
+  const handleSendWithSourceRefs = useSendWithContextRefs({
+    composerModeKey,
+    setSourcingChooser,
+    sourceItems,
+    composer: viewModel.composer,
+    activeWorkspaceTab,
+    setActiveWorkspaceTab,
+    composerFileListRef,
+    hasNonReadyAttachments,
+    readyAttachmentRefs,
+    latestSourcingQuery: latestSourcingContext.latestSourcingQuery,
+    latestSourcingResultIds: latestSourcingContext.latestSourcingResultIds,
+  });
+
+  const actionGuards = useAppActionErrorGuards({
+    blocked: apiReadinessGate.blocked,
+    blockedError: blockedApiError,
+    sessionListError: apiReadinessGate.error || viewModel.sessionList.error || null,
+    composerError: viewModel.composer.error || null,
+    onCreateProject: viewModel.sessionList.onCreateProject,
+    onCreateSession: viewModel.sessionList.onCreateSession,
+    onSend: handleSendWithSourceRefs,
+  });
+
+  const inputState = {
+    inputValue: viewModel.composer.value,
+    fileList: viewModel.composer.fileList,
+    handleInputChange: viewModel.composer.onChange,
+    handleRemoveFile: viewModel.composer.onRemoveFile,
+  };
+
+  const latestAssistantQuestionPendingReply = useMemo(
+    () => selectLatestAssistantQuestionPendingReply(viewModel.timeline.items),
+    [viewModel.timeline.items],
+  );
+
+  const suggestionTipRules = useMemo(() => selectModeSuggestionTipRules({
+    baseRules: MODE_SUGGESTION_TIP_RULES,
+    questionModeSuggestionEnabled,
+  }), [questionModeSuggestionEnabled]);
+
+  const suggestionContextFlags = useMemo(() => selectModeSuggestionContextFlags({
+    latestAssistantQuestionPendingReply,
+  }), [latestAssistantQuestionPendingReply]);
+
+  const { onComposerActionSelect, onComposerChooserDismiss } = useComposerChooserHandlers({
+    setComposerModeKey,
+    setSourcingChooser,
+    setShowCanvasPanel,
+    setCanvasActiveTabKey,
+    setSourcingChooserDismissDraftKey,
+    activeSessionId: viewModel.sessionList.activeSessionId,
+    composerValue: viewModel.composer.value,
+  });
+
+  const triggerThresholdPopoverContent = (
+    <TriggerThresholdPopoverContent
+      evidenceStrictMode={evidenceStrictMode}
+      setEvidenceStrictMode={setEvidenceStrictMode}
+      evidenceHitScoreThreshold={evidenceHitScoreThreshold}
+      setEvidenceHitScoreThreshold={setEvidenceHitScoreThreshold}
+      languageGuardEnabled={languageGuardEnabled}
+      setLanguageGuardEnabled={setLanguageGuardEnabled}
+      friendlyToneEnabled={friendlyToneEnabled}
+      setFriendlyToneEnabled={setFriendlyToneEnabled}
+      questionModeSuggestionEnabled={questionModeSuggestionEnabled}
+      setQuestionModeSuggestionEnabled={setQuestionModeSuggestionEnabled}
+    />
+  );
+
+  const composerNode = (
+    <ComposerSectionNode
+      themeTokens={themeTokens}
+      contentMaxWidth={WORKSPACE_CONTENT_MAX_WIDTH}
+      streamLoading={viewModel.composer.loading}
+      sendDisabled={hasNonReadyAttachments}
+      resolvedUILabels={RESOLVED_UI_LABELS}
+      modeSwitchOptions={MODE_SWITCH_OPTIONS}
+      inputState={inputState}
+      onAttachFiles={viewModel.composer.onAttachFiles}
+      onSend={actionGuards.handleSend}
+      effectiveComposerChooser={sourcingChooser}
+      onComposerActionSelect={onComposerActionSelect}
+      onComposerChooserDismiss={onComposerChooserDismiss}
+      initialModeKey={composerModeKey}
+      onModeChanged={setComposerModeKey}
+      userId={userId}
+      shouldRenderModeSuggestion
+      tipRules={suggestionTipRules}
+      suggestionContextFlags={suggestionContextFlags}
+      intentEscalationPolicyPopoverContent={triggerThresholdPopoverContent}
+      contextGaugePopoverContent={
+        <Text type="secondary">{String(viewModel.contextUsage?.text || '上下文窗口占用（暂无数据）')}</Text>
+      }
+    />
+  );
+
+  return {
+    actionGuards,
+    inputState,
+    composerNode,
+    composerModeKey,
+    languageGuardEnabled,
+    friendlyToneEnabled,
+    evidenceStrictMode,
+    evidenceHitScoreThreshold,
+  };
+}