@vibe-forge/tsconfigs 0.7.2 → 0.8.0

package/dist/apps/client/src/components/ArchiveView.js

@@ -0,0 +1,119 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import './ArchiveView.scss';
+import { App, Button, Checkbox, Empty, Input, List, Popconfirm, Space, Tag, Tooltip } from 'antd';
+import dayjs from 'dayjs';
+import { useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import useSWR from 'swr';
+import { deleteSession, getApiErrorMessage, listSessions, updateSession } from '../api';
+export function ArchiveView() {
+    const { t } = useTranslation();
+    const { message } = App.useApp();
+    const { data: sessionsRes, mutate } = useSWR('/api/sessions/archived', async () => listSessions('archived'));
+    const sessions = sessionsRes?.sessions ?? [];
+    const [searchQuery, setSearchQuery] = useState('');
+    const [selectedIds, setSelectedIds] = useState(new Set());
+    const [isBatchMode, setIsBatchMode] = useState(false);
+    const filteredSessions = useMemo(() => {
+        if (searchQuery.trim() === '')
+            return sessions;
+        const query = searchQuery.toLowerCase();
+        return sessions.filter((s) => {
+            const title = s.title ?? '';
+            const lastMsg = s.lastMessage ?? '';
+            const lastUserMsg = s.lastUserMessage ?? '';
+            const tags = (s.tags ?? []).join(' ');
+            const searchStr = `${title} ${s.id} ${lastMsg} ${lastUserMsg} ${tags}`.toLowerCase();
+            return searchStr.includes(query);
+        });
+    }, [sessions, searchQuery]);
+    const handleRestore = async (id) => {
+        try {
+            await updateSession(id, { isArchived: false });
+            void message.success(t('common.restoreSuccess', 'Restored successfully'));
+            void mutate();
+        }
+        catch (err) {
+            void message.error(getApiErrorMessage(err, t('common.restoreFailed', 'Failed to restore')));
+        }
+    };
+    const handleDelete = async (id) => {
+        try {
+            await deleteSession(id);
+            void message.success(t('common.deleteSuccess', 'Deleted successfully'));
+            void mutate();
+        }
+        catch (err) {
+            void message.error(getApiErrorMessage(err, t('common.deleteFailed', 'Failed to delete')));
+        }
+    };
+    const handleToggleSelect = (id) => {
+        const next = new Set(selectedIds);
+        if (next.has(id)) {
+            next.delete(id);
+        }
+        else {
+            next.add(id);
+        }
+        setSelectedIds(next);
+    };
+    const handleSelectAll = (selected) => {
+        if (selected) {
+            setSelectedIds(new Set(filteredSessions.map(s => s.id)));
+        }
+        else {
+            setSelectedIds(new Set());
+        }
+    };
+    const handleBatchRestore = async () => {
+        try {
+            await Promise.all(Array.from(selectedIds).map(async (id) => updateSession(id, { isArchived: false })));
+            void message.success(t('common.batchRestoreSuccess', 'Batch restored successfully'));
+            setSelectedIds(new Set());
+            setIsBatchMode(false);
+            void mutate();
+        }
+        catch (err) {
+            void message.error(getApiErrorMessage(err, t('common.batchRestoreFailed', 'Failed to restore some sessions')));
+        }
+    };
+    const handleBatchDelete = async () => {
+        try {
+            await Promise.all(Array.from(selectedIds).map(async (id) => deleteSession(id)));
+            void message.success(t('common.batchDeleteSuccess', 'Batch deleted successfully'));
+            setSelectedIds(new Set());
+            setIsBatchMode(false);
+            void mutate();
+        }
+        catch (err) {
+            void message.error(getApiErrorMessage(err, t('common.batchDeleteFailed', 'Failed to delete some sessions')));
+        }
+    };
+    const isAllSelected = filteredSessions.length > 0 && selectedIds.size === filteredSessions.length;
+    return (_jsxs("div", { className: 'archive-view', children: [_jsxs("div", { className: 'archive-view__header', children: [_jsx(Space, { size: 8, className: 'archive-view__title', children: _jsx("h2", { className: 'archive-view__title-text', children: t('common.archivedSessions') }) }), _jsx(Space, { children: isBatchMode
+                            ? (_jsxs(_Fragment, { children: [_jsx("span", { className: 'archive-view__batch-info', children: t('common.selectedCount', { count: selectedIds.size }) }), _jsx(Tooltip, { title: t('common.cancel'), children: _jsx(Button, { icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "close" }), onClick: () => {
+                                                setIsBatchMode(false);
+                                                setSelectedIds(new Set());
+                                            }, className: 'archive-view__icon-button' }) }), _jsx(Tooltip, { title: t('common.batchRestore'), children: _jsx(Button, { type: 'primary', icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "unarchive" }), onClick: () => {
+                                                void handleBatchRestore();
+                                            }, disabled: selectedIds.size === 0, className: 'archive-view__icon-button' }) }), _jsx(Popconfirm, { title: t('common.deleteConfirm', { count: selectedIds.size }), onConfirm: () => {
+                                            void handleBatchDelete();
+                                        }, disabled: selectedIds.size === 0, children: _jsx(Tooltip, { title: t('common.batchDelete'), children: _jsx(Button, { danger: true, icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "delete_sweep" }), disabled: selectedIds.size === 0, className: 'archive-view__icon-button' }) }) })] }))
+                            : (_jsx(Tooltip, { title: t('common.batchMode'), children: _jsx(Button, { icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "checklist" }), onClick: () => setIsBatchMode(true), disabled: sessions.length === 0, className: 'archive-view__icon-button' }) })) })] }), _jsxs("div", { className: 'archive-view__filter-bar', children: [isBatchMode && (_jsx("div", { className: 'archive-view__select-all', children: _jsx(Tooltip, { title: isAllSelected ? t('common.deselectAll') : t('common.selectAll'), children: _jsx(Checkbox, { checked: isAllSelected, indeterminate: selectedIds.size > 0 && selectedIds.size < filteredSessions.length, onChange: (e) => handleSelectAll(e.target.checked) }) }) })), _jsx(Input, { prefix: _jsx("span", { className: 'material-symbols-rounded archive-view__search-icon', children: "search" }), placeholder: t('common.search'), value: searchQuery, onChange: e => setSearchQuery(e.target.value), allowClear: true, className: 'archive-view__search-input' })] }), _jsx("div", { className: 'archive-view__list', children: filteredSessions.length === 0
+                    ? (_jsx(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE, description: searchQuery ? t('common.noSessions') : t('common.noArchivedSessions') }))
+                    : (_jsx(List, { itemLayout: 'horizontal', dataSource: filteredSessions, renderItem: (session) => (_jsx(List.Item, { className: [
+                                'archive-view__item',
+                                selectedIds.has(session.id) ? 'archive-view__item--selected' : '',
+                                isBatchMode ? 'archive-view__item--batch' : ''
+                            ].filter(Boolean).join(' '), onClick: () => isBatchMode && handleToggleSelect(session.id), children: _jsxs("div", { className: 'archive-view__item-row', children: [isBatchMode && (_jsx("div", { className: 'archive-view__item-select', children: _jsx(Checkbox, { checked: selectedIds.has(session.id), onChange: () => handleToggleSelect(session.id), onClick: (e) => e.stopPropagation() }) })), _jsx("span", { className: 'material-symbols-rounded archive-view__item-icon', children: "chat_bubble" }), _jsxs("div", { className: 'archive-view__item-main', children: [_jsx("span", { className: 'archive-view__item-title', children: (session.title != null && session.title !== '')
+                                                    ? session.title
+                                                    : (session.lastMessage != null && session.lastMessage !== '')
+                                                        ? session.lastMessage
+                                                        : t('common.newChat') }), session.tags && session.tags.length > 0 && (_jsx("div", { className: 'archive-view__item-tags', children: session.tags.map((tag) => (_jsx(Tag, { className: 'archive-view__item-tag', children: tag }, tag))) })), _jsx("span", { className: 'archive-view__item-time', children: dayjs(session.createdAt).format('YYYY-MM-DD HH:mm') })] }), !isBatchMode && (_jsxs("div", { className: 'archive-view__item-actions', children: [_jsx(Tooltip, { title: t('common.restore'), children: _jsx(Button, { type: 'text', size: 'small', className: 'archive-view__item-action-button', icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "unarchive" }), onClick: (e) => {
+                                                        e.stopPropagation();
+                                                        void handleRestore(session.id);
+                                                    } }) }), _jsx(Popconfirm, { title: t('common.deleteSessionConfirm'), onConfirm: (e) => {
+                                                    e?.stopPropagation();
+                                                    void handleDelete(session.id);
+                                                }, children: _jsx(Button, { type: 'text', size: 'small', danger: true, className: 'archive-view__item-action-button', icon: _jsx("span", { className: 'material-symbols-rounded archive-view__action-icon', children: "delete" }), onClick: (e) => e.stopPropagation() }) })] }))] }) })) })) })] }));
+}

package/dist/apps/client/src/components/CodeBlock.d.ts

@@ -0,0 +1,7 @@
+import './CodeBlock.scss';
+export declare function CodeBlock({ code, lang, showLineNumbers, hideHeader }: {
+    code: string;
+    lang?: string;
+    showLineNumbers?: boolean;
+    hideHeader?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/apps/client/src/components/CodeBlock.js

@@ -0,0 +1,121 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './CodeBlock.scss';
+import { useAtomValue } from 'jotai';
+import { useEffect, useState } from 'react';
+import { codeToHtml } from 'shiki';
+import { themeAtom } from '#~/store/index.js';
+export function CodeBlock({ code, lang = 'json', showLineNumbers = false, hideHeader = false }) {
+    const [html, setHtml] = useState('');
+    const [copied, setCopied] = useState(false);
+    const themeMode = useAtomValue(themeAtom);
+    const handleCopy = async () => {
+        try {
+            await navigator.clipboard.writeText(code);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+        catch (err) {
+            console.error('Failed to copy code:', err);
+        }
+    };
+    const getLangIcon = (language) => {
+        const lang = language.toLowerCase();
+        const iconMap = {
+            js: 'javascript-plain',
+            javascript: 'javascript-plain',
+            ts: 'typescript-plain',
+            typescript: 'typescript-plain',
+            html: 'html5-plain',
+            css: 'css3-plain',
+            python: 'python-plain',
+            py: 'python-plain',
+            java: 'java-plain',
+            cpp: 'cplusplus-plain',
+            c: 'c-plain',
+            csharp: 'csharp-plain',
+            cs: 'csharp-plain',
+            go: 'go-original-wordmark',
+            rust: 'rust-original',
+            rs: 'rust-original',
+            php: 'php-plain',
+            ruby: 'ruby-plain',
+            rb: 'ruby-plain',
+            swift: 'swift-plain',
+            kotlin: 'kotlin-plain',
+            kt: 'kotlin-plain',
+            scala: 'scala-plain',
+            shell: 'bash-plain',
+            sh: 'bash-plain',
+            bash: 'bash-plain',
+            sql: 'sqlline-plain',
+            json: 'json-plain',
+            yaml: 'yaml-plain',
+            yml: 'yaml-plain',
+            markdown: 'markdown-original',
+            md: 'markdown-original',
+            docker: 'docker-plain',
+            dockerfile: 'docker-plain',
+            react: 'react-original',
+            jsx: 'react-original',
+            tsx: 'react-original',
+            vue: 'vuejs-plain',
+            angular: 'angularjs-plain',
+            sass: 'sass-original',
+            scss: 'sass-original',
+            less: 'less-plain-wordmark',
+            stylus: 'stylus-plain',
+            mongodb: 'mongodb-plain',
+            mysql: 'mysql-plain',
+            postgresql: 'postgresql-plain',
+            redis: 'redis-plain',
+            git: 'git-plain',
+            npm: 'npm-original-wordmark',
+            yarn: 'yarn-plain',
+            nginx: 'nginx-original',
+            bash_profile: 'bash-plain'
+        };
+        const iconClass = iconMap[lang] || 'code-plain';
+        return _jsx("i", { className: `devicon-${iconClass} colored`, style: { fontSize: '14px' } });
+    };
+    useEffect(() => {
+        let isMounted = true;
+        const isDark = themeMode === 'dark' ||
+            (themeMode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches);
+        void codeToHtml(code, {
+            lang,
+            theme: isDark ? 'github-dark' : 'github-light',
+            transformers: showLineNumbers
+                ? [
+                    {
+                        name: 'line-numbers',
+                        line(node, line) {
+                            node.children.unshift({
+                                type: 'element',
+                                tagName: 'span',
+                                properties: {
+                                    class: 'line-number',
+                                    style: 'display: inline-block; width: 2rem; margin-right: 1rem; text-align: right; color: #9ca3af; user-select: none;'
+                                },
+                                children: [{ type: 'text', value: String(line) }]
+                            });
+                        }
+                    }
+                ]
+                : []
+        }).then(h => {
+            if (isMounted)
+                setHtml(h);
+        });
+        return () => {
+            isMounted = false;
+        };
+    }, [code, lang, showLineNumbers, themeMode]);
+    if (html === '') {
+        return (_jsxs("div", { className: 'code-block-wrapper', children: [!hideHeader && (_jsxs("div", { className: 'code-block-header', children: [_jsxs("div", { className: 'code-lang-container', children: [getLangIcon(lang), _jsx("span", { className: 'code-lang', children: lang })] }), _jsx("button", { className: 'copy-button', onClick: () => {
+                                void handleCopy();
+                            }, children: _jsx("span", { className: 'material-symbols-rounded', children: copied ? 'check' : 'content_copy' }) })] })), _jsx("pre", { style: { margin: 0, padding: 12, fontSize: 12, color: '#4b5563', overflowX: 'auto' }, children: _jsx("code", { children: code }) })] }));
+    }
+    return (_jsxs("div", { className: 'code-block-wrapper', children: [!hideHeader && (_jsxs("div", { className: 'code-block-header', children: [_jsxs("div", { className: 'code-lang-container', children: [getLangIcon(lang), _jsx("span", { className: 'code-lang', children: lang })] }), _jsx("button", { className: 'copy-button', onClick: () => {
+                            void handleCopy();
+                        }, children: _jsx("span", { className: 'material-symbols-rounded', children: copied ? 'check' : 'content_copy' }) })] })), _jsx("div", { dangerouslySetInnerHTML: { __html: html } })] }));
+}

package/dist/apps/client/src/components/ConfigView.d.ts

@@ -0,0 +1,2 @@
+import './ConfigView.scss';
+export declare function ConfigView(): import("react/jsx-runtime").JSX.Element;

package/dist/apps/client/src/components/ConfigView.js

@@ -0,0 +1,207 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './ConfigView.scss';
+import { App, Empty, Space, Spin, Tabs } from 'antd';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import useSWR from 'swr';
+import { getApiErrorMessage, getConfig, updateConfig } from '../api';
+import { useQueryParams } from '../hooks/useQueryParams';
+import { AboutSection, ConfigSectionPanel, ConfigSourceSwitch, DisplayValue } from './config';
+import { AppSettingsPanel } from './config/AppSettingsPanel';
+import { cloneValue, getValueByPath, isEmptyValue } from './config/configUtils';
+export function ConfigView() {
+    const { t } = useTranslation();
+    const { message } = App.useApp();
+    const { data, isLoading, error, mutate } = useSWR('/api/config', getConfig);
+    const { values: queryValues, update: updateQuery, searchParams } = useQueryParams({
+        keys: ['tab', 'source'],
+        defaults: { tab: 'general', source: 'project' }
+    });
+    const sourceKey = queryValues.source === 'user' ? 'user' : 'project';
+    const setSourceKey = (next) => updateQuery({ source: next });
+    const [drafts, setDrafts] = useState({});
+    const configPresent = data?.meta?.configPresent;
+    const currentSource = data?.sources?.[sourceKey];
+    const draftsRef = useRef(drafts);
+    const saveTimersRef = useRef({});
+    const savingRef = useRef({});
+    const lastSavedRef = useRef({});
+    const mergedModelServices = useMemo(() => data?.sources?.merged?.modelServices ?? {}, [
+        data?.sources?.merged?.modelServices
+    ]);
+    const mergedAdapters = useMemo(() => data?.sources?.merged?.adapters ?? {}, [
+        data?.sources?.merged?.adapters
+    ]);
+    useEffect(() => {
+        if (searchParams.get('source') != null)
+            return;
+        if (configPresent?.project) {
+            updateQuery({ source: 'project' });
+        }
+        else if (configPresent?.user) {
+            updateQuery({ source: 'user' });
+        }
+    }, [configPresent?.project, configPresent?.user]);
+    const configTabKeys = useMemo(() => new Set([
+        'general',
+        'conversation',
+        'models',
+        'modelServices',
+        'channels',
+        'adapters',
+        'plugins',
+        'mcp',
+        'shortcuts'
+    ]), []);
+    const tabs = useMemo(() => [
+        { key: 'group-config', type: 'group', label: t('config.groups.config') },
+        { key: 'general', icon: 'tune', label: t('config.sections.general'), value: currentSource?.general },
+        {
+            key: 'conversation',
+            icon: 'forum',
+            label: t('config.sections.conversation'),
+            value: currentSource?.conversation
+        },
+        {
+            key: 'models',
+            icon: 'tune',
+            label: t('config.sections.models'),
+            value: currentSource?.models
+        },
+        {
+            key: 'modelServices',
+            icon: 'model_training',
+            label: t('config.sections.modelServices'),
+            value: currentSource?.modelServices
+        },
+        {
+            key: 'channels',
+            icon: 'campaign',
+            label: t('config.sections.channels'),
+            value: currentSource?.channels
+        },
+        {
+            key: 'adapters',
+            icon: 'settings_input_component',
+            label: t('config.sections.adapters'),
+            value: currentSource?.adapters
+        },
+        { key: 'plugins', icon: 'extension', label: t('config.sections.plugins'), value: currentSource?.plugins },
+        { key: 'mcp', icon: 'account_tree', label: t('config.sections.mcp'), value: currentSource?.mcp },
+        { key: 'shortcuts', icon: 'keyboard', label: t('config.sections.shortcuts'), value: currentSource?.shortcuts },
+        { key: 'group-app', type: 'group', label: t('config.groups.app') },
+        { key: 'appearance', icon: 'tune', label: t('config.sections.appearance') },
+        { key: 'experiments', icon: 'science', label: t('config.sections.experiments'), value: data?.meta?.experiments },
+        { key: 'about', icon: 'info', label: t('config.sections.about'), value: data?.meta?.about }
+    ], [currentSource, data?.meta?.about, data?.meta?.experiments, t]);
+    const tabKeys = useMemo(() => new Set(tabs.filter(tab => tab.type !== 'group').map(tab => tab.key)), [tabs]);
+    const activeTabKey = tabKeys.has(queryValues.tab) ? queryValues.tab : 'general';
+    const setActiveTabKey = (key) => updateQuery({ tab: key });
+    const activeTab = useMemo(() => tabs.find(tab => tab.key === activeTabKey), [tabs, activeTabKey]);
+    useEffect(() => {
+        if (activeTab == null)
+            return;
+        if (!configTabKeys.has(activeTab.key))
+            return;
+        const draftKey = `${sourceKey}:${activeTab.key}`;
+        setDrafts((prev) => {
+            const currentDraft = prev[draftKey];
+            const sourceValue = activeTab.value ?? {};
+            if (currentDraft !== undefined) {
+                if (isEmptyValue(currentDraft) && !isEmptyValue(sourceValue)) {
+                    return { ...prev, [draftKey]: cloneValue(sourceValue) };
+                }
+                return prev;
+            }
+            return { ...prev, [draftKey]: cloneValue(sourceValue) };
+        });
+    }, [activeTab, configTabKeys, sourceKey]);
+    useEffect(() => {
+        draftsRef.current = drafts;
+    }, [drafts]);
+    useEffect(() => {
+        return () => {
+            Object.values(saveTimersRef.current).forEach((timer) => {
+                clearTimeout(timer);
+            });
+        };
+    }, []);
+    const getDraftKey = (sectionKey, source = sourceKey) => `${source}:${sectionKey}`;
+    const generalDraftValue = useMemo(() => {
+        const draftKey = getDraftKey('general');
+        return (drafts[draftKey] ?? cloneValue(currentSource?.general ?? {}) ?? {});
+    }, [drafts, currentSource?.general, sourceKey]);
+    const selectedModelService = (() => {
+        const value = getValueByPath(generalDraftValue, ['defaultModelService']);
+        return typeof value === 'string' ? value : undefined;
+    })();
+    const scheduleSave = (sectionKey, source, nextValue) => {
+        const draftKey = getDraftKey(sectionKey, source);
+        const serialized = JSON.stringify(nextValue ?? {});
+        if (lastSavedRef.current[draftKey] === serialized) {
+            return;
+        }
+        if (saveTimersRef.current[draftKey]) {
+            clearTimeout(saveTimersRef.current[draftKey]);
+        }
+        saveTimersRef.current[draftKey] = setTimeout(async () => {
+            if (savingRef.current[draftKey])
+                return;
+            const currentValue = draftsRef.current[draftKey] ?? nextValue;
+            const currentSerialized = JSON.stringify(currentValue ?? {});
+            if (lastSavedRef.current[draftKey] === currentSerialized)
+                return;
+            savingRef.current[draftKey] = true;
+            try {
+                await updateConfig(source, sectionKey, currentValue);
+                lastSavedRef.current[draftKey] = currentSerialized;
+                await mutate();
+            }
+            catch (error) {
+                void message.error(getApiErrorMessage(error, t('config.saveFailed')));
+            }
+            finally {
+                savingRef.current[draftKey] = false;
+            }
+        }, 800);
+    };
+    const handleDraftChange = (sectionKey, nextValue) => {
+        const draftKey = getDraftKey(sectionKey);
+        setDrafts(prev => ({ ...prev, [draftKey]: nextValue }));
+        scheduleSave(sectionKey, sourceKey, nextValue);
+    };
+    return (_jsxs("div", { className: 'config-view', children: [isLoading && (_jsx("div", { className: 'config-view__state', children: _jsx(Spin, {}) })), !isLoading && (error != null) && (_jsx("div", { className: 'config-view__state', children: _jsx(Empty, { description: t('config.loadFailed') }) })), !isLoading && error == null && (_jsx("div", { className: 'config-view__tabs-wrap', children: _jsx(Tabs, { tabPosition: 'left', tabBarGutter: 4, indicator: { size: 0 }, className: 'config-view__tabs', activeKey: activeTabKey, onChange: (key) => {
+                        if (key !== 'group-config' && key !== 'group-app') {
+                            setActiveTabKey(key);
+                        }
+                    }, items: tabs.map((tab) => {
+                        if (tab.type === 'group') {
+                            return {
+                                key: tab.key,
+                                label: _jsx("span", { className: 'config-view__group-label', children: tab.label }),
+                                disabled: true,
+                                children: _jsx("div", {})
+                            };
+                        }
+                        return {
+                            key: tab.key,
+                            label: (_jsxs("span", { className: 'config-view__tab-label', children: [_jsx("span", { className: 'material-symbols-rounded config-view__tab-icon', children: tab.icon }), _jsx("span", { className: 'config-view__tab-text', children: tab.label })] })),
+                            children: (_jsxs("div", { className: 'config-view__content', children: [tab.key === 'about' && (_jsx(AboutSection, { value: tab.value })), tab.key === 'appearance' && (_jsx(AppSettingsPanel, { t: t })), tab.key !== 'about' && tab.key !== 'appearance' && !configTabKeys.has(tab.key) && (_jsx(DisplayValue, { value: tab.value, sectionKey: tab.key, t: t })), configTabKeys.has(tab.key) && (_jsx(ConfigSectionPanel, { sectionKey: tab.key, title: tab.label, icon: tab.icon, value: drafts[getDraftKey(tab.key)] ?? cloneValue(tab.value ?? {}) ?? {}, onChange: (next) => handleDraftChange(tab.key, next), mergedModelServices: mergedModelServices, mergedAdapters: mergedAdapters, selectedModelService: selectedModelService, t: t, headerExtra: _jsx(Space, { size: 12, children: _jsx(ConfigSourceSwitch, { value: sourceKey, onChange: setSourceKey, options: [
+                                                    {
+                                                        value: 'project',
+                                                        icon: 'folder',
+                                                        label: configPresent?.project === true
+                                                            ? t('config.sources.project')
+                                                            : t('config.sources.projectMissing')
+                                                    },
+                                                    {
+                                                        value: 'user',
+                                                        icon: 'person',
+                                                        label: configPresent?.user === true
+                                                            ? t('config.sources.user')
+                                                            : t('config.sources.userMissing')
+                                                    }
+                                                ] }) }) }))] }))
+                        };
+                    }) }) }))] }));
+}

package/dist/apps/client/src/components/MarkdownContent.d.ts

@@ -0,0 +1,3 @@
+export declare function MarkdownContent({ content }: {
+    content: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/apps/client/src/components/MarkdownContent.js

@@ -0,0 +1,20 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { CodeBlock } from '#~/components/CodeBlock';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+export function MarkdownContent({ content }) {
+    return (_jsx("div", { className: 'markdown-body', children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], components: {
+                pre({ children }) {
+                    return _jsx(_Fragment, { children: children });
+                },
+                code({ inline, className, children, ...props }) {
+                    const langClass = typeof className === 'string' ? className : '';
+                    const match = /language-(\w+)/.exec(langClass);
+                    const isInline = inline === true;
+                    const codeContent = String(children).replace(/\n$/, '');
+                    return !isInline && match != null
+                        ? (_jsx(CodeBlock, { code: codeContent, lang: match[1] }))
+                        : (_jsx("code", { className: langClass, ...props, children: children }));
+                }
+            }, children: content }) }));
+}

package/dist/apps/client/src/components/NavRail.d.ts

@@ -0,0 +1,5 @@
+import './NavRail.scss';
+export declare function NavRail({ collapsed, onToggleCollapse }: {
+    collapsed?: boolean;
+    onToggleCollapse?: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/apps/client/src/components/NavRail.js

@@ -0,0 +1,114 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './NavRail.scss';
+import { Button, Dropdown, Tooltip } from 'antd';
+import { useAtom } from 'jotai';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { useLocation, useNavigate } from 'react-router-dom';
+import { themeAtom } from '../store';
+export function NavRail({ collapsed, onToggleCollapse }) {
+    const { t, i18n } = useTranslation();
+    const [themeMode, setThemeMode] = useAtom(themeAtom);
+    const navigate = useNavigate();
+    const location = useLocation();
+    const currentPath = location.pathname;
+    const langItems = React.useMemo(() => [
+        {
+            key: 'zh',
+            label: '简体中文',
+            icon: i18n.language.startsWith('zh')
+                ? (_jsx("span", { className: 'material-symbols-rounded nav-menu-icon active', children: "check" }))
+                : _jsx("div", { className: 'nav-menu-icon-placeholder' }),
+            onClick: () => {
+                void i18n.changeLanguage('zh');
+            }
+        },
+        {
+            key: 'en',
+            label: 'English',
+            icon: i18n.language.startsWith('en')
+                ? (_jsx("span", { className: 'material-symbols-rounded nav-menu-icon active', children: "check" }))
+                : _jsx("div", { className: 'nav-menu-icon-placeholder' }),
+            onClick: () => {
+                void i18n.changeLanguage('en');
+            }
+        }
+    ], [i18n.language]);
+    const themeItems = React.useMemo(() => [
+        {
+            key: 'light',
+            label: t('common.themeLight'),
+            icon: themeMode === 'light'
+                ? _jsx("span", { className: 'material-symbols-rounded nav-menu-icon active', children: "check" })
+                : _jsx("span", { className: 'material-symbols-rounded nav-menu-icon', children: "light_mode" }),
+            onClick: () => {
+                setThemeMode('light');
+                localStorage.setItem('theme', 'light');
+            }
+        },
+        {
+            key: 'dark',
+            label: t('common.themeDark'),
+            icon: themeMode === 'dark'
+                ? _jsx("span", { className: 'material-symbols-rounded nav-menu-icon active', children: "check" })
+                : _jsx("span", { className: 'material-symbols-rounded nav-menu-icon', children: "dark_mode" }),
+            onClick: () => {
+                setThemeMode('dark');
+                localStorage.setItem('theme', 'dark');
+            }
+        },
+        {
+            key: 'system',
+            label: t('common.themeSystem'),
+            icon: themeMode === 'system'
+                ? _jsx("span", { className: 'material-symbols-rounded nav-menu-icon active', children: "check" })
+                : _jsx("span", { className: 'material-symbols-rounded nav-menu-icon', children: "desktop_windows" }),
+            onClick: () => {
+                setThemeMode('system');
+                localStorage.setItem('theme', 'system');
+            }
+        }
+    ], [themeMode, t, setThemeMode]);
+    const navItems = React.useMemo(() => [
+        {
+            key: 'sessions',
+            icon: 'chat_bubble',
+            label: t('common.sessions'),
+            path: '/',
+            active: currentPath === '/' || currentPath.startsWith('/session/')
+        },
+        {
+            key: 'knowledge',
+            icon: 'library_books',
+            label: t('common.knowledgeBase'),
+            path: '/knowledge',
+            active: currentPath === '/knowledge'
+        },
+        {
+            key: 'automation',
+            icon: 'schedule',
+            label: t('common.automation'),
+            path: '/automation',
+            active: currentPath === '/automation'
+        },
+        {
+            key: 'benchmark',
+            icon: 'speed',
+            label: t('common.benchmark'),
+            path: '/benchmark',
+            active: currentPath === '/benchmark'
+        },
+        {
+            key: 'archive',
+            icon: 'archive',
+            label: t('common.archivedSessions'),
+            path: '/archive',
+            active: currentPath === '/archive'
+        }
+    ], [currentPath, t]);
+    return (_jsxs("div", { className: 'nav-rail', children: [_jsx("div", { className: 'nav-rail-top', children: navItems.map(item => (_jsx(Tooltip, { title: item.label, placement: 'right', children: _jsx("span", { children: _jsx(Button, { type: 'text', className: `nav-item ${item.active ? 'active' : ''}`, onClick: () => void navigate(item.path), icon: _jsx("span", { className: 'material-symbols-rounded', children: item.icon }) }) }) }, item.key))) }), _jsxs("div", { className: 'nav-rail-bottom', children: [_jsx(Tooltip, { title: t('common.theme'), placement: 'right', children: _jsx("span", { children: _jsx(Dropdown, { menu: {
+                                    items: themeItems
+                                }, placement: 'topRight', trigger: ['click'], children: _jsx(Button, { type: 'text', className: 'nav-item', icon: _jsx("span", { className: 'material-symbols-rounded', children: themeMode === 'light' ? 'light_mode' : themeMode === 'dark' ? 'dark_mode' : 'desktop_windows' }) }) }) }) }), _jsx(Tooltip, { title: t('common.language'), placement: 'right', children: _jsx("span", { children: _jsx(Dropdown, { menu: {
+                                    items: langItems
+                                }, placement: 'topRight', trigger: ['click'], children: _jsx(Button, { type: 'text', className: 'nav-item', icon: _jsx("span", { className: 'material-symbols-rounded', children: "language" }) }) }) }) }), _jsx(Tooltip, { title: t('common.settings'), placement: 'right', children: _jsx("span", { children: _jsx(Button, { type: 'text', className: `nav-item ${currentPath === '/config' ? 'active' : ''}`, icon: _jsx("span", { className: 'material-symbols-rounded', children: "settings" }), onClick: () => void navigate('/config') }) }) })] })] }));
+}

package/dist/apps/client/src/components/Sidebar.d.ts

@@ -0,0 +1,8 @@
+import './Sidebar.scss';
+import type { Session } from '@vibe-forge/core';
+export declare function Sidebar({ activeId, onSelectSession, onDeletedSession, width }: {
+    activeId?: string;
+    onSelectSession: (session: Session, isNew?: boolean) => void;
+    onDeletedSession?: (id: string, nextId?: string) => void;
+    width: number;
+}): import("react/jsx-runtime").JSX.Element;