fix(catalog): filter icon links before calling useProps

The catalogAboutEntityCard was calling useProps() for all icon links
before checking filters, causing hooks with side effects to execute
for all entity types. This fix reverses the order to check the filter
first, then only call useProps() if the filter passes.

This prevents unnecessary side effects like API calls, auth flows, or
state updates from running for icon links that won't be displayed.

Signed-off-by: Tommy Le <tommy_le@outlook.com>

.changeset/ready-results-march.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+Fixed `catalogAboutEntityCard` to filter icon links before calling useProps(), preventing side effects from hooks in filtered-out links

plugins/catalog/src/alpha/entityCards.tsx

@@ -41,12 +41,14 @@ export const catalogAboutEntityCard = EntityCardBlueprint.makeWithOverrides({
       // The "useProps" functions may be calling other hooks, so we need to
       // call them in a component function to avoid breaking the rules of hooks.
       const links = inputs.iconLinks.reduce((rest, iconLink) => {
-        const props = iconLink.get(EntityIconLinkBlueprint.dataRefs.useProps)();
         const filter = buildFilterFn(
           iconLink.get(EntityIconLinkBlueprint.dataRefs.filterFunction),
           iconLink.get(EntityIconLinkBlueprint.dataRefs.filterExpression),
         );
         if (filter(entity)) {
+          const props = iconLink.get(
+            EntityIconLinkBlueprint.dataRefs.useProps,
+          )();
           return [...rest, props];
         }
         return rest;