+ 
+ {item.label}
+
+
+
+ );
+ }
+
+ return (
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+interface FeedbackStatsProps {
+ stats: {
+ totalFeedback: number;
+ totalLikes: number;
+ totalDislikes: number;
+ satisfactionRate: number;
+ } | null;
+ loading?: boolean;
+}
+
+export function FeedbackStatsCards({ stats, loading }: FeedbackStatsProps) {
+ const { t } = useTranslation();
+
+ const cards = [
+ {
+ title: t('monitoring.feedback.totalFeedback'),
+ value: stats?.totalFeedback ?? 0,
+ icon: (
+
+ ),
+ variant: 'default' as const,
+ },
+ {
+ title: t('monitoring.feedback.totalLikes'),
+ value: stats?.totalLikes ?? 0,
+ icon:
+
+
+
+ + {title} +
++ {value} +
+ {subtitle && ( ++ {subtitle} +
+ )} + {trend && ( +
+ {trend.direction === 'up' && (
+
+ )}
+
+ {icon}
+
+
+ {cards.map((card, index) => (
+
+ );
+}
diff --git a/web/src/app/home/monitoring/components/FeedbackList.tsx b/web/src/app/home/monitoring/components/FeedbackList.tsx
new file mode 100644
index 00000000..9555eef5
--- /dev/null
+++ b/web/src/app/home/monitoring/components/FeedbackList.tsx
@@ -0,0 +1,275 @@
+'use client';
+
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import {
+ ThumbsUp,
+ ThumbsDown,
+ ChevronRight,
+ ChevronDown,
+ ExternalLink,
+} from 'lucide-react';
+import { FeedbackRecord } from '../types/monitoring';
+import { Button } from '@/components/ui/button';
+import { LoadingSpinner } from '@/components/ui/loading-spinner';
+
+interface FeedbackListProps {
+ feedback: FeedbackRecord[];
+ loading?: boolean;
+ onViewMessage?: (messageId: string) => void;
+}
+
+export function FeedbackList({
+ feedback,
+ loading,
+ onViewMessage,
+}: FeedbackListProps) {
+ const { t } = useTranslation();
+ const [expandedId, setExpandedId] = React.useState
+
+ );
+ }
+
+ if (!feedback || feedback.length === 0) {
+ return (
+
+
+
+ );
+ }
+
+ return (
+ + {t('monitoring.feedback.noFeedback')} +
++ {t('monitoring.feedback.noFeedbackDescription')} +
+
+ {feedback.map((item) => (
+
+ );
+}
diff --git a/web/src/app/home/monitoring/hooks/useFeedbackData.ts b/web/src/app/home/monitoring/hooks/useFeedbackData.ts
new file mode 100644
index 00000000..17c17ceb
--- /dev/null
+++ b/web/src/app/home/monitoring/hooks/useFeedbackData.ts
@@ -0,0 +1,192 @@
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { httpClient } from '@/app/infra/http';
+import { FeedbackRecord, FeedbackStats } from '../types/monitoring';
+
+interface UseFeedbackDataParams {
+ botIds?: string[];
+ pipelineIds?: string[];
+ startTime?: string;
+ endTime?: string;
+ feedbackType?: 'like' | 'dislike';
+ limit?: number;
+ offset?: number;
+}
+
+interface RawFeedbackRecord {
+ id: string;
+ timestamp: string;
+ feedback_id: string;
+ feedback_type: number;
+ feedback_content?: string;
+ inaccurate_reasons?: string;
+ bot_id?: string;
+ bot_name?: string;
+ pipeline_id?: string;
+ pipeline_name?: string;
+ session_id?: string;
+ message_id?: string;
+ stream_id?: string;
+ user_id?: string;
+ platform?: string;
+}
+
+interface RawFeedbackStats {
+ total_feedback: number;
+ total_likes: number;
+ total_dislikes: number;
+ satisfaction_rate: number;
+ by_bot?: Array<{
+ bot_id: string;
+ bot_name: string;
+ total: number;
+ likes: number;
+ dislikes: number;
+ }>;
+}
+
+/**
+ * Custom hook for fetching and managing feedback data
+ */
+export function useFeedbackData(params: UseFeedbackDataParams = {}) {
+ const [feedback, setFeedback] = useState
+ {/* Header */}
+
+ ))}
+ toggleExpand(item.id)}
+ >
+
+
+ {/* Expanded Details */}
+ {expandedId === item.id && (
+
+
+
+ {/* Expand Icon */}
+
+
+ {/* Timestamp */}
+
+ {expandedId === item.id ? (
+
+
+ {/* Content */}
+
+
+
+ {/* Feedback Type Icon */}
+ {item.feedbackType === 'like' ? (
+
+
+ {item.feedbackContent && (
+ + {item.feedbackContent} +
+ )} + + {item.inaccurateReasons && + item.inaccurateReasons.length > 0 && ( +
+ {item.inaccurateReasons.map((reason, idx) => (
+
+ {reason}
+
+ ))}
+
+ )}
+
+
+ {item.timestamp.toLocaleString()}
+
+
+
+
+ )}
+
+ {/* Context Info */}
+
+
+
+
+ {/* Feedback Content */}
+ {item.feedbackContent && (
+ + {t('monitoring.feedback.contextInfo')} +
+
+ {item.botName && (
+
+
+
+ )}
+ {item.pipelineName && (
+
+ {t('monitoring.messageList.bot')}
+
+
+ {item.botName}
+
+
+
+ )}
+ {item.sessionId && (
+
+ {t('monitoring.messageList.pipeline')}
+
+
+ {item.pipelineName}
+
+
+
+ )}
+ {item.userId && (
+
+ {t('monitoring.sessions.sessionId')}
+
+
+ {item.sessionId}
+
+
+
+ )}
+ {item.messageId && (
+
+ {t('monitoring.feedback.userId')}
+
+
+ {item.userId}
+
+
+
+ )}
+ {item.streamId && (
+
+ {t('monitoring.feedback.messageId')}
+
+
+ {item.messageId}
+ {onViewMessage && (
+
+ )}
+
+
+
+ )}
+
+ {t('monitoring.feedback.streamId')}
+
+
+ {item.streamId}
+
+
+
+ )}
+ + {t('monitoring.feedback.feedbackContent')} +
++ {item.feedbackContent} +
+
+ {loading && (
+
+
+
+ )}
+
+ {!loading && (
+ <>
+ {/* Feedback Stats Cards */}
+
+
+
+ {/* Feedback List */}
+ + {t('monitoring.feedback.feedbackList')} +
+
{loading && (
diff --git a/web/src/app/home/monitoring/types/monitoring.ts b/web/src/app/home/monitoring/types/monitoring.ts
index e1eb18d8..564bd97e 100644
--- a/web/src/app/home/monitoring/types/monitoring.ts
+++ b/web/src/app/home/monitoring/types/monitoring.ts
@@ -162,6 +162,39 @@ export interface DateRange {
to: Date;
}
+export interface FeedbackRecord {
+ id: string;
+ timestamp: Date;
+ feedbackId: string;
+ feedbackType: 'like' | 'dislike';
+ feedbackContent?: string;
+ inaccurateReasons?: string[];
+ botId?: string;
+ botName?: string;
+ pipelineId?: string;
+ pipelineName?: string;
+ sessionId?: string;
+ messageId?: string;
+ streamId?: string;
+ userId?: string;
+ platform?: string;
+}
+
+export interface FeedbackStats {
+ totalFeedback: number;
+ totalLikes: number;
+ totalDislikes: number;
+ satisfactionRate: number;
+ byBot?: Array<{
+ botId: string;
+ botName: string;
+ totalFeedback: number;
+ totalLikes: number;
+ totalDislikes: number;
+ satisfactionRate: number;
+ }>;
+}
+
export interface MonitoringData {
overview: OverviewMetrics;
messages: MonitoringMessage[];
@@ -170,11 +203,14 @@ export interface MonitoringData {
modelCalls: ModelCall[];
sessions: SessionInfo[];
errors: ErrorLog[];
+ feedback?: FeedbackRecord[];
+ feedbackStats?: FeedbackStats;
totalCount: {
messages: number;
llmCalls: number;
embeddingCalls: number;
sessions: number;
errors: number;
+ feedback?: number;
};
}
diff --git a/web/src/app/infra/entities/adapter-docs.ts b/web/src/app/infra/entities/adapter-docs.ts
new file mode 100644
index 00000000..fbafc3c6
--- /dev/null
+++ b/web/src/app/infra/entities/adapter-docs.ts
@@ -0,0 +1,23 @@
+/**
+ * Resolves the documentation URL for a given adapter from its
+ * spec.help_links map, selecting the best match for the current locale
+ * with a fallback to English.
+ */
+export function getAdapterDocUrl(
+ helpLinks: Record | undefined,
+ locale: string,
+): string | null {
+ if (!helpLinks) return null;
+
+ // Map locale to simplified language key
+ let lang: string;
+ if (locale.startsWith('zh')) {
+ lang = 'zh';
+ } else if (locale.startsWith('ja')) {
+ lang = 'ja';
+ } else {
+ lang = 'en';
+ }
+
+ return helpLinks[lang] ?? helpLinks['en'] ?? null;
+}
diff --git a/web/src/app/infra/entities/api/index.ts b/web/src/app/infra/entities/api/index.ts
index 2819133a..56b79888 100644
--- a/web/src/app/infra/entities/api/index.ts
+++ b/web/src/app/infra/entities/api/index.ts
@@ -118,6 +118,7 @@ export interface Adapter {
icon?: string;
spec: {
categories?: string[];
+ help_links?: Record;
config: IDynamicFormItemSchema[];
};
}
diff --git a/web/src/app/wizard/page.tsx b/web/src/app/wizard/page.tsx
index 063c0a6c..3d5e435f 100644
--- a/web/src/app/wizard/page.tsx
+++ b/web/src/app/wizard/page.tsx
@@ -13,6 +13,7 @@ import {
PartyPopper,
Loader2,
X,
+ ExternalLink,
} from 'lucide-react';
import { httpClient } from '@/app/infra/http/HttpClient';
@@ -45,6 +46,8 @@ import {
groupByCategory,
getCategoryLabel,
} from '@/app/infra/entities/adapter-categories';
+import { getAdapterDocUrl } from '@/app/infra/entities/adapter-docs';
+import i18n from 'i18next';
import { Button } from '@/components/ui/button';
import {
@@ -798,6 +801,24 @@ function StepPlatform({
-
- {t('wizard.config.platformConfig', {
- platform: adapterLabel,
- })}
-
+
{extractI18nObject(adapter.description)}
+ {(() => { + const docUrl = getAdapterDocUrl( + adapter.spec.help_links, + i18n.language, + ); + return docUrl ? ( + e.stopPropagation()} + > +
+
+ {t('wizard.config.platformConfig', {
+ platform: adapterLabel,
+ })}
+
+ {selectedAdapterName &&
+ (() => {
+ const selectedAdapter = adapters.find(
+ (a) => a.name === selectedAdapterName,
+ );
+ const docUrl = getAdapterDocUrl(
+ selectedAdapter?.spec.help_links,
+ i18n.language,
+ );
+ return docUrl ? (
+
+