Skip to content

Update filters UI to show properly errors#6043

Draft
witoszekdev wants to merge 10 commits intomainfrom
update-filters-ui-error-row
Draft

Update filters UI to show properly errors#6043
witoszekdev wants to merge 10 commits intomainfrom
update-filters-ui-error-row

Conversation

@witoszekdev
Copy link
Member

@witoszekdev witoszekdev commented Nov 7, 2025

CleanShot 2025-11-07 at 12 22 13@2x

Copilot AI review requested due to automatic review settings November 7, 2025 11:22
@changeset-bot
Copy link

changeset-bot bot commented Nov 7, 2025

🦋 Changeset detected

Latest commit: 5e5781a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
saleor-dashboard Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Nov 7, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Preview Comments Updated (UTC)
saleor-dashboard-storybook Ignored Ignored Nov 7, 2025 11:22am

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR enhances metadata filtering functionality by adding validation for metadata keys, supporting optional values for WHERE API queries, and improving error display in the filter UI.

Key changes:

  • Adds validation to ensure metadata key is always provided while allowing empty value for WHERE API
  • Refactors UI components to display error messages in a dedicated row beneath filter inputs
  • Centralizes API type constants and extracts filter definition resolvers to module level

Reviewed Changes

Copilot reviewed 21 out of 21 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
queryVariables.ts Introduces QUERY_API_TYPES constant and refactors query variable functions to extract builders to module scope
intl.ts Adds "No value" placeholder message for metadata inputs
context/provider.tsx Passes queryApiType to all filter providers
context/context.ts Adds queryApiType field to context type
Validation/metadata.ts New validator ensuring metadata key is provided
Validation/metadata.test.ts Tests for metadata validation logic
Validation/index.ts Registers metadata validator
UI/Row.tsx Refactored to use new FilterInputs and FilterErrors components with improved layout
UI/RightOperator.tsx Removes helperText prop from component interface
UI/MetadataInput.tsx Implements optional value support with dynamic placeholder based on API type
UI/MetadataInput.module.css Styles for visible placeholders
UI/Filters.tsx Simplified layout logic with label handling
UI/FilterInputs.tsx New component extracting input rendering logic from Row
UI/FilterErrors.tsx New component for displaying validation errors in a separate row
UI/BulkSelect.tsx Removes helperText prop from interface
FiltersQueryBuilder/.../MetadataFilterInputQueryVarsBuilder.ts Omits value field when empty for WHERE API
FiltersQueryBuilder/.../MetadataFilterInputQueryVarsBuilder.test.ts Adds test for empty value handling
locale/defaultMessages.json Adds translation entry for "No value"
.changeset files Documents the changes for release notes

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

index={index}
emitter={emitter}
error={error.right.show}
helperText={error.right.text}
Copy link

Copilot AI Nov 7, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The helperText prop is being passed to RightOperator, but this prop was removed from the RightOperatorProps interface (see RightOperator.tsx lines 29-35). This will cause a TypeScript error or runtime issue. Remove this prop as error messages are now displayed via the FilterErrors component.

Suggested change
helperText={error.right.text}

Copilot uses AI. Check for mistakes.
@codecov
Copy link

codecov bot commented Nov 7, 2025

Codecov Report

❌ Patch coverage is 35.21127% with 92 lines in your changes missing coverage. Please review.
✅ Project coverage is 39.72%. Comparing base (7465a3a) to head (5e5781a).
⚠️ Report is 6 commits behind head on main.

Files with missing lines Patch % Lines
.../components/ConditionalFilter/UI/MetadataInput.tsx 10.52% 34 Missing ⚠️
...c/components/ConditionalFilter/UI/FilterInputs.tsx 11.42% 31 Missing ⚠️
src/components/ConditionalFilter/UI/Filters.tsx 10.00% 9 Missing ⚠️
...c/components/ConditionalFilter/UI/FilterErrors.tsx 20.00% 8 Missing ⚠️
src/components/ConditionalFilter/UI/Row.tsx 44.44% 5 Missing ⚠️
src/components/ConditionalFilter/queryVariables.ts 85.18% 4 Missing ⚠️
...omponents/ConditionalFilter/Validation/metadata.ts 87.50% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff            @@
##             main    #6043     +/-   ##
=========================================
  Coverage   39.72%   39.72%             
=========================================
  Files        2437     2440      +3     
  Lines       39921    40002     +81     
  Branches     9123     8823    -300     
=========================================
+ Hits        15857    15892     +35     
- Misses      22853    24081   +1228     
+ Partials     1211       29   -1182     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants