@vibe-forge/client 0.2.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (184) hide show
  1. package/LICENSE +21 -0
  2. package/cli.cjs +6 -0
  3. package/index.html +27 -0
  4. package/package.json +42 -0
  5. package/src/App.tsx +174 -0
  6. package/src/api.ts +241 -0
  7. package/src/components/ArchiveView.scss +168 -0
  8. package/src/components/ArchiveView.tsx +299 -0
  9. package/src/components/AutomationView/AutomationView.scss +26 -0
  10. package/src/components/AutomationView/RuleFormPanel.scss +129 -0
  11. package/src/components/AutomationView/RuleFormPanel.tsx +257 -0
  12. package/src/components/AutomationView/RuleSidebar.scss +219 -0
  13. package/src/components/AutomationView/RuleSidebar.tsx +258 -0
  14. package/src/components/AutomationView/RunHistoryPanel.scss +286 -0
  15. package/src/components/AutomationView/RunHistoryPanel.tsx +320 -0
  16. package/src/components/AutomationView/TaskList.scss +128 -0
  17. package/src/components/AutomationView/TaskList.tsx +79 -0
  18. package/src/components/AutomationView/TriggerList.scss +153 -0
  19. package/src/components/AutomationView/TriggerList.tsx +217 -0
  20. package/src/components/AutomationView/index.tsx +228 -0
  21. package/src/components/AutomationView/types.ts +21 -0
  22. package/src/components/Chat.scss +89 -0
  23. package/src/components/Chat.tsx +92 -0
  24. package/src/components/ConfigView.scss +185 -0
  25. package/src/components/ConfigView.tsx +258 -0
  26. package/src/components/NavRail.scss +71 -0
  27. package/src/components/NavRail.tsx +188 -0
  28. package/src/components/Sidebar.scss +112 -0
  29. package/src/components/Sidebar.tsx +291 -0
  30. package/src/components/chat/ChatHeader.scss +401 -0
  31. package/src/components/chat/ChatHeader.tsx +342 -0
  32. package/src/components/chat/ChatHistoryView.tsx +122 -0
  33. package/src/components/chat/ChatSettingsView.tsx +22 -0
  34. package/src/components/chat/ChatTimelineView.scss +53 -0
  35. package/src/components/chat/ChatTimelineView.tsx +158 -0
  36. package/src/components/chat/CodeBlock.scss +87 -0
  37. package/src/components/chat/CodeBlock.tsx +179 -0
  38. package/src/components/chat/CompletionMenu.scss +70 -0
  39. package/src/components/chat/CompletionMenu.tsx +58 -0
  40. package/src/components/chat/CurrentTodoList.scss +217 -0
  41. package/src/components/chat/CurrentTodoList.tsx +103 -0
  42. package/src/components/chat/MarkdownContent.tsx +43 -0
  43. package/src/components/chat/MessageFooter.tsx +48 -0
  44. package/src/components/chat/MessageItem.scss +251 -0
  45. package/src/components/chat/MessageItem.tsx +78 -0
  46. package/src/components/chat/NewSessionGuide.scss +186 -0
  47. package/src/components/chat/NewSessionGuide.tsx +167 -0
  48. package/src/components/chat/Sender.scss +367 -0
  49. package/src/components/chat/Sender.tsx +541 -0
  50. package/src/components/chat/SessionTimelinePanel/EventList.scss +58 -0
  51. package/src/components/chat/SessionTimelinePanel/EventList.tsx +212 -0
  52. package/src/components/chat/SessionTimelinePanel/gantt.ts +177 -0
  53. package/src/components/chat/SessionTimelinePanel/git-graph.ts +518 -0
  54. package/src/components/chat/SessionTimelinePanel/index.scss +28 -0
  55. package/src/components/chat/SessionTimelinePanel/index.tsx +121 -0
  56. package/src/components/chat/SessionTimelinePanel/mermaid.ts +4 -0
  57. package/src/components/chat/SessionTimelinePanel/types.ts +64 -0
  58. package/src/components/chat/SessionTimelinePanel/utils.ts +20 -0
  59. package/src/components/chat/ThinkingStatus.scss +70 -0
  60. package/src/components/chat/ThinkingStatus.tsx +13 -0
  61. package/src/components/chat/ToolCallBox.scss +137 -0
  62. package/src/components/chat/ToolCallBox.tsx +55 -0
  63. package/src/components/chat/ToolGroup.scss +154 -0
  64. package/src/components/chat/ToolGroup.tsx +102 -0
  65. package/src/components/chat/ToolRenderer.tsx +45 -0
  66. package/src/components/chat/messageUtils.ts +171 -0
  67. package/src/components/chat/safeSerialize.ts +84 -0
  68. package/src/components/chat/tools/DefaultTool.tsx +63 -0
  69. package/src/components/chat/tools/adapter-claude/BashTool.scss +71 -0
  70. package/src/components/chat/tools/adapter-claude/BashTool.tsx +82 -0
  71. package/src/components/chat/tools/adapter-claude/GlobTool.scss +88 -0
  72. package/src/components/chat/tools/adapter-claude/GlobTool.tsx +85 -0
  73. package/src/components/chat/tools/adapter-claude/GrepTool.scss +96 -0
  74. package/src/components/chat/tools/adapter-claude/GrepTool.tsx +114 -0
  75. package/src/components/chat/tools/adapter-claude/LSTool.scss +85 -0
  76. package/src/components/chat/tools/adapter-claude/LSTool.tsx +94 -0
  77. package/src/components/chat/tools/adapter-claude/ReadTool.scss +57 -0
  78. package/src/components/chat/tools/adapter-claude/ReadTool.tsx +87 -0
  79. package/src/components/chat/tools/adapter-claude/TodoTool.scss +78 -0
  80. package/src/components/chat/tools/adapter-claude/TodoTool.tsx +60 -0
  81. package/src/components/chat/tools/adapter-claude/WriteTool.scss +92 -0
  82. package/src/components/chat/tools/adapter-claude/WriteTool.tsx +86 -0
  83. package/src/components/chat/tools/adapter-claude/components/FileList.scss +65 -0
  84. package/src/components/chat/tools/adapter-claude/components/FileList.tsx +185 -0
  85. package/src/components/chat/tools/adapter-claude/index.ts +28 -0
  86. package/src/components/chat/tools/defineToolRender.ts +28 -0
  87. package/src/components/chat/tools/task/GetTaskInfoTool.scss +50 -0
  88. package/src/components/chat/tools/task/GetTaskInfoTool.tsx +88 -0
  89. package/src/components/chat/tools/task/ListTasksTool.scss +56 -0
  90. package/src/components/chat/tools/task/ListTasksTool.tsx +83 -0
  91. package/src/components/chat/tools/task/StartTasksTool.scss +56 -0
  92. package/src/components/chat/tools/task/StartTasksTool.tsx +96 -0
  93. package/src/components/chat/tools/task/components/TaskToolCard.scss +127 -0
  94. package/src/components/chat/tools/task/components/TaskToolCard.tsx +177 -0
  95. package/src/components/chat/tools/task/index.ts +15 -0
  96. package/src/components/chat/useChatModels.tsx +206 -0
  97. package/src/components/chat/useChatSession.ts +370 -0
  98. package/src/components/config/ConfigAboutSection.scss +111 -0
  99. package/src/components/config/ConfigAboutSection.tsx +86 -0
  100. package/src/components/config/ConfigDisplayValue.scss +22 -0
  101. package/src/components/config/ConfigDisplayValue.tsx +62 -0
  102. package/src/components/config/ConfigEditors.scss +65 -0
  103. package/src/components/config/ConfigEditors.tsx +98 -0
  104. package/src/components/config/ConfigFieldRow.scss +97 -0
  105. package/src/components/config/ConfigFieldRow.tsx +36 -0
  106. package/src/components/config/ConfigSectionForm.scss +94 -0
  107. package/src/components/config/ConfigSectionForm.tsx +436 -0
  108. package/src/components/config/ConfigSectionPanel.tsx +67 -0
  109. package/src/components/config/ConfigShortcutInput.scss +11 -0
  110. package/src/components/config/ConfigShortcutInput.tsx +52 -0
  111. package/src/components/config/ConfigSourceSwitch.tsx +57 -0
  112. package/src/components/config/configSchema.ts +319 -0
  113. package/src/components/config/configUtils.ts +83 -0
  114. package/src/components/config/index.tsx +5 -0
  115. package/src/components/config/recordEditors/BooleanRecordEditor.scss +1 -0
  116. package/src/components/config/recordEditors/BooleanRecordEditor.tsx +75 -0
  117. package/src/components/config/recordEditors/KeyValueEditor.scss +1 -0
  118. package/src/components/config/recordEditors/KeyValueEditor.tsx +97 -0
  119. package/src/components/config/recordEditors/McpServersRecordEditor.scss +1 -0
  120. package/src/components/config/recordEditors/McpServersRecordEditor.tsx +258 -0
  121. package/src/components/config/recordEditors/ModelServicesRecordEditor.scss +1 -0
  122. package/src/components/config/recordEditors/ModelServicesRecordEditor.tsx +233 -0
  123. package/src/components/config/recordEditors/RecordEditors.scss +117 -0
  124. package/src/components/config/recordEditors/RecordJsonEditor.scss +1 -0
  125. package/src/components/config/recordEditors/RecordJsonEditor.tsx +113 -0
  126. package/src/components/config/recordEditors/index.tsx +5 -0
  127. package/src/components/knowledge-base/KnowledgeBaseView.scss +19 -0
  128. package/src/components/knowledge-base/KnowledgeBaseView.tsx +186 -0
  129. package/src/components/knowledge-base/components/ActionButton.scss +5 -0
  130. package/src/components/knowledge-base/components/ActionButton.tsx +9 -0
  131. package/src/components/knowledge-base/components/EmptyState.scss +19 -0
  132. package/src/components/knowledge-base/components/EmptyState.tsx +42 -0
  133. package/src/components/knowledge-base/components/EntitiesTab.scss +5 -0
  134. package/src/components/knowledge-base/components/EntitiesTab.tsx +80 -0
  135. package/src/components/knowledge-base/components/EntityItem.scss +82 -0
  136. package/src/components/knowledge-base/components/EntityItem.tsx +79 -0
  137. package/src/components/knowledge-base/components/EntityList.scss +5 -0
  138. package/src/components/knowledge-base/components/EntityList.tsx +70 -0
  139. package/src/components/knowledge-base/components/FilterBar.scss +21 -0
  140. package/src/components/knowledge-base/components/FilterBar.tsx +51 -0
  141. package/src/components/knowledge-base/components/FlowsTab.scss +5 -0
  142. package/src/components/knowledge-base/components/FlowsTab.tsx +80 -0
  143. package/src/components/knowledge-base/components/KnowledgeBaseHeader.scss +27 -0
  144. package/src/components/knowledge-base/components/KnowledgeBaseHeader.tsx +29 -0
  145. package/src/components/knowledge-base/components/KnowledgeList.scss +19 -0
  146. package/src/components/knowledge-base/components/KnowledgeList.tsx +19 -0
  147. package/src/components/knowledge-base/components/LoadingState.scss +5 -0
  148. package/src/components/knowledge-base/components/LoadingState.tsx +11 -0
  149. package/src/components/knowledge-base/components/MetaList.scss +19 -0
  150. package/src/components/knowledge-base/components/MetaList.tsx +18 -0
  151. package/src/components/knowledge-base/components/RulesTab.scss +5 -0
  152. package/src/components/knowledge-base/components/RulesTab.tsx +49 -0
  153. package/src/components/knowledge-base/components/SectionHeader.scss +22 -0
  154. package/src/components/knowledge-base/components/SectionHeader.tsx +21 -0
  155. package/src/components/knowledge-base/components/SkillsTab.scss +5 -0
  156. package/src/components/knowledge-base/components/SkillsTab.tsx +49 -0
  157. package/src/components/knowledge-base/components/SpecItem.scss +138 -0
  158. package/src/components/knowledge-base/components/SpecItem.tsx +131 -0
  159. package/src/components/knowledge-base/components/SpecList.scss +5 -0
  160. package/src/components/knowledge-base/components/SpecList.tsx +70 -0
  161. package/src/components/knowledge-base/components/TabContent.scss +8 -0
  162. package/src/components/knowledge-base/components/TabContent.tsx +17 -0
  163. package/src/components/knowledge-base/components/TabLabel.scss +10 -0
  164. package/src/components/knowledge-base/components/TabLabel.tsx +15 -0
  165. package/src/components/knowledge-base/index.tsx +1 -0
  166. package/src/components/sidebar/SessionItem.scss +256 -0
  167. package/src/components/sidebar/SessionItem.tsx +265 -0
  168. package/src/components/sidebar/SessionList.scss +92 -0
  169. package/src/components/sidebar/SessionList.tsx +166 -0
  170. package/src/components/sidebar/SidebarHeader.scss +79 -0
  171. package/src/components/sidebar/SidebarHeader.tsx +128 -0
  172. package/src/connectionManager.ts +172 -0
  173. package/src/hooks/useGlobalShortcut.ts +26 -0
  174. package/src/hooks/useQueryParams.ts +54 -0
  175. package/src/i18n.ts +22 -0
  176. package/src/main.tsx +41 -0
  177. package/src/resources/locales/en.json +765 -0
  178. package/src/resources/locales/zh.json +766 -0
  179. package/src/store/index.ts +23 -0
  180. package/src/styles/global.scss +100 -0
  181. package/src/utils/shortcutUtils.ts +88 -0
  182. package/src/vite-env.d.ts +12 -0
  183. package/src/ws.ts +33 -0
  184. package/vite.config.ts +26 -0
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2025-present Vibe-Forge.ai
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/cli.cjs ADDED
@@ -0,0 +1,6 @@
1
+ const { resolve } = require("node:path");
2
+
3
+ require("node:child_process").spawnSync("vite", [], {
4
+ cwd: resolve(__dirname, "./"),
5
+ stdio: "inherit",
6
+ });
package/index.html ADDED
@@ -0,0 +1,27 @@
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Vibe Forge Web</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
+ <link
10
+ href="https://fonts.googleapis.com/icon?family=Material+Icons+Rounded"
11
+ rel="stylesheet"
12
+ >
13
+ <link
14
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200"
15
+ rel="stylesheet"
16
+ >
17
+ <link
18
+ rel="stylesheet"
19
+ type="text/css"
20
+ href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css"
21
+ />
22
+ </head>
23
+ <body>
24
+ <div id="root"></div>
25
+ <script type="module" src="/src/main.tsx"></script>
26
+ </body>
27
+ </html>
package/package.json ADDED
@@ -0,0 +1,42 @@
1
+ {
2
+ "name": "@vibe-forge/client",
3
+ "type": "module",
4
+ "version": "0.2.0-alpha.0",
5
+ "imports": {
6
+ "#~/*": [
7
+ "./src/*",
8
+ "./src/*.tsx"
9
+ ]
10
+ },
11
+ "bin": {
12
+ "vibe-forge-ui-client": "./cli.cjs",
13
+ "vfui-client": "./cli.cjs"
14
+ },
15
+ "dependencies": {
16
+ "@ant-design/icons": "^5.3.7",
17
+ "@vitejs/plugin-react": "^5.1.2",
18
+ "antd": "^5.20.0",
19
+ "dayjs": "^1.11.19",
20
+ "i18next": "^25.7.4",
21
+ "i18next-browser-languagedetector": "^8.2.0",
22
+ "jotai": "^2.16.2",
23
+ "mermaid": "^10.9.1",
24
+ "react": "^18.3.1",
25
+ "react-dom": "^18.3.1",
26
+ "react-i18next": "^16.5.3",
27
+ "react-markdown": "^10.1.0",
28
+ "react-router-dom": "^7.12.0",
29
+ "remark-gfm": "^4.0.1",
30
+ "sass": "^1.97.2",
31
+ "shiki": "^3.21.0",
32
+ "swr": "^2.2.5",
33
+ "typescript": "^5.6.3",
34
+ "vite": "^5.4.8",
35
+ "vitest": "^3.2.4",
36
+ "@vibe-forge/core": "0.2.0-alpha.0"
37
+ },
38
+ "devDependencies": {
39
+ "@types/react": "^18.3.12",
40
+ "@types/react-dom": "^18.3.2"
41
+ }
42
+ }
package/src/App.tsx ADDED
@@ -0,0 +1,174 @@
1
+ import { Button, ConfigProvider, Empty, Layout, theme } from 'antd'
2
+ import { useAtom, useAtomValue, useSetAtom } from 'jotai'
3
+ import React, { useCallback, useEffect } from 'react'
4
+ import { useTranslation } from 'react-i18next'
5
+ import { Route, Routes, useLocation, useNavigate, useParams } from 'react-router-dom'
6
+ import useSWR from 'swr'
7
+
8
+ import { ArchiveView } from '#~/components/ArchiveView'
9
+ import { AutomationView } from '#~/components/AutomationView'
10
+ import { Chat } from '#~/components/Chat'
11
+ import { ConfigView } from '#~/components/ConfigView'
12
+ import { KnowledgeBaseView } from '#~/components/knowledge-base'
13
+ import { NavRail } from '#~/components/NavRail'
14
+ import { Sidebar } from '#~/components/Sidebar'
15
+ import type { ConfigResponse, Session } from '@vibe-forge/core'
16
+ import { getConfig } from './api'
17
+ import { isSidebarResizingAtom, sidebarWidthAtom, themeAtom } from './store/index'
18
+
19
+ const MIN_SIDEBAR_WIDTH = 200
20
+ const MAX_SIDEBAR_WIDTH = 600
21
+
22
+ function ChatView() {
23
+ const { t } = useTranslation()
24
+ const { sessionId } = useParams()
25
+ const navigate = useNavigate()
26
+ const { data: sessionsRes } = useSWR<{ sessions: Session[] }>('/api/sessions')
27
+ const sessions = sessionsRes?.sessions ?? []
28
+ const session = sessions.find(s => s.id === sessionId)
29
+
30
+ if (session == null) {
31
+ return (
32
+ <div style={{ height: '100%', display: 'grid', placeItems: 'center', alignContent: 'center', gap: '16px' }}>
33
+ <Empty description={t('common.sessionNotFound')} />
34
+ <Button type='primary' onClick={() => navigate('/')}>{t('common.backToHome')}</Button>
35
+ </div>
36
+ )
37
+ }
38
+
39
+ return <Chat session={session} />
40
+ }
41
+
42
+ export default function App() {
43
+ const { t, i18n } = useTranslation()
44
+ const navigate = useNavigate()
45
+ const location = useLocation()
46
+ const [themeMode] = useAtom(themeAtom)
47
+
48
+ const { data: sessionsRes } = useSWR<{ sessions: Session[] }>('/api/sessions')
49
+ const { data: configRes } = useSWR<ConfigResponse>('/api/config', getConfig)
50
+ const interfaceLanguage = configRes?.sources?.merged?.general?.interfaceLanguage
51
+
52
+ const [sidebarWidth, setSidebarWidth] = useAtom(sidebarWidthAtom)
53
+ const isResizing = useAtomValue(isSidebarResizingAtom)
54
+ const setIsResizing = useSetAtom(isSidebarResizingAtom)
55
+
56
+ const currentPath = location.pathname
57
+ const activeId = currentPath === '/' ? undefined : currentPath.split('/session/')[1]
58
+
59
+ const handleMouseDown = useCallback((e: React.MouseEvent) => {
60
+ setIsResizing(true)
61
+ e.preventDefault()
62
+ }, [])
63
+
64
+ const handleMouseMove = useCallback((e: MouseEvent) => {
65
+ if (!isResizing) return
66
+
67
+ // 获取相对于容器左边缘的坐标
68
+ // 容器由 NavRail (56px) + Sidebar 组成
69
+ let newWidth = e.clientX - 56
70
+ if (newWidth < MIN_SIDEBAR_WIDTH) newWidth = MIN_SIDEBAR_WIDTH
71
+ if (newWidth > MAX_SIDEBAR_WIDTH) newWidth = MAX_SIDEBAR_WIDTH
72
+
73
+ setSidebarWidth(newWidth)
74
+ }, [isResizing, setSidebarWidth])
75
+
76
+ const handleMouseUp = useCallback(() => {
77
+ setIsResizing(false)
78
+ localStorage.setItem('sidebarWidth', sidebarWidth.toString())
79
+ }, [sidebarWidth])
80
+
81
+ useEffect(() => {
82
+ if (isResizing) {
83
+ window.addEventListener('mousemove', handleMouseMove)
84
+ window.addEventListener('mouseup', handleMouseUp)
85
+ document.body.style.cursor = 'col-resize'
86
+ } else {
87
+ window.removeEventListener('mousemove', handleMouseMove)
88
+ window.removeEventListener('mouseup', handleMouseUp)
89
+ document.body.style.cursor = ''
90
+ }
91
+ return () => {
92
+ window.removeEventListener('mousemove', handleMouseMove)
93
+ window.removeEventListener('mouseup', handleMouseUp)
94
+ }
95
+ }, [isResizing, handleMouseMove, handleMouseUp])
96
+
97
+ const isDarkMode = themeMode === 'dark' ||
98
+ (themeMode === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)
99
+
100
+ const showSidebar = currentPath === '/' || currentPath.startsWith('/session/')
101
+
102
+ const handleDeletedSession = useCallback((deletedId: string, nextId?: string) => {
103
+ // 如果删除的不是当前激活的会话，不需要跳转
104
+ if (activeId !== deletedId) return
105
+
106
+ if (nextId) {
107
+ void navigate(`/session/${nextId}`)
108
+ } else {
109
+ void navigate('/')
110
+ }
111
+ }, [activeId, navigate])
112
+
113
+ useEffect(() => {
114
+ if (isDarkMode) {
115
+ document.documentElement.classList.add('dark')
116
+ } else {
117
+ document.documentElement.classList.remove('dark')
118
+ }
119
+ }, [isDarkMode])
120
+
121
+ useEffect(() => {
122
+ if (interfaceLanguage && i18n.language !== interfaceLanguage) {
123
+ void i18n.changeLanguage(interfaceLanguage)
124
+ }
125
+ }, [i18n, interfaceLanguage])
126
+
127
+ return (
128
+ <ConfigProvider
129
+ theme={{
130
+ algorithm: isDarkMode ? theme.darkAlgorithm : theme.defaultAlgorithm,
131
+ token: {
132
+ colorPrimary: isDarkMode ? '#3b82f6' : '#000000'
133
+ }
134
+ }}
135
+ >
136
+ <Layout style={{ height: '100vh', display: 'flex', flexDirection: 'row', overflow: 'hidden' }}>
137
+ <NavRail />
138
+ {showSidebar && (
139
+ <>
140
+ <Sidebar
141
+ width={sidebarWidth}
142
+ activeId={activeId}
143
+ onSelectSession={(session: Session, isNew?: boolean) => {
144
+ if (session.id === '') {
145
+ void navigate('/')
146
+ } else {
147
+ void navigate(`/session/${session.id}`)
148
+ }
149
+ }}
150
+ onDeletedSession={handleDeletedSession}
151
+ />
152
+ </>
153
+ )}
154
+ <Layout.Content
155
+ style={{
156
+ flex: 1,
157
+ position: 'relative',
158
+ overflow: 'hidden',
159
+ backgroundColor: isDarkMode ? '#141414' : '#fff'
160
+ }}
161
+ >
162
+ <Routes>
163
+ <Route path='/' element={<Chat />} />
164
+ <Route path='/session/:sessionId' element={<ChatView />} />
165
+ <Route path='/archive' element={<ArchiveView />} />
166
+ <Route path='/automation' element={<AutomationView />} />
167
+ <Route path='/knowledge' element={<KnowledgeBaseView />} />
168
+ <Route path='/config' element={<ConfigView />} />
169
+ </Routes>
170
+ </Layout.Content>
171
+ </Layout>
172
+ </ConfigProvider>
173
+ )
174
+ }
package/src/api.ts ADDED
@@ -0,0 +1,241 @@
1
+ import type { ConfigResponse, ConfigSource, Session } from '@vibe-forge/core'
2
+
3
+ export interface SpecSummary {
4
+ id: string
5
+ name: string
6
+ description: string
7
+ params: { name: string; description?: string }[]
8
+ always: boolean
9
+ tags: string[]
10
+ skills: string[]
11
+ rules: string[]
12
+ }
13
+
14
+ export interface EntitySummary {
15
+ id: string
16
+ name: string
17
+ description: string
18
+ always: boolean
19
+ tags: string[]
20
+ skills: string[]
21
+ rules: string[]
22
+ }
23
+
24
+ export interface SpecDetail extends SpecSummary {
25
+ body: string
26
+ }
27
+
28
+ export interface EntityDetail extends EntitySummary {
29
+ body: string
30
+ }
31
+
32
+ export interface AutomationTrigger {
33
+ id: string
34
+ type: 'interval' | 'webhook' | 'cron'
35
+ intervalMs?: number | null
36
+ cronExpression?: string | null
37
+ webhookKey?: string | null
38
+ }
39
+
40
+ export interface AutomationTask {
41
+ id: string
42
+ title: string
43
+ prompt: string
44
+ }
45
+
46
+ export interface AutomationRule {
47
+ id: string
48
+ name: string
49
+ description?: string | null
50
+ type: 'interval' | 'webhook' | 'cron'
51
+ intervalMs?: number | null
52
+ webhookKey?: string | null
53
+ cronExpression?: string | null
54
+ prompt: string
55
+ enabled: boolean
56
+ createdAt: number
57
+ lastRunAt?: number | null
58
+ lastSessionId?: string | null
59
+ triggers?: AutomationTrigger[]
60
+ tasks?: AutomationTask[]
61
+ }
62
+
63
+ export interface AutomationRun {
64
+ id: string
65
+ ruleId: string
66
+ sessionId: string
67
+ runAt: number
68
+ taskId?: string | null
69
+ taskTitle?: string | null
70
+ status?: string
71
+ title?: string
72
+ lastMessage?: string
73
+ lastUserMessage?: string
74
+ }
75
+
76
+ const SERVER_HOST = (import.meta.env.__VF_PROJECT_AI_SERVER_HOST__ as string | undefined) ?? window.location.hostname
77
+ const SERVER_PORT = (import.meta.env.__VF_PROJECT_AI_SERVER_PORT__ as string | undefined) ?? '8787'
78
+ const SERVER_URL = `http://${SERVER_HOST}:${SERVER_PORT}`
79
+
80
+ export async function listProjects(): Promise<any> {
81
+ const res = await fetch(`${SERVER_URL}/api/projects`)
82
+ return res.json()
83
+ }
84
+
85
+ export async function createProject(name?: string): Promise<any> {
86
+ const res = await fetch(`${SERVER_URL}/api/projects`, {
87
+ method: 'POST',
88
+ headers: { 'Content-Type': 'application/json' },
89
+ body: JSON.stringify({ name })
90
+ })
91
+ return res.json()
92
+ }
93
+
94
+ export async function listSessions(filter: 'active' | 'archived' | 'all' = 'active'): Promise<{ sessions: Session[] }> {
95
+ const res = await fetch(`${SERVER_URL}/api/sessions${filter === 'archived' ? '/archived' : ''}`)
96
+ return res.json() as Promise<{ sessions: Session[] }>
97
+ }
98
+
99
+ export async function createSession(title?: string, initialMessage?: string): Promise<{ session: Session }> {
100
+ const res = await fetch(`${SERVER_URL}/api/sessions`, {
101
+ method: 'POST',
102
+ headers: { 'Content-Type': 'application/json' },
103
+ body: JSON.stringify({ title, initialMessage })
104
+ })
105
+ return res.json() as Promise<{ session: Session }>
106
+ }
107
+
108
+ export async function listSpecs(): Promise<{ specs: SpecSummary[] }> {
109
+ const res = await fetch(`${SERVER_URL}/api/ai/specs`)
110
+ return res.json() as Promise<{ specs: SpecSummary[] }>
111
+ }
112
+
113
+ export async function listEntities(): Promise<{ entities: EntitySummary[] }> {
114
+ const res = await fetch(`${SERVER_URL}/api/ai/entities`)
115
+ return res.json() as Promise<{ entities: EntitySummary[] }>
116
+ }
117
+
118
+ export async function getSpecDetail(path: string): Promise<{ spec: SpecDetail }> {
119
+ const url = new URL(`${SERVER_URL}/api/ai/specs/detail`)
120
+ url.searchParams.set('path', path)
121
+ const res = await fetch(url.toString())
122
+ return res.json() as Promise<{ spec: SpecDetail }>
123
+ }
124
+
125
+ export async function getEntityDetail(path: string): Promise<{ entity: EntityDetail }> {
126
+ const url = new URL(`${SERVER_URL}/api/ai/entities/detail`)
127
+ url.searchParams.set('path', path)
128
+ const res = await fetch(url.toString())
129
+ return res.json() as Promise<{ entity: EntityDetail }>
130
+ }
131
+
132
+ export async function getConfig(): Promise<ConfigResponse> {
133
+ const res = await fetch(`${SERVER_URL}/api/config`)
134
+ return res.json() as Promise<ConfigResponse>
135
+ }
136
+
137
+ export async function listAutomationRules(): Promise<{ rules: AutomationRule[] }> {
138
+ const res = await fetch(`${SERVER_URL}/api/automation/rules`)
139
+ return res.json() as Promise<{ rules: AutomationRule[] }>
140
+ }
141
+
142
+ export async function createAutomationRule(rule: Partial<AutomationRule> & { immediateRun?: boolean }): Promise<{ rule: AutomationRule }> {
143
+ const res = await fetch(`${SERVER_URL}/api/automation/rules`, {
144
+ method: 'POST',
145
+ headers: { 'Content-Type': 'application/json' },
146
+ body: JSON.stringify(rule)
147
+ })
148
+ return res.json() as Promise<{ rule: AutomationRule }>
149
+ }
150
+
151
+ export async function updateAutomationRule(
152
+ id: string,
153
+ rule: Partial<AutomationRule> & { immediateRun?: boolean }
154
+ ): Promise<{ rule: AutomationRule }> {
155
+ const res = await fetch(`${SERVER_URL}/api/automation/rules/${id}`, {
156
+ method: 'PATCH',
157
+ headers: { 'Content-Type': 'application/json' },
158
+ body: JSON.stringify(rule)
159
+ })
160
+ return res.json() as Promise<{ rule: AutomationRule }>
161
+ }
162
+
163
+ export async function deleteAutomationRule(id: string): Promise<{ ok: boolean; removed: boolean }> {
164
+ const res = await fetch(`${SERVER_URL}/api/automation/rules/${id}`, {
165
+ method: 'DELETE'
166
+ })
167
+ return res.json() as Promise<{ ok: boolean; removed: boolean }>
168
+ }
169
+
170
+ export async function runAutomationRule(id: string): Promise<{ ok: boolean; sessionIds: string[] }> {
171
+ const res = await fetch(`${SERVER_URL}/api/automation/rules/${id}/run`, {
172
+ method: 'POST'
173
+ })
174
+ return res.json() as Promise<{ ok: boolean; sessionIds: string[] }>
175
+ }
176
+
177
+ export async function listAutomationRuns(id: string, limit = 50): Promise<{ runs: AutomationRun[] }> {
178
+ const url = new URL(`${SERVER_URL}/api/automation/rules/${id}/runs`)
179
+ url.searchParams.set('limit', limit.toString())
180
+ const res = await fetch(url.toString())
181
+ return res.json() as Promise<{ runs: AutomationRun[] }>
182
+ }
183
+
184
+ export async function updateConfig(
185
+ source: ConfigSource,
186
+ section: string,
187
+ value: unknown
188
+ ): Promise<{ ok: boolean }> {
189
+ const res = await fetch(`${SERVER_URL}/api/config`, {
190
+ method: 'PATCH',
191
+ headers: { 'Content-Type': 'application/json' },
192
+ body: JSON.stringify({ source, section, value })
193
+ })
194
+ if (!res.ok) {
195
+ const text = await res.text()
196
+ console.error('[api] update config failed:', res.status, text)
197
+ throw new Error(`Update config failed: ${res.status} ${text}`)
198
+ }
199
+ return res.json() as Promise<{ ok: boolean }>
200
+ }
201
+
202
+ export async function deleteSession(id: string): Promise<{ success: boolean }> {
203
+ const url = `${SERVER_URL}/api/sessions/${id}`
204
+ const res = await fetch(url, { method: 'DELETE' })
205
+ if (!res.ok) {
206
+ const text = await res.text()
207
+ console.error('[api] delete failed:', res.status, text)
208
+ throw new Error(`Delete failed: ${res.status} ${text}`)
209
+ }
210
+ return res.json() as Promise<{ success: boolean }>
211
+ }
212
+
213
+ export async function updateSession(id: string, data: Partial<Session>): Promise<{ ok: boolean }> {
214
+ const res = await fetch(`${SERVER_URL}/api/sessions/${id}`, {
215
+ method: 'PATCH',
216
+ headers: { 'Content-Type': 'application/json' },
217
+ body: JSON.stringify(data)
218
+ })
219
+ return res.json() as Promise<{ ok: boolean }>
220
+ }
221
+
222
+ export async function updateSessionTitle(id: string, title: string): Promise<{ session: Session }> {
223
+ const res = await fetch(`${SERVER_URL}/api/sessions/${id}`, {
224
+ method: 'PATCH',
225
+ headers: { 'Content-Type': 'application/json' },
226
+ body: JSON.stringify({ title })
227
+ })
228
+ return res.json() as Promise<{ session: Session }>
229
+ }
230
+
231
+ export async function getSessionMessages(
232
+ id: string,
233
+ limit?: number
234
+ ): Promise<{ messages: any[]; session?: Session; interaction?: { id: string; payload: any } }> {
235
+ const url = new URL(`${SERVER_URL}/api/sessions/${id}/messages`)
236
+ if (limit != null) {
237
+ url.searchParams.set('limit', limit.toString())
238
+ }
239
+ const res = await fetch(url.toString())
240
+ return res.json() as Promise<{ messages: any[]; session?: Session; interaction?: { id: string; payload: any } }>
241
+ }
package/src/components/ArchiveView.scss ADDED
@@ -0,0 +1,168 @@
1
+ .archive-view {
2
+ padding: 24px;
3
+ height: 100%;
4
+ overflow: auto;
5
+ display: flex;
6
+ flex-direction: column;
7
+ }
8
+
9
+ .archive-view__header {
10
+ margin-bottom: 16px;
11
+ display: flex;
12
+ align-items: center;
13
+ justify-content: space-between;
14
+ }
15
+
16
+ .archive-view__title {
17
+ display: flex;
18
+ align-items: center;
19
+ }
20
+
21
+ .archive-view__title-icon {
22
+ display: flex;
23
+ align-items: center;
24
+ font-size: 24px;
25
+ color: var(--sub-text-color);
26
+ }
27
+
28
+ .archive-view__title-text {
29
+ font-size: 18px;
30
+ margin: 0;
31
+ }
32
+
33
+ .archive-view__batch-info {
34
+ font-size: 13px;
35
+ color: var(--sub-text-color);
36
+ margin-right: 8px;
37
+ }
38
+
39
+ .archive-view__icon-button {
40
+ width: 32px;
41
+ height: 32px;
42
+ display: flex;
43
+ align-items: center;
44
+ justify-content: center;
45
+ padding: 0;
46
+ }
47
+
48
+ .archive-view__action-icon {
49
+ font-size: 18px;
50
+ display: flex;
51
+ align-items: center;
52
+ justify-content: center;
53
+ }
54
+
55
+ .archive-view__filter-bar {
56
+ margin-bottom: 16px;
57
+ display: flex;
58
+ align-items: center;
59
+ gap: 8px;
60
+ }
61
+
62
+ .archive-view__select-all {
63
+ width: 24px;
64
+ height: 24px;
65
+ display: flex;
66
+ align-items: center;
67
+ justify-content: center;
68
+ flex-shrink: 0;
69
+ }
70
+
71
+ .archive-view__search-input {
72
+ flex: 1;
73
+ }
74
+
75
+ .archive-view__search-icon {
76
+ font-size: 18px;
77
+ color: var(--placeholder-color);
78
+ }
79
+
80
+ .archive-view__list {
81
+ flex: 1;
82
+ }
83
+
84
+ .archive-view__item {
85
+ padding: 8px 0;
86
+ border-bottom: 1px solid var(--border-color);
87
+ background: transparent;
88
+ cursor: default;
89
+ }
90
+
91
+ .archive-view__item--selected {
92
+ background: var(--tag-hover-bg);
93
+ }
94
+
95
+ .archive-view__item--batch {
96
+ cursor: pointer;
97
+ }
98
+
99
+ .archive-view__item-row {
100
+ display: flex;
101
+ align-items: center;
102
+ width: 100%;
103
+ gap: 8px;
104
+ }
105
+
106
+ .archive-view__item-select {
107
+ width: 24px;
108
+ height: 24px;
109
+ display: flex;
110
+ align-items: center;
111
+ justify-content: center;
112
+ flex-shrink: 0;
113
+ }
114
+
115
+ .archive-view__item-icon {
116
+ font-size: 20px;
117
+ color: var(--placeholder-color);
118
+ flex-shrink: 0;
119
+ }
120
+
121
+ .archive-view__item-main {
122
+ flex: 1;
123
+ min-width: 0;
124
+ display: flex;
125
+ align-items: center;
126
+ gap: 12px;
127
+ }
128
+
129
+ .archive-view__item-title {
130
+ font-weight: 500;
131
+ overflow: hidden;
132
+ text-overflow: ellipsis;
133
+ white-space: nowrap;
134
+ flex: 1;
135
+ }
136
+
137
+ .archive-view__item-tags {
138
+ display: flex;
139
+ gap: 4px;
140
+ flex-shrink: 0;
141
+ }
142
+
143
+ .archive-view__item-tag {
144
+ font-size: 11px;
145
+ border-radius: 2px;
146
+ margin: 0;
147
+ }
148
+
149
+ .archive-view__item-time {
150
+ font-size: 12px;
151
+ color: var(--placeholder-color);
152
+ flex-shrink: 0;
153
+ }
154
+
155
+ .archive-view__item-actions {
156
+ display: flex;
157
+ gap: 4px;
158
+ flex-shrink: 0;
159
+ }
160
+
161
+ .archive-view__item-action-button {
162
+ width: 24px;
163
+ height: 24px;
164
+ display: flex;
165
+ align-items: center;
166
+ justify-content: center;
167
+ padding: 0;
168
+ }