{"record":{"id":"eef68846411fe5f3","repo":"AykutSarac/jsoncrack.com","slug":"errors-0-message","errorCode":null,"errorMessage":"errors[0]?.message","messagePattern":"errors\\[0\\]\\?\\.message","errorType":"validation","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"apps/www/src/features/editor/TextEditor.tsx","lineNumber":89,"sourceCode":"  }, [getHasChanges]);\n\n  const handleMount: OnMount = useCallback(editor => {\n    editor.onDidPaste(() => {\n      editor.getAction(\"editor.action.formatDocument\")?.run();\n    });\n  }, []);\n\n  return (\n    <StyledEditorWrapper>\n      <StyledWrapper>\n        <Editor\n          height=\"100%\"\n          language={fileType}\n          theme={theme}\n          value={contents}\n          options={editorOptions}\n          onMount={handleMount}\n          onValidate={errors => setError(errors[0]?.message || \"\")}\n          onChange={contents => setContents({ contents, skipUpdate: true })}\n          loading={<LoadingOverlay visible />}\n        />\n      </StyledWrapper>\n    </StyledEditorWrapper>\n  );\n};\n\nexport default TextEditor;\n\nconst StyledEditorWrapper = styled.div`\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  user-select: none;\n`;\n\nconst StyledWrapper = styled.div`","sourceCodeStart":71,"sourceCodeEnd":107,"githubUrl":"https://github.com/AykutSarac/jsoncrack.com/blob/3c9af69e23c635356293b6b28cf4cd0af10d1059/apps/www/src/features/editor/TextEditor.tsx#L71-L107","documentation":"Monaco editor's onValidate callback receives errors — an array of editor.IMarker objects from the JSON language service (or the configured JSON schema validator). errors[0]?.message extracts the first marker's message and stores it in the error state, which drives the 'Invalid' label in BottomBar. This is not a thrown exception; it is Monaco's diagnostics pipeline surfacing syntax/schema problems in the editor buffer.","triggerScenarios":"Typing an unclosed brace, trailing comma, or duplicate key; content failing the configured JSON schema (jsonSchema in useFile); pasting minified JSON with a structural error; switching the language mode to JSON from non-JSON content.","commonSituations":"Transient mid-edit errors that clear as the user finishes typing; schema mismatch after loading a schema intended for a different document shape; stale marker after a bulk replace.","solutions":["Hover the BottomBar popover to read the stored message and jump to the location.","Use Monaco's quick-fix or the format-on-paste hook (editor.onDidPaste already runs formatDocument).","Ensure the configured JSON schema actually matches the document being edited.","Fix the first reported error — Monaco revalidates and the message updates on each change."],"exampleFix":"// before\nonValidate={errors => setError(errors[0]?.message || \"\")}\n\n// after\nonValidate={errors => setError(errors[0]?.message ?? \"\")}","handlingStrategy":"validation","validationCode":"// Validate before relying on the stored error\nfunction firstMarkerMessage(errors: { message?: string }[]): string {\n  return errors[0]?.message ?? \"\";\n}","typeGuard":"function hasMarkers(errors: unknown): errors is { message: string }[] {\n  return Array.isArray(errors) && errors.length > 0 && typeof errors[0]?.message === \"string\";\n}","tryCatchPattern":"onValidate={errors => setError(hasMarkers(errors) ? errors[0].message : \"\")}","preventionTips":["Keep the JSON schema in sync with the document being edited; a stale schema produces confusing markers.","Use the format-on-paste hook (editor.onDidPaste) to normalize structure before validation runs.","Fix the first reported marker first — Monaco revalidates on every change and subsequent messages update."],"tags":["monaco","validation","json-schema","editor"],"backgroundTag":null,"analyzedSha":"3c9af69e23c635356293b6b28cf4cd0af10d1059","analyzedAt":"2026-08-12T19:00:27.891Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}