From eb575b8fee7a70015fb86fc372f731954fb1d8f4 Mon Sep 17 00:00:00 2001
From: blam <ben@blam.sh>
Date: Wed, 8 Nov 2023 21:54:53 -0600
Subject: [PATCH] feat: move the icon to the left

Signed-off-by: blam <ben@blam.sh>
---
 .../src/components/EntityDisplayName/EntityDisplayName.tsx  | 4 ++--
 .../src/components/EntityRefLink/EntityRefLink.tsx          | 3 +++
 .../src/components/EntityRefLink/EntityRefLinks.tsx         | 5 +++--
 .../src/next/components/TemplateCard/TemplateCard.tsx       | 1 +
 plugins/scaffolder/src/legacy/TemplateCard/TemplateCard.tsx | 6 +++++-
 5 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/plugins/catalog-react/src/components/EntityDisplayName/EntityDisplayName.tsx b/plugins/catalog-react/src/components/EntityDisplayName/EntityDisplayName.tsx
index 6bdbe83a84..357685cade 100644
--- a/plugins/catalog-react/src/components/EntityDisplayName/EntityDisplayName.tsx
+++ b/plugins/catalog-react/src/components/EntityDisplayName/EntityDisplayName.tsx
@@ -34,7 +34,7 @@ const useStyles = makeStyles(
       alignItems: 'center',
     },
     icon: {
-      marginLeft: theme.spacing(0.5),
+      marginRight: theme.spacing(0.5),
       color: theme.palette.text.secondary,
       lineHeight: 0,
     },
@@ -77,12 +77,12 @@ export const EntityDisplayName = (
   // Optionally an icon, and wrapper around them both
   content = (
     <Box component="span" className={classes.root}>
-      {content}
       {Icon && !noIcon ? (
         <Box component="span" className={classes.icon}>
           <Icon fontSize="inherit" />
         </Box>
       ) : null}
+      {content}
     </Box>
   );
 
diff --git a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx
index 32627fccb2..dee0b252e5 100644
--- a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx
+++ b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx
@@ -38,6 +38,7 @@ export type EntityRefLinkProps = {
   /** @deprecated This option should no longer be used; presentation is requested through the {@link entityPresentationApiRef} instead */
   title?: string;
   children?: React.ReactNode;
+  noIcon?: boolean;
 } & Omit<LinkProps, 'to'>;
 
 /**
@@ -53,6 +54,7 @@ export const EntityRefLink = forwardRef<any, EntityRefLinkProps>(
       defaultNamespace,
       title,
       children,
+      noIcon,
       ...linkProps
     } = props;
     const entityRoute = useEntityRoute(props.entityRef);
@@ -62,6 +64,7 @@ export const EntityRefLink = forwardRef<any, EntityRefLinkProps>(
         entityRef={entityRef}
         defaultKind={defaultKind}
         defaultNamespace={defaultNamespace}
+        noIcon={noIcon}
       />
     );
 
diff --git a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLinks.tsx b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLinks.tsx
index 929b3f9376..9ed23ca360 100644
--- a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLinks.tsx
+++ b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLinks.tsx
@@ -32,6 +32,7 @@ export type EntityRefLinksProps<
 > = {
   defaultKind?: string;
   entityRefs: TRef[];
+  noIcons?: boolean;
   /** @deprecated This option is no longer used; presentation is handled by entityPresentationApiRef instead */
   fetchEntities?: boolean;
   /** @deprecated This option is no longer used; presentation is handled by entityPresentationApiRef instead */
@@ -46,7 +47,7 @@ export type EntityRefLinksProps<
 export function EntityRefLinks<
   TRef extends string | CompoundEntityRef | Entity,
 >(props: EntityRefLinksProps<TRef>) {
-  const { entityRefs, ...linkProps } = props;
+  const { entityRefs, noIcons, ...linkProps } = props;
 
   return (
     <>
@@ -56,7 +57,7 @@ export function EntityRefLinks<
         return (
           <React.Fragment key={`${i}.${entityRefString}`}>
             {i > 0 && ', '}
-            <EntityRefLink {...linkProps} entityRef={r} />
+            <EntityRefLink {...linkProps} entityRef={r} noIcon={noIcons} />
           </React.Fragment>
         );
       })}
diff --git a/plugins/scaffolder-react/src/next/components/TemplateCard/TemplateCard.tsx b/plugins/scaffolder-react/src/next/components/TemplateCard/TemplateCard.tsx
index 2a0a34823d..45f825e738 100644
--- a/plugins/scaffolder-react/src/next/components/TemplateCard/TemplateCard.tsx
+++ b/plugins/scaffolder-react/src/next/components/TemplateCard/TemplateCard.tsx
@@ -174,6 +174,7 @@ export const TemplateCard = (props: TemplateCardProps) => {
                   style={{ marginLeft: '8px' }}
                   entityRefs={ownedByRelations}
                   defaultKind="Group"
+                  noIcons
                 />
               </>
             )}
diff --git a/plugins/scaffolder/src/legacy/TemplateCard/TemplateCard.tsx b/plugins/scaffolder/src/legacy/TemplateCard/TemplateCard.tsx
index d35636f507..e3d50b81f9 100644
--- a/plugins/scaffolder/src/legacy/TemplateCard/TemplateCard.tsx
+++ b/plugins/scaffolder/src/legacy/TemplateCard/TemplateCard.tsx
@@ -243,7 +243,11 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => {
           <Typography variant="body2" className={classes.label}>
             Owner
           </Typography>
-          <EntityRefLinks entityRefs={ownedByRelations} defaultKind="Group" />
+          <EntityRefLinks
+            entityRefs={ownedByRelations}
+            defaultKind="Group"
+            noIcons
+          />
         </Box>
         <Box>
           <Typography