move favorite icon from details table to page title

scm-ui/ui-components/src/layout/Page.tsx

@@ -10,6 +10,7 @@ import ErrorBoundary from "../ErrorBoundary";
 
 type Props = {
   title?: string;
+  afterTitle?: ReactNode;
   subtitle?: string;
   loading?: boolean;
   error?: Error;
@@ -27,6 +28,10 @@ const PageActionContainer = styled.div`
   }
 `;
 
+const MarginLeft = styled.div`
+margin-left: 0.5rem;
+`;
+
 export default class Page extends React.Component<Props> {
   componentDidUpdate() {
     const { title } = this.props;
@@ -57,7 +62,7 @@ export default class Page extends React.Component<Props> {
   }
 
   renderPageHeader() {
-    const { error, title, subtitle, children } = this.props;
+    const { error, title, afterTitle, subtitle, children } = this.props;
 
     let pageActions = null;
     let pageActionsExists = false;
@@ -81,7 +86,9 @@ export default class Page extends React.Component<Props> {
       <>
         <div className="columns">
           <div className="column">
-            <Title title={title} />
+            <div className="is-flex">
+              <Title title={title} /> <MarginLeft>{afterTitle}</MarginLeft>
+            </div>
             <Subtitle subtitle={subtitle} />
           </div>
           {pageActions}

scm-ui/ui-webapp/src/repos/components/RepositoryDetailTable.tsx

@@ -16,9 +16,7 @@ class RepositoryDetailTable extends React.Component<Props> {
         <tbody>
           <tr>
             <th>{t("repository.name")}</th>
-            <td>
-              <ExtensionPoint name={"repository.details.beforeName"} props={{ repository }} /> {repository.name}
-            </td>
+            <td>{repository.name}</td>
           </tr>
           <tr>
             <th>{t("repository.type")}</th>

scm-ui/ui-webapp/src/repos/containers/RepositoryRoot.tsx

@@ -146,7 +146,10 @@ class RepositoryRoot extends React.Component<Props, State> {
           setMenuCollapsed: (collapsed: boolean) => this.setState({ menuCollapsed: collapsed })
         }}
       >
-        <Page title={repository.namespace + "/" + repository.name}>
+        <Page
+          title={repository.namespace + "/" + repository.name}
+          afterTitle={<ExtensionPoint name={"repository.afterTitle"} props={{ repository }} />}
+        >
           <div className="columns">
             <div className="column">
               <Switch>