mirror of
https://github.com/voideditor/void
synced 2026-05-24 09:58:23 +00:00
update error handling
This commit is contained in:
parent
f6f6259f23
commit
8ff4f1c6e1
2 changed files with 30 additions and 18 deletions
|
|
@ -248,7 +248,7 @@ export const SidebarChat = () => {
|
|||
setInstructions('');
|
||||
formRef.current?.reset(); // reset the form's text when clear instructions or unexpected behavior happens
|
||||
threadsStateService.setStaging([]) // clear staging
|
||||
setLatestError('')
|
||||
setLatestError(null)
|
||||
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,30 +3,43 @@ import { AlertCircle, ChevronDown, ChevronUp, X } from 'lucide-react';
|
|||
|
||||
import { getCmdKey } from '../../../getCmdKey.js';
|
||||
|
||||
const opaqueMessage = `\
|
||||
Unfortunately, Void can't see the full error. However, you should be able to find more details by pressing ${getCmdKey()}+Shift+P, typing "Toggle Developer Tools", and looking at the console.\n
|
||||
This error often means you have an incorrect API key. If you're self-hosting your own server, it might mean your CORS headers are off, and you should make sure your server's response has the header "Access-Control-Allow-Origins" set to "*", or at least allows "vscode-file://vscode-app".`
|
||||
// const opaqueMessage = `\
|
||||
// Unfortunately, Void can't see the full error. However, you should be able to find more details by pressing ${getCmdKey()}+Shift+P, typing "Toggle Developer Tools", and looking at the console.\n
|
||||
// This error often means you have an incorrect API key. If you're self-hosting your own server, it might mean your CORS headers are off, and you should make sure your server's response has the header "Access-Control-Allow-Origins" set to "*", or at least allows "vscode-file://vscode-app".`
|
||||
// if ((error instanceof Error) && (error.cause + '').includes('TypeError: Failed to fetch')) {
|
||||
// e = error as any
|
||||
// e['Void Team'] = opaqueMessage
|
||||
// }
|
||||
|
||||
|
||||
type Details = {
|
||||
message: string,
|
||||
name: string,
|
||||
// stack: string | null,
|
||||
cause: string | null,
|
||||
code: string | null,
|
||||
additional: Record<string, any>
|
||||
}
|
||||
|
||||
// Get detailed error information
|
||||
const getErrorDetails = (error: unknown) => {
|
||||
|
||||
let details: { message: string, name: string, stack: string | null, cause: string | null, code: string | null, additional: Record<string, any> };
|
||||
let details: Details;
|
||||
|
||||
let e: Error & { [other: string]: undefined | any }
|
||||
|
||||
|
||||
|
||||
// If fetch() fails, it gives an opaque message. We add extra details to the error.
|
||||
if ((error instanceof Error) && (error.cause + '').includes('TypeError: Failed to fetch')) {
|
||||
e = error as any
|
||||
e['Void Team'] = opaqueMessage
|
||||
}
|
||||
else if (error instanceof Error) {
|
||||
if (error instanceof Error) {
|
||||
e = error
|
||||
}
|
||||
// sometimes error is an object but not an Error
|
||||
else if (typeof error === 'object') {
|
||||
e = new Error('More details below.', { cause: JSON.stringify(error) })
|
||||
}
|
||||
else {
|
||||
e = new Error(String(error))
|
||||
}
|
||||
// console.log('error display', JSON.stringify(e))
|
||||
|
||||
const message = e.message && e.error ?
|
||||
(e.message + ':\n' + e.error)
|
||||
|
|
@ -35,7 +48,7 @@ const getErrorDetails = (error: unknown) => {
|
|||
details = {
|
||||
name: e.name || 'Error',
|
||||
message: message,
|
||||
stack: e.stack || null,
|
||||
// stack: e.stack || null, // can we remove this? it looks awful and not sure stack is ever useful
|
||||
cause: e.cause ? String(e.cause) : null,
|
||||
code: e.code || null,
|
||||
additional: {}
|
||||
|
|
@ -57,7 +70,7 @@ export const ErrorDisplay = ({
|
|||
showDismiss = true,
|
||||
className = ''
|
||||
}: {
|
||||
error: Error | string,
|
||||
error: Error | object | string,
|
||||
onDismiss: (() => void) | null,
|
||||
showDismiss?: boolean,
|
||||
className?: string
|
||||
|
|
@ -65,7 +78,7 @@ export const ErrorDisplay = ({
|
|||
const [isExpanded, setIsExpanded] = useState(false);
|
||||
|
||||
const details = getErrorDetails(error);
|
||||
const hasDetails = details.stack || details.cause || Object.keys(details.additional).length > 0;
|
||||
const hasDetails = details.cause || Object.keys(details.additional).length > 0;
|
||||
|
||||
return (
|
||||
<div className={`rounded-lg border border-red-200 bg-red-50 p-4 ${className}`}>
|
||||
|
|
@ -132,15 +145,14 @@ export const ErrorDisplay = ({
|
|||
</pre>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{details.stack && (
|
||||
{/* {details.stack && (
|
||||
<div>
|
||||
<span className="font-semibold text-red-800">Stack Trace:</span>
|
||||
<pre className="mt-1 text-sm text-red-700 overflow-x-auto whitespace-pre-wrap">
|
||||
{details.stack}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
)} */}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue