prepare first extensionpoint for favourite repository icon

scm-ui/ui-components/src/CardColumn.tsx

@@ -4,7 +4,7 @@ import styled from "styled-components";
 import { Link } from "react-router-dom";
 
 type Props = {
-  title: string;
+  title: ReactNode;
   description?: string;
   avatar: ReactNode;
   contentRight?: ReactNode;
@@ -77,7 +77,7 @@ export default class CardColumn extends React.Component<Props> {
             <div className="is-flex">
               <ContentLeft className="content">
                 <p className="shorten-text is-marginless">
-                  <strong>{title}</strong>
+                  {title}
                 </p>
                 <p className="shorten-text">{description}</p>
               </ContentLeft>

scm-ui/ui-webapp/src/admin/plugins/components/PluginEntry.tsx

@@ -158,7 +158,7 @@ class PluginEntry extends React.Component<Props, State> {
         <CardColumn
           action={this.isInstallable() ? () => this.toggleModal("showInstallModal") : null}
           avatar={avatar}
-          title={plugin.displayName ? plugin.displayName : plugin.name}
+          title={plugin.displayName ? <strong>{plugin.displayName}</strong> : <strong>{plugin.name}</strong>}
           description={plugin.description}
           contentRight={plugin.pending || plugin.markedForUninstall ? this.createPendingSpinner() : actionbar}
           footerRight={footerRight}

scm-ui/ui-webapp/src/repos/components/list/RepositoryEntry.tsx

@@ -62,15 +62,25 @@ class RepositoryEntry extends React.Component<Props> {
     );
   };
 
+  createTitle = () => {
+    const { repository } = this.props;
+    return (
+      <>
+        <ExtensionPoint name="repository.card.beforeTitle" props={{repository}} /> <strong>{repository.name}</strong>
+      </>
+    );
+  };
+
   render() {
     const { repository } = this.props;
     const repositoryLink = this.createLink(repository);
     const footerLeft = this.createFooterLeft(repository, repositoryLink);
     const footerRight = this.createFooterRight(repository);
+    const title = this.createTitle();
     return (
       <CardColumn
         avatar={<RepositoryAvatar repository={repository} />}
-        title={repository.name}
+        title={title}
         description={repository.description}
         link={repositoryLink}
         footerLeft={footerLeft}