Add errors view & improve look n feel of errors - #428
Merged
Conversation
|
freekh
changed the title
Bring in the richtext-without-remirror refactor and the useGetDirectFileUploadSettings -> useValFieldContext change from main. Reconcile the compare-view additions (compact/inline AnyField props, hideUpload on ImageField, FieldSourceOverrideContext, useServerSourceAtPath, useShallowSourceAtPath sourceOverride support) with main's refactors. - ImageField: keep hideUpload wrapping, switch to useImageUpload hook. - RichTextField: drop the old remirror Editor wiring, pass readonly to the new ProseMirror editor's readOnly. - MediaPicker: take main's MediaPickerList extraction so the new editor picker components keep working. - ValFieldProvider: route sourceOverride through useShallowSourceAtPath, useSourceAtPath, and useSchemaAtPathInternal alongside main's useValFieldContext() (drop the now-removed creatorSourcePath arg). - Drop the obsolete remirror-based RichTextEditor.stories.tsx (deleted on main). - Fix unused-var lint regressions left behind on the branch (compact / autoFocus props that the field components hadn't been wired to read). - Fix getUnchangedSiblings: remove the early-return for record schemas so the existing test that asserts record siblings are returned passes.
…mproved-validation-errors
Contributor
There was a problem hiding this comment.
Pull request overview
Adds a dedicated validation errors view and updates validation error styling to use the warning palette across the UI.
Changes:
- Adds
/val/errorsrouting and a new grouped validation errors page. - Replaces inline validation error rendering with shared
FieldErrorListstyling. - Adds warning theme tokens and updates validation borders/buttons to use warning colors.
Reviewed changes
Copilot reviewed 15 out of 15 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
packages/ui/tailwind.config.js |
Adds Tailwind warning color tokens. |
packages/ui/spa/index.css |
Defines light/dark warning design variables. |
packages/ui/spa/components/ValRouter.tsx |
Adds errors route state, navigation, and query handling. |
packages/ui/spa/components/ValidationErrors.tsx |
Implements the dedicated validation errors page. |
packages/ui/spa/components/ValidationErrors.stories.tsx |
Adds Storybook stories for the errors view. |
packages/ui/spa/components/ToolsMenu.tsx |
Replaces inline validation error display with navigation button. |
packages/ui/spa/components/SortableList.tsx |
Updates validation border color to warning palette. |
packages/ui/spa/components/Module.tsx |
Updates module validation borders to warning palette. |
packages/ui/spa/components/InlineField.tsx |
Updates inline field validation border color. |
packages/ui/spa/components/FieldValidationError.tsx |
Delegates validation rendering to shared error list. |
packages/ui/spa/components/FieldErrorList.tsx |
Adds shared validation error list component. |
packages/ui/spa/components/Field.tsx |
Updates validation spacing and warning border color. |
packages/ui/spa/components/designSystem/button.tsx |
Adds warning button variant. |
packages/ui/spa/components/ContentArea.tsx |
Renders errors view in the main content area. |
examples/next/app/blogs/[blog]/page.val.ts |
Changes blog title validation constraint. |
…or msg space, path boundary check, creatorSourcePath, show_compare_view tool Agent-Logs-Url: https://github.com/valbuild/val/sessions/85f76f7b-131c-4b2c-821c-3c850eaa722f Co-authored-by: freekh <91758+freekh@users.noreply.github.com>
…seSource for modules with pending patches
ValSyncEngine.isEditedByComponent keyed "is this source being edited?" on the editor's path, so a freshly mounted field at a path that was edited earlier in the session inherited the previous instance's optimistic flag. Field components with local edit state (StringField, RichTextField, FileField, ImageField, ArrayFields) then refused to sync from source, leaving the input blank in the compare view's AFTER side and on any re-mount of an edited field. Rename patchIdsByCreatorPath/creatorSourcePath/pathOfCreator to creatorId (typed as string), add useFieldCreatorId() that returns a stable per-mount id, and thread it through useAddPatch / useShallowSourceAtPath / useSourceAtPath in the affected field components. Existing useEffect guards (clientSideOnly === false) now read a truthful per-instance flag, so re-mounted instances populate from source while actively-editing instances still keep their in-flight state. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…trol over button states
…ually consistent with the toolbar surface
…yling with other fields in compare patch set
freekh
force-pushed
the
improved-validation-errors
branch
from
May 19, 2026 19:30
2f510a9 to
bd24329
Compare
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
# Conflicts: # packages/ui/spa/components/AnyField.tsx # packages/ui/spa/components/ComparePatchSets.tsx # packages/ui/spa/components/Field.tsx # packages/ui/spa/components/FieldPatchAuthors.tsx # packages/ui/spa/components/FileGallery/FilePropertiesModal.tsx # packages/ui/spa/components/ValRouter.tsx # packages/ui/spa/components/fields/ArrayFields.tsx # packages/ui/spa/components/fields/ObjectFields.tsx # packages/ui/spa/components/fields/RecordFields.tsx # packages/ui/spa/components/fields/UnionField.tsx
# Conflicts: # packages/ui/spa/components/Field.tsx # packages/ui/spa/components/FieldValidationError.tsx # packages/ui/spa/components/ValRouter.tsx
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Rename sumValidationErrors -> fieldsWithErrors and label as "X fields" to align with the destination page heading. The counter already counted source paths (fields), not individual errors; the previous "X errors" label was misleading. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
The decorative amber rail was rendered as a direct <span> child of <ul>, which violates HTML content model and can confuse assistive tech. Lift the rail and positioning to a wrapper <div> so the <ul> contains only <li> children. No visual change. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.