ENG-3185: Migrate system data flow components to Ant Design

[jpople]

Ticket ENG-3185

Description Of Changes

Migrates the system data flow shared components from Chakra UI + Formik to Ant Design + local state management. This is a pure UI framework migration with no functional changes.

Code Changes

• DataFlowAccordion.tsx — Replaced ChakraAccordion with antd Flex wrapper (each child renders its own Collapse)
• DataFlowAccordionForm.tsx — Replaced Chakra accordion parts with antd Collapse items pattern; removed Formik entirely in favor of local state + direct Redux dispatch for FormGuard dirty tracking
• DataFlowSystemsDeleteTable.tsx — Replaced Chakra Table/Thead/Tbody/Tr/Td with antd Table using columns + dataSource; removed useFormikContext in favor of onDelete callback prop
• DataFlowSystemsModal.tsx — Replaced Chakra layout components (Box, Flex, FormControl, FormLabel, Stack, Text) with antd Flex + Tailwind; removed useFormikContext
• DataFlowSystemsTable.tsx — Replaced Chakra Table/Box with antd Table + Tailwind; removed useFormikContext in favor of onChange callback

Steps to Confirm

1. Navigate to a system detail page → Data Flow tab
2. Verify the Sources and Destinations accordion sections render and expand/collapse
3. Click "Configure sources" → verify modal opens with system list, search, and "Assign all" toggle
4. Assign/unassign systems via toggles → confirm → verify the delete table updates
5. Delete a system from the delete table → verify it is removed
6. Verify Save/Cancel buttons enable only when changes are made
7. Save changes and confirm success toast appears

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:
  • Ensure that your downrev is up to date with the latest revision on main
  • Ensure that your downgrade() migration is correct and works
    • If a downgrade migration is not possible for this change, please call this out in the PR description!
  • No migrations
• Documentation:
  • Documentation complete, PR opened in fidesdocs
  • Documentation issue created in fidesdocs
  • If there are any new client scopes created as part of the pull request, remember to update public-facing documentation that references our scope registry
  • 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 18, 2026 10:46pm

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
fides-privacy-center	Ignored		May 18, 2026 10:46pm

[github-actions]

Title	Lines	Statements	Branches	Functions
admin-ui		6.93% (3173/45764)	6.34% (1680/26479)	4.79% (650/13549)
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)

[gilluminate]

Sorry, I must not have hit send on this comment earlier and I'm still seeing this issue... This height style is causing problems in the ui

[jpople]

Got it, thanks-- just removed the height, don't think it's really needed here and it was sometimes (?) causing this issue for me as well.

[gilluminate]

much better! Thanks

[gilluminate]

Looks good!