vzcode 1.46.0 → 1.47.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.
package/dist/index.html CHANGED
@@ -20,8 +20,8 @@
20
20
  href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap"
21
21
  rel="stylesheet"
22
22
  />
23
- <script type="module" crossorigin src="/assets/index-CC0CUUDi.js"></script>
24
- <link rel="stylesheet" crossorigin href="/assets/index-CQyHWTWE.css">
23
+ <script type="module" crossorigin src="/assets/index-BMYXp1Uw.js"></script>
24
+ <link rel="stylesheet" crossorigin href="/assets/index-BXyJ2hMf.css">
25
25
  </head>
26
26
  <body>
27
27
  <div id="root"></div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vzcode",
3
- "version": "1.46.0",
3
+ "version": "1.47.0",
4
4
  "description": "Multiplayer code editor system",
5
5
  "main": "src/index.ts",
6
6
  "type": "module",
@@ -10,7 +10,7 @@ import { MessageList } from './MessageList';
10
10
  import { ChatInput } from './ChatInput';
11
11
  import './styles.scss';
12
12
 
13
- const defaultAIChatEndpoint = '/ai-chat-message';
13
+ const defaultAIChatEndpoint = '/api/ai-chat/';
14
14
 
15
15
  export const AIChat = () => {
16
16
  const { aiChatMessage, setAIChatMessage } =
@@ -18,6 +18,9 @@ export const AIChat = () => {
18
18
 
19
19
  const [isLoading, setIsLoading] = useState(false);
20
20
  const [currentChatId] = useState(() => uuidv4());
21
+ const [errorMessage, setErrorMessage] = useState<
22
+ string | null
23
+ >(null);
21
24
 
22
25
  const {
23
26
  aiChatFocused,
@@ -52,6 +55,7 @@ export const AIChat = () => {
52
55
 
53
56
  setAIChatMessage('');
54
57
  setIsLoading(true);
58
+ setErrorMessage(null); // Clear any previous errors
55
59
 
56
60
  // Call backend endpoint for AI response
57
61
  // The server will handle all ShareDB operations including adding the user message
@@ -63,6 +67,7 @@ export const AIChat = () => {
63
67
  },
64
68
  body: JSON.stringify({
65
69
  ...aiChatOptions,
70
+ vizId: aiChatOptions.vizId,
66
71
  content: aiChatMessage.trim(),
67
72
  chatId: currentChatId,
68
73
  mode: aiChatMode,
@@ -75,11 +80,24 @@ export const AIChat = () => {
75
80
  );
76
81
  }
77
82
 
78
- // The backend handles all ShareDB operations
79
- await response.json();
83
+ // Parse the response to check for errors
84
+ const responseData = await response.json();
85
+
86
+ // Check if the response contains a VizHub error
87
+ if (
88
+ responseData.outcome === 'failure' &&
89
+ responseData.error
90
+ ) {
91
+ setErrorMessage(responseData.error.message);
92
+ return;
93
+ }
94
+
95
+ // The backend handles all ShareDB operations for successful responses
80
96
  } catch (error) {
81
97
  console.error('Error getting AI response:', error);
82
- // Server will handle error messages too
98
+ setErrorMessage(
99
+ 'Failed to send message. Please try again.',
100
+ );
83
101
  } finally {
84
102
  setIsLoading(false);
85
103
  }
@@ -224,6 +242,23 @@ export const AIChat = () => {
224
242
  aiScratchpad={aiScratchpad}
225
243
  />
226
244
  )}
245
+ {errorMessage && (
246
+ <div className="ai-chat-error">
247
+ <div className="ai-chat-error-content">
248
+ <span className="ai-chat-error-icon">⚠️</span>
249
+ <span className="ai-chat-error-message">
250
+ {errorMessage}
251
+ </span>
252
+ <button
253
+ className="ai-chat-error-dismiss"
254
+ onClick={() => setErrorMessage(null)}
255
+ aria-label="Dismiss error"
256
+ >
257
+ ×
258
+ </button>
259
+ </div>
260
+ </div>
261
+ )}
227
262
  <ChatInput
228
263
  aiChatMessage={aiChatMessage}
229
264
  setAIChatMessage={setAIChatMessage}
@@ -272,6 +272,61 @@
272
272
  }
273
273
  }
274
274
 
275
+ .ai-chat-error {
276
+ margin: 10px 0;
277
+ padding: 0;
278
+ border-radius: 8px;
279
+ background: rgba(220, 53, 69, 0.1);
280
+ border: 1px solid rgba(220, 53, 69, 0.3);
281
+
282
+ .ai-chat-error-content {
283
+ display: flex;
284
+ align-items: center;
285
+ padding: 12px;
286
+ gap: 10px;
287
+
288
+ .ai-chat-error-icon {
289
+ font-size: 16px;
290
+ flex-shrink: 0;
291
+ }
292
+
293
+ .ai-chat-error-message {
294
+ flex: 1;
295
+ font-size: 14px;
296
+ color: #dc3545;
297
+ line-height: 1.4;
298
+ font-weight: 500;
299
+ }
300
+
301
+ .ai-chat-error-dismiss {
302
+ background: none;
303
+ border: none;
304
+ color: #dc3545;
305
+ font-size: 18px;
306
+ font-weight: bold;
307
+ cursor: pointer;
308
+ padding: 0;
309
+ width: 20px;
310
+ height: 20px;
311
+ display: flex;
312
+ align-items: center;
313
+ justify-content: center;
314
+ border-radius: 50%;
315
+ transition: background-color 0.2s ease;
316
+ flex-shrink: 0;
317
+
318
+ &:hover {
319
+ background: rgba(220, 53, 69, 0.1);
320
+ }
321
+
322
+ &:focus {
323
+ outline: 2px solid rgba(220, 53, 69, 0.3);
324
+ outline-offset: 1px;
325
+ }
326
+ }
327
+ }
328
+ }
329
+
275
330
  .ai-chat-input-container {
276
331
  border-top: 1px solid var(--vh-color-neutral-02);
277
332
  padding-top: 10px;