Moved DiffView into ChangesetDetails

scm-ui/src/repos/components/changesets/ChangesetDetails.js

@@ -12,6 +12,7 @@ import AvatarImage from "./AvatarImage";
 import classNames from "classnames";
 import ChangesetId from "./ChangesetId";
 import type {Tag} from "@scm-manager/ui-types";
+import DiffView from "../../containers/DiffView";
 
 const styles = {
   spacing: {
@@ -70,6 +71,8 @@ class ChangesetDetails extends React.Component<Props> {
             );
           })}
         </p>
+
+        <DiffView changeset={changeset} sideBySide={false} />
       </div>
     );
   }

scm-ui/src/repos/containers/DiffView.js

@@ -1,15 +1,12 @@
 // @flow
 
 import React from "react";
-import { Diff, Hunk, parseDiff } from "react-diff-view";
 import { apiClient } from "@scm-manager/ui-components";
-import type { Repository } from "@scm-manager/ui-types";
+import type { Changeset } from "@scm-manager/ui-types";
 import { Diff2Html } from "diff2html";
 
 type Props = {
-  //TODO: Actually, we want the Changeset here
-  repository: Repository,
-  revision: string,
+  changeset: Changeset,
   sideBySide: boolean
 };
 
@@ -25,9 +22,8 @@ class ScmDiff extends React.Component<Props, State> {
   }
 
   componentDidMount() {
-    const { repository, revision } = this.props;
-    const { namespace, name } = repository;
-    const url = `/repositories/${namespace}/${name}/diff/${revision}`; //TODO: use HATEOAS link from changeset
+    const { changeset } = this.props;
+    const url = changeset._links.diff.href;
     apiClient
       .get(url)
       .then(response => response.text())
@@ -49,25 +45,6 @@ class ScmDiff extends React.Component<Props, State> {
       // eslint-disable-next-line react/no-danger
       <div dangerouslySetInnerHTML={{ __html: outputHtml }} />
     );
-    // if (!this.state.diff) {
-    //   return null;
-    // }
-    //
-    // const files = parseDiff(this.state.diff);
-    //
-    // const renderFile = ({ newPath, oldRevision, newRevision, type, hunks }) => (
-    //   <div>
-    //     <div> File: {newPath} </div>
-    //     <Diff
-    //       key={oldRevision + "-" + newRevision}
-    //       diffType={type}
-    //       hunks={hunks}
-    //       viewType="unified"
-    //     />
-    //   </div>
-    // );
-    //
-    // return <div>{files.map(renderFile)}</div>;
   }
 }
 

scm-ui/src/repos/containers/RepositoryRoot.js

@@ -19,7 +19,6 @@ import EditNavLink from "../components/EditNavLink";
 import BranchRoot from "./BranchRoot";
 import ChangesetView from "./ChangesetView";
 import PermissionsNavLink from "../components/PermissionsNavLink";
-import ScmDiff from "./ScmDiff";
 
 type Props = {
   namespace: string,
@@ -64,11 +63,6 @@ class RepositoryRoot extends React.Component<Props> {
     this.props.deleteRepo(repository, this.deleted);
   };
 
-  matchChangeset = (route: any) => {
-    const url = this.matchedUrl();
-    return route.location.pathname.match(`${url}/changeset/`);
-  };
-
   matches = (route: any) => {
     const url = this.matchedUrl();
     const regex = new RegExp(`${url}(/branches)?/?[^/]*/changesets?.*`);
@@ -141,16 +135,6 @@ class RepositoryRoot extends React.Component<Props> {
                   />
                 )}
               />
-              <Route
-                path={`${url}/diff`}
-                component={() => (
-                  <ScmDiff
-                    repository={repository}
-                    revision={"a801749dc445d9d71e3fe4c50241433a2adfba6a"} // TODO: this is hardcoded only for dev purposes.
-                    sideBySide={false}
-                  />
-                )}
-              />
             </Switch>
           </div>
           <div className="column">
@@ -173,9 +157,6 @@ class RepositoryRoot extends React.Component<Props> {
                 <DeleteNavAction repository={repository} delete={this.delete} />
                 <NavLink to="/repos" label={t("repository-root.back-label")} />
               </Section>
-              <Section label="Diff">
-                <NavLink to={`${url}/diff`} label="Diff" />
-              </Section>
             </Navigation>
           </div>
         </div>