Add missing foreign key icons in Schema Designer table nodes

[Copilot]

This PR fixes the missing foreign key icons in the Schema Designer table view. Previously, only primary key columns were visually distinguished with icons, while foreign key columns had no visual indication of their relationship to other tables.

Problem

In the Schema Designer, foreign key columns like id_author were not showing any visual indicators, making it difficult to identify relationships between tables at a glance. The TableColumn component only checked for primary keys but ignored foreign key relationships.

As shown in the first image, the id_author column (which is a foreign key referencing the dbo.Authors table) appears without any icon, making the relationship invisible to users.

Solution

Added foreign key detection logic to the TableColumn component:

// Check if this column is a foreign key
const isForeignKey = table.foreignKeys.some((fk) => fk.columns.includes(column.name));

// Show foreign key icon for non-primary key columns
{!column.isPrimaryKey && isForeignKey && (
    <FluentIcons.FlowRegular className={styles.keyIcon} />
)}

Changes Made

• Foreign Key Detection: Added logic to check if a column participates in any foreign key relationship
• Icon Rendering: Used FlowRegular icon from FluentUI (consistent with relationship management UI)
• Component Updates: Updated TableColumn and TableColumns components to pass table data for foreign key detection
• Styling: Foreign key icons use the same styling as primary key icons for consistency
• Icon Precedence: Primary key icons take precedence when a column is both a primary and foreign key

Edge Cases Handled

• ✅ Columns that are both primary and foreign keys (primary key icon takes precedence)
• ✅ Multi-column foreign keys (all participating columns show the icon)
• ✅ Tables with no foreign keys (no change in behavior)
• ✅ Empty foreign key arrays (gracefully handled)

Visual Impact

Foreign key columns now display a flow icon (🔗) to clearly indicate they reference another table, making database relationships immediately visible in the Schema Designer.

The second image shows the foreign key configuration panel, confirming that id_author is indeed configured as a foreign key referencing dbo.Authors.AuthorID.

Fixes #19100.

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• update.code.visualstudio.com
  • Triggering command: /usr/local/bin/node ./out/test/unit/runTest.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to my firewall allow list

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[aasimkhan30]

Verified the fix.

[github-actions]

PR Changes

Category	Main Branch	PR Branch	Difference
Code Coverage	60.46%	60.37%	⚪ 0.00%
VSIX Size	15488 KB	15504 KB	⚪ 16 KB ( 0% )
Webview Bundle Size	3776 KB	3776 KB	⚪ 0 KB ( 0% )