show changeset parents on changeset details view

scm-ui/ui-webapp/public/locales/de/repos.json

@@ -87,6 +87,10 @@
     "shortSummary": "Committet <0/> <1/>",
     "tags": "Tags",
     "diffNotSupported": "Diff des Changesets wird von diesem Repositorytyp nicht unterstützt",
+    "parents": {
+      "label" : "Parent",
+      "label_plural": "Parents"
+    },
     "contributors": {
       "mailto": "Mail senden an",
       "list": "Liste der Mitwirkenden",

scm-ui/ui-webapp/public/locales/en/repos.json

@@ -91,6 +91,10 @@
       "details": "Details",
       "sources": "Sources"
     },
+    "parents": {
+      "label" : "Parent",
+      "label_plural": "Parents"
+    },
     "contributors": {
       "mailto": "Send mail to",
       "list": "List of contributors",

scm-ui/ui-webapp/src/repos/components/changesets/ChangesetDetails.tsx

@@ -26,7 +26,7 @@ import { Trans, useTranslation, WithTranslation, withTranslation } from "react-i
 import classNames from "classnames";
 import styled from "styled-components";
 import { ExtensionPoint } from "@scm-manager/ui-extensions";
-import { Changeset, Repository, Tag } from "@scm-manager/ui-types";
+import { Changeset, Repository, Tag, Link } from "@scm-manager/ui-types";
 import {
   AvatarImage,
   AvatarWrapper,
@@ -41,6 +41,7 @@ import {
   Icon
 } from "@scm-manager/ui-components";
 import ContributorTable from "./ContributorTable";
+import { Link as ReactLink } from "react-router-dom";
 
 type Props = WithTranslation & {
   changeset: Changeset;
@@ -51,6 +52,11 @@ type State = {
   collapsed: boolean;
 };
 
+type Parent = {
+  id: string;
+  _links: Link[];
+};
+
 const RightMarginP = styled.p`
   margin-right: 1em;
 `;
@@ -102,6 +108,18 @@ const ContributorToggleLine = styled.p`
   margin-bottom: 0.5rem !important;
 `;
 
+const ChangesetSummary = styled.div`
+  display: flex;
+  justify-content: space-between;
+`
+
+const SeparatedParents = styled.div`
+  a + a:before {
+    content: ",\\00A0";
+    color: #4a4a4a;
+  }
+`;
+
 const Contributors: FC<{ changeset: Changeset }> = ({ changeset }) => {
   const [t] = useTranslation("repos");
   const [open, setOpen] = useState(false);
@@ -148,6 +166,11 @@ class ChangesetDetails extends React.Component<Props, State> {
     const description = changesets.parseDescription(changeset.description);
     const id = <ChangesetId repository={repository} changeset={changeset} link={false} />;
     const date = <DateFromNow date={changeset.date} />;
+    const parents = changeset._embedded.parents.map((parent: Parent) => (
+      <ReactLink title={parent.id} to={parent.id}>
+        {parent.id.substring(0, 7)}
+      </ReactLink>
+    ));
 
     return (
       <>
@@ -172,9 +195,17 @@ class ChangesetDetails extends React.Component<Props, State> {
             </AvatarWrapper>
             <div className="media-content is-ellipsis-overflow">
               <Contributors changeset={changeset} />
-              <p>
-                <Trans i18nKey="repos:changeset.summary" components={[id, date]} />
-              </p>
+              <ChangesetSummary>
+                <p>
+                  <Trans i18nKey="repos:changeset.summary" components={[id, date]} />
+                </p>
+                {parents?.length > 0 && (
+                  <SeparatedParents>
+                    {t("changeset.parents.label", { count: parents?.length }) + ": "}
+                    {parents}
+                  </SeparatedParents>
+                )}
+              </ChangesetSummary>
             </div>
             <div className="media-right">{this.renderTags()}</div>
           </article>

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

@@ -53,6 +53,12 @@ class ChangesetView extends React.Component<Props> {
     fetchChangesetIfNeeded(repository, id);
   }
 
+  componentDidUpdate() {
+    const { fetchChangesetIfNeeded, repository } = this.props;
+    const id = this.props.match.params.id;
+    fetchChangesetIfNeeded(repository, id);
+  }
+
   render() {
     const { changeset, loading, error, t, repository } = this.props;