move favorite icon from details table to page title

This commit is contained in:
Eduard Heimbuch
2020-03-25 08:08:40 +01:00
parent e2d4ebe706
commit df285182a8
3 changed files with 14 additions and 6 deletions

View File

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

View File

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

View File

@@ -146,7 +146,10 @@ class RepositoryRoot extends React.Component<Props, State> {
setMenuCollapsed: (collapsed: boolean) => this.setState({ menuCollapsed: collapsed }) 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="columns">
<div className="column"> <div className="column">
<Switch> <Switch>