🐛 integrate user editing state into related tables component

[junkisai]

Issue

• resolve: Related Tables are not updated when selecting tables in succession #781

Why is this change needed?

I would like to be able to select a series of tables and still see the related tables correctly, but The first selected related tables are displayed.

What would you like reviewers to focus on?

I added key props so that RelatedTables re-renders when the selected table changes.

Testing Verification

Before	After
ss.65.mov	2025-02-28.17.49.11.mov

What was done

🤖 Generated by PR Agent at 5c06c79

• Fixed issue where related tables were not updated when switching tables.
• Integrated useUserEditingActiveStore to track active table state.
• Added key prop to force re-rendering of RelatedTables component.

Detailed Changes

	Relevant files
Bug fix	RelatedTables.tsx Ensure `RelatedTables` updates on table selection change  frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/RelatedTables/RelatedTables.tsx Imported useUserEditingActiveStore to track active table state. Added key prop to ERDContent to trigger re-render on table change. Integrated tableName from the store to ensure correct table rendering. +4/-0
Documentation	empty-baboons-doubt.md Document changes for related tables bug fix                            .changeset/empty-baboons-doubt.md Added a changeset entry for the bug fix. Documented the integration of user editing state. +5/-0

Additional Notes

---

Need help?

Type /help how to ... in the comments thread for any questions about Qodo Merge usage.

Check out the documentation for more information.

[changeset-bot]

🦋 Changeset detected

Latest commit: 5c06c79

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

This PR includes changesets to release 2 packages

Name	Type
@liam-hq/erd-core	Patch
@liam-hq/cli	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]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
liam-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 28, 2025 7:04am
liam-erd-sample	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 28, 2025 7:04am

3 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
test-liam-docs	⬜️ Ignored (Inspect)			Feb 28, 2025 7:04am
test-liam-erd-sample	⬜️ Ignored (Inspect)			Feb 28, 2025 7:04am
test-liam-erd-web	⬜️ Ignored (Inspect)			Feb 28, 2025 7:04am

[qodo-merge-pro-for-open-source]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

🎫 Ticket compliance analysis ✅ 781 - PR Code Verified Compliant requirements: Related tables should update correctly when selecting different tables in succession Should not require deselecting tables to see correct related tables Requires further human verification: UI should match expected behavior shown in ticket video - needs visual verification with the provided test videos

⏱️ Estimated effort to review: 1 🔵⚪⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ Recommended focus areas for review Component Re-rendering Verify that using tableName as key prop is the optimal solution for forcing re-renders. Consider if this could cause unnecessary re-renders of the entire ERDContent component. key={tableName}

[qodo-merge-pro-for-open-source]

PR Code Suggestions ✨

Explore these optional code suggestions:

Category	Suggestion	Impact
General	Avoid unnecessary component remounts Using tableName as a key prop may cause unnecessary remounts of the ERDContent component. Consider using a more stable identifier or removing the key if not strictly needed for component refresh. frontend/packages/erd-core/src/features/erd/components/ERDContent/components/TableNode/TableDetail/RelatedTables/RelatedTables.tsx [47-52] <ERDContent - key={tableName} nodes={nodes} edges={edges} displayArea="relatedTables" /> Apply this suggestion Suggestion importance[1-10]: 8 __ Why: Using tableName as a key prop will force ERDContent to remount every time the tableName changes, which could impact performance and user experience. The suggestion correctly identifies that the key prop might be unnecessary if not explicitly needed for component refresh.	Medium
More