Improve display of multiple taxonomies values in policy builder UI

[lucanovera]

Ticket ENG-3783

Description Of Changes

Reworks the values input on a match condition (the "Match" node in the access-policy editor canvas) so users can comfortably select and review many taxonomy values at once. Previously the field used an antd multi-select with maxTagCount={1}, which collapsed every selection past the first into a +N indicator — making it effectively impossible to see what was selected when matching against 5–10+ data categories.

The field now follows the chip + add pattern used by the data-discovery TaxonomySelectCell: each selected value renders as its own closable chip and a + "addable" tag opens a full multi-select in place. Closing the editor (click outside) collapses back to the chip list. Because the chip list can grow vertically, the React Flow canvas now sizes condition nodes from their real measured DOM height instead of a hard-coded 310px — so a tall match node pushes its siblings down instead of overlapping them.

Code Changes

• New ConditionValuesField.tsx in features/access-policies/:
  • Displays selected values as wrapping closable chips with a + add tag.
  • On +, swaps to the appropriate taxonomy multi-select (DataCategorySelect / DataUseSelect / DataSubjectSelect / SystemGroupSelect / CustomTaxonomySelect) opened in mode="multiple", returning to the chip list on blur.
  • Resolves chip labels via useTaxonomies (built-in taxonomies); falls back to the raw fides_key for system groups and custom taxonomies.
• MatchNode.tsx: removed the inline renderValuesSelect helper and its five taxonomy-select imports; the form field now renders <ConditionValuesField />.
• AccessPolicyEditor.tsx: nodeSizes memo reads node.measured?.height (populated by React Flow after the node mounts) and feeds it into the dagre layout. The previous hard-coded 310 (condition) / 380 (constraint) values remain as fallbacks for the first paint before measurement is available. As soon as a measurement is available — or whenever a chip is added/removed and the node re-measures — dagre re-runs and positions update.

Steps to Confirm

1. Open an access policy in the editor (e.g. /access-policies/new or any existing policy).
2. Add an action and a Match condition; choose Data categories as the taxonomy.
3. Click the + tag in the values field and select 8–10 categories. Confirm:
   • Each selection renders as its own chip with an ×, all of them visible.
   • Clicking an × removes that single value.
   • Clicking outside the dropdown collapses the editor back to the chip list.
   • Already-selected items do not appear in the dropdown options.
4. With the long chip list rendered, confirm the Match node does not overlap the next match node below — the canvas should re-flow so spacing between siblings respects the actual height of the taller node.
5. Repeat with Data uses, Data subjects, System groups, and a custom taxonomy to confirm all five wrapper variants render correctly.
6. Save the policy and reopen it; confirm the chip list reflects the persisted values.

Pre-Merge Checklist

• Issue requirements met
• All CI pipelines succeeded
• CHANGELOG.md updated
  • Add a db-migration This indicates that a change includes a database migration label to the entry if your change includes a DB migration
  • Add a high-risk This issue suggests changes that have a high-probability of breaking existing code label to the entry if your change includes a high-risk change (i.e. potential for performance impact or unexpected regression) that should be flagged
  • Updates unreleased work already in Changelog, no new entry necessary
• UX feedback:
  • All UX related changes have been reviewed by a designer
  • No UX review needed
• Followup issues:
  • Followup issues created
  • No followup issues
• Database migrations:
  • No migrations
• Documentation:
  • No documentation updates required

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
fides-plus-nightly	Ready	Preview, Comment	May 19, 2026 4:26pm

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
fides-privacy-center	Ignored		May 19, 2026 4:26pm

[github-actions]

Title	Lines	Statements	Branches	Functions
admin-ui		6.96% (3187/45779)	6.35% (1683/26499)	4.83% (655/13553)
fides-js		79.17% (1977/2497)	66.25% (1249/1885)	73.31% (349/476)
privacy-center		82.53% (364/441)	79.74% (189/237)	74.07% (60/81)

[kruulik]

Works great! Tested on nightly, couldn't find any issues.