merge 2.0.0-m3

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

@@ -1,8 +1,8 @@
 //@flow
 import React from "react";
-import { binder } from "@scm-manager/ui-extensions";
-import type { Changeset } from "@scm-manager/ui-types";
-import { Image } from "@scm-manager/ui-components";
+import {binder} from "@scm-manager/ui-extensions";
+import type {Changeset} from "@scm-manager/ui-types";
+import {Image} from "@scm-manager/ui-components";
 
 type Props = {
   changeset: Changeset

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

@@ -1,6 +1,6 @@
 //@flow
 import * as React from "react";
-import { binder } from "@scm-manager/ui-extensions";
+import {binder} from "@scm-manager/ui-extensions";
 
 type Props = {
   children: React.Node

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

@@ -1,20 +1,18 @@
 //@flow
 import React from "react";
-import type {
-  Changeset,
-  Repository
-} from "../../../../../scm-ui-components/packages/ui-types/src/index";
+import type { Changeset, Repository } from "@scm-manager/ui-types";
 import { Interpolate, translate } from "react-i18next";
 import injectSheet from "react-jss";
 import ChangesetTag from "./ChangesetTag";
 import ChangesetAuthor from "./ChangesetAuthor";
 import { parseDescription } from "./changesets";
-import { DateFromNow } from "../../../../../scm-ui-components/packages/ui-components/src/index";
+import { DateFromNow } from "@scm-manager/ui-components";
 import AvatarWrapper from "./AvatarWrapper";
 import AvatarImage from "./AvatarImage";
 import classNames from "classnames";
 import ChangesetId from "./ChangesetId";
 import type { Tag } from "@scm-manager/ui-types";
+import ScmDiff from "../../containers/ScmDiff";
 
 const styles = {
   spacing: {
@@ -41,38 +39,43 @@ class ChangesetDetails extends React.Component<Props> {
     const date = <DateFromNow date={changeset.date} />;
 
     return (
-      <div className="content">
-        <h4>{description.title}</h4>
-        <article className="media">
-          <AvatarWrapper>
-            <p className={classNames("image", "is-64x64", classes.spacing)}>
-              <AvatarImage changeset={changeset} />
-            </p>
-          </AvatarWrapper>
-          <div className="media-content">
-            <p>
-              <ChangesetAuthor changeset={changeset} />
-            </p>
-            <p>
-              <Interpolate
-                i18nKey="changesets.changeset.summary"
-                id={id}
-                time={date}
-              />
-            </p>
-          </div>
-          <div className="media-right">{this.renderTags()}</div>
-        </article>
-        <p>
-          {description.message.split("\n").map((item, key) => {
-            return (
-              <span key={key}>
-                {item}
-                <br />
-              </span>
-            );
-          })}
-        </p>
+      <div>
+        <div className="content">
+          <h4>{description.title}</h4>
+          <article className="media">
+            <AvatarWrapper>
+              <p className={classNames("image", "is-64x64", classes.spacing)}>
+                <AvatarImage changeset={changeset} />
+              </p>
+            </AvatarWrapper>
+            <div className="media-content">
+              <p>
+                <ChangesetAuthor changeset={changeset} />
+              </p>
+              <p>
+                <Interpolate
+                  i18nKey="changesets.changeset.summary"
+                  id={id}
+                  time={date}
+                />
+              </p>
+            </div>
+            <div className="media-right">{this.renderTags()}</div>
+          </article>
+          <p>
+            {description.message.split("\n").map((item, key) => {
+              return (
+                <span key={key}>
+                  {item}
+                  <br />
+                </span>
+              );
+            })}
+          </p>
+        </div>
+        <div>
+          <ScmDiff changeset={changeset} sideBySide={false} />
+        </div>
       </div>
     );
   }

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

@@ -1,8 +1,8 @@
 //@flow
 
-import { Link } from "react-router-dom";
+import {Link} from "react-router-dom";
 import React from "react";
-import type { Repository, Changeset } from "@scm-manager/ui-types";
+import type {Changeset, Repository} from "@scm-manager/ui-types";
 
 type Props = {
   repository: Repository,

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

@@ -1,15 +1,15 @@
 //@flow
 import React from "react";
-import type { Changeset, Repository, Tag } from "@scm-manager/ui-types";
+import type {Changeset, Repository, Tag} from "@scm-manager/ui-types";
 import classNames from "classnames";
-import { translate, Interpolate } from "react-i18next";
+import {Interpolate, translate} from "react-i18next";
 import ChangesetId from "./ChangesetId";
 import injectSheet from "react-jss";
-import { DateFromNow } from "@scm-manager/ui-components";
+import {DateFromNow} from "@scm-manager/ui-components";
 import ChangesetAuthor from "./ChangesetAuthor";
 import ChangesetTag from "./ChangesetTag";
-import { compose } from "redux";
-import { parseDescription } from "./changesets";
+import {compose} from "redux";
+import {parseDescription} from "./changesets";
 import AvatarWrapper from "./AvatarWrapper";
 import AvatarImage from "./AvatarImage";
 

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

@@ -1,6 +1,6 @@
 // @flow
 
-import { parseDescription } from "./changesets";
+import {parseDescription} from "./changesets";
 
 describe("parseDescription tests", () => {
   it("should return a description with title and message", () => {

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

@@ -11,7 +11,7 @@ import {
 } from "../modules/changesets";
 import ChangesetDetails from "../components/changesets/ChangesetDetails";
 import { translate } from "react-i18next";
-import { Loading, ErrorPage } from "@scm-manager/ui-components";
+import { ErrorPage, Loading } from "@scm-manager/ui-components";
 
 type Props = {
   id: string,

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

@@ -1,13 +1,8 @@
 // @flow
 
 import React from "react";
-import { withRouter } from "react-router-dom";
-import type {
-  Branch,
-  Changeset,
-  PagedCollection,
-  Repository
-} from "@scm-manager/ui-types";
+import {withRouter} from "react-router-dom";
+import type {Branch, Changeset, PagedCollection, Repository} from "@scm-manager/ui-types";
 import {
   fetchChangesets,
   getChangesets,
@@ -16,15 +11,10 @@ import {
   selectListAsCollection
 } from "../modules/changesets";
 
-import { connect } from "react-redux";
+import {connect} from "react-redux";
 import ChangesetList from "../components/changesets/ChangesetList";
-import {
-  ErrorNotification,
-  LinkPaginator,
-  Loading,
-  getPageFromMatch
-} from "@scm-manager/ui-components";
-import { compose } from "redux";
+import {ErrorNotification, getPageFromMatch, LinkPaginator, Loading} from "@scm-manager/ui-components";
+import {compose} from "redux";
 
 type Props = {
   repository: Repository,

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

@@ -80,11 +80,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?.*`);
@@ -125,7 +120,7 @@ class RepositoryRoot extends React.Component<Props> {
               />
               <Route
                 path={`${url}/permissions`}
-                render={props => (
+                render={() => (
                   <Permissions
                     namespace={this.props.repository.namespace}
                     repoName={this.props.repository.name}

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

@@ -0,0 +1,51 @@
+// @flow
+
+import React from "react";
+import { apiClient } from "@scm-manager/ui-components";
+import type { Changeset } from "@scm-manager/ui-types";
+import { Diff2Html } from "diff2html";
+
+type Props = {
+  changeset: Changeset,
+  sideBySide: boolean
+};
+
+type State = {
+  diff: string,
+  error?: Error
+};
+
+class ScmDiff extends React.Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = { diff: "" };
+  }
+
+  componentDidMount() {
+    const { changeset } = this.props;
+    const url = changeset._links.diff.href+"?format=GIT";
+    apiClient
+      .get(url)
+      .then(response => response.text())
+      .then(text => this.setState({ ...this.state, diff: text }))
+      .catch(error => this.setState({ ...this.state, error }));
+  }
+
+  render() {
+    const options = {
+      inputFormat: "diff",
+      outputFormat: this.props.sideBySide ? "side-by-side" : "line-by-line",
+      showFiles: false,
+      matching: "lines"
+    };
+
+    const outputHtml = Diff2Html.getPrettyHtml(this.state.diff, options);
+
+    return (
+      // eslint-disable-next-line react/no-danger
+      <div dangerouslySetInnerHTML={{ __html: outputHtml }} />
+    );
+  }
+}
+
+export default ScmDiff;

scm-ui/src/repos/modules/changesets.js

@@ -1,19 +1,10 @@
 // @flow
 
-import {
-  FAILURE_SUFFIX,
-  PENDING_SUFFIX,
-  SUCCESS_SUFFIX
-} from "../../modules/types";
-import { apiClient, urls } from "@scm-manager/ui-components";
-import { isPending } from "../../modules/pending";
-import { getFailure } from "../../modules/failure";
-import type {
-  Action,
-  Branch,
-  PagedCollection,
-  Repository
-} from "@scm-manager/ui-types";
+import {FAILURE_SUFFIX, PENDING_SUFFIX, SUCCESS_SUFFIX} from "../../modules/types";
+import {apiClient, urls} from "@scm-manager/ui-components";
+import {isPending} from "../../modules/pending";
+import {getFailure} from "../../modules/failure";
+import type {Action, Branch, PagedCollection, Repository} from "@scm-manager/ui-types";
 
 export const FETCH_CHANGESETS = "scm/repos/FETCH_CHANGESETS";
 export const FETCH_CHANGESETS_PENDING = `${FETCH_CHANGESETS}_${PENDING_SUFFIX}`;

scm-ui/src/repos/modules/changesets.test.js

@@ -4,27 +4,27 @@ import configureMockStore from "redux-mock-store";
 import thunk from "redux-thunk";
 import fetchMock from "fetch-mock";
 import reducer, {
-  FETCH_CHANGESETS,
-  FETCH_CHANGESETS_FAILURE,
-  FETCH_CHANGESETS_PENDING,
-  FETCH_CHANGESETS_SUCCESS,
   FETCH_CHANGESET,
   FETCH_CHANGESET_FAILURE,
   FETCH_CHANGESET_PENDING,
   FETCH_CHANGESET_SUCCESS,
+  FETCH_CHANGESETS,
+  FETCH_CHANGESETS_FAILURE,
+  FETCH_CHANGESETS_PENDING,
+  FETCH_CHANGESETS_SUCCESS,
+  fetchChangeset,
+  fetchChangesetIfNeeded,
   fetchChangesets,
   fetchChangesetsSuccess,
-  getChangesets,
-  getFetchChangesetsFailure,
-  isFetchChangesetsPending,
-  fetchChangeset,
-  getChangeset,
-  fetchChangesetIfNeeded,
-  shouldFetchChangeset,
-  isFetchChangesetPending,
-  getFetchChangesetFailure,
   fetchChangesetSuccess,
-  selectListAsCollection
+  getChangeset,
+  getChangesets,
+  getFetchChangesetFailure,
+  getFetchChangesetsFailure,
+  isFetchChangesetPending,
+  isFetchChangesetsPending,
+  selectListAsCollection,
+  shouldFetchChangeset
 } from "./changesets";
 
 const branch = {

scm-ui/src/repos/permissions/components/CreatePermissionForm.js

@@ -1,12 +1,9 @@
 // @flow
 import React from "react";
-import { translate } from "react-i18next";
-import { Checkbox, InputField, SubmitButton } from "@scm-manager/ui-components";
+import {translate} from "react-i18next";
+import {Checkbox, InputField, SubmitButton} from "@scm-manager/ui-components";
 import TypeSelector from "./TypeSelector";
-import type {
-  PermissionCollection,
-  PermissionCreateEntry
-} from "@scm-manager/ui-types";
+import type {PermissionCollection, PermissionCreateEntry} from "@scm-manager/ui-types";
 import * as validator from "./permissionValidation";
 
 type Props = {

scm-ui/src/repos/permissions/components/permissionValidation.js

@@ -1,6 +1,7 @@
 // @flow
-import { validation } from "@scm-manager/ui-components";
-import type { PermissionCollection } from "@scm-manager/ui-types";
+import {validation} from "@scm-manager/ui-components";
+import type {PermissionCollection} from "@scm-manager/ui-types";
+
 const isNameValid = validation.isNameValid;
 
 export { isNameValid };

scm-ui/src/repos/permissions/modules/permissions.js

@@ -1,16 +1,12 @@
 // @flow
 
-import { apiClient } from "@scm-manager/ui-components";
+import type {Action} from "@scm-manager/ui-components";
+import {apiClient} from "@scm-manager/ui-components";
 import * as types from "../../../modules/types";
-import type { Action } from "@scm-manager/ui-components";
-import type {
-  PermissionCollection,
-  Permission,
-  PermissionCreateEntry
-} from "@scm-manager/ui-types";
-import { isPending } from "../../../modules/pending";
-import { getFailure } from "../../../modules/failure";
-import { Dispatch } from "redux";
+import type {Permission, PermissionCollection, PermissionCreateEntry} from "@scm-manager/ui-types";
+import {isPending} from "../../../modules/pending";
+import {getFailure} from "../../../modules/failure";
+import {Dispatch} from "redux";
 
 export const FETCH_PERMISSIONS = "scm/permissions/FETCH_PERMISSIONS";
 export const FETCH_PERMISSIONS_PENDING = `${FETCH_PERMISSIONS}_${

scm-ui/src/repos/permissions/modules/permissions.test.js

@@ -3,44 +3,44 @@ import configureMockStore from "redux-mock-store";
 import thunk from "redux-thunk";
 import fetchMock from "fetch-mock";
 import reducer, {
-  fetchPermissions,
-  fetchPermissionsSuccess,
-  getPermissionsOfRepo,
-  isFetchPermissionsPending,
-  getFetchPermissionsFailure,
-  modifyPermission,
-  modifyPermissionSuccess,
-  getModifyPermissionFailure,
-  isModifyPermissionPending,
-  createPermission,
-  hasCreatePermission,
-  deletePermission,
-  deletePermissionSuccess,
-  getDeletePermissionFailure,
-  isDeletePermissionPending,
-  getModifyPermissionsFailure,
-  MODIFY_PERMISSION_FAILURE,
-  MODIFY_PERMISSION_PENDING,
-  FETCH_PERMISSIONS,
-  FETCH_PERMISSIONS_PENDING,
-  FETCH_PERMISSIONS_SUCCESS,
-  FETCH_PERMISSIONS_FAILURE,
-  MODIFY_PERMISSION_SUCCESS,
-  MODIFY_PERMISSION,
+  CREATE_PERMISSION,
+  CREATE_PERMISSION_FAILURE,
   CREATE_PERMISSION_PENDING,
   CREATE_PERMISSION_SUCCESS,
-  CREATE_PERMISSION_FAILURE,
+  createPermission,
+  createPermissionSuccess,
   DELETE_PERMISSION,
+  DELETE_PERMISSION_FAILURE,
   DELETE_PERMISSION_PENDING,
   DELETE_PERMISSION_SUCCESS,
-  DELETE_PERMISSION_FAILURE,
-  CREATE_PERMISSION,
-  createPermissionSuccess,
+  deletePermission,
+  deletePermissionSuccess,
+  FETCH_PERMISSIONS,
+  FETCH_PERMISSIONS_FAILURE,
+  FETCH_PERMISSIONS_PENDING,
+  FETCH_PERMISSIONS_SUCCESS,
+  fetchPermissions,
+  fetchPermissionsSuccess,
   getCreatePermissionFailure,
+  getDeletePermissionFailure,
+  getDeletePermissionsFailure,
+  getFetchPermissionsFailure,
+  getModifyPermissionFailure,
+  getModifyPermissionsFailure,
+  getPermissionsOfRepo,
+  hasCreatePermission,
   isCreatePermissionPending,
-  getDeletePermissionsFailure
+  isDeletePermissionPending,
+  isFetchPermissionsPending,
+  isModifyPermissionPending,
+  MODIFY_PERMISSION,
+  MODIFY_PERMISSION_FAILURE,
+  MODIFY_PERMISSION_PENDING,
+  MODIFY_PERMISSION_SUCCESS,
+  modifyPermission,
+  modifyPermissionSuccess
 } from "./permissions";
-import type { Permission, PermissionCollection } from "@scm-manager/ui-types";
+import type {Permission, PermissionCollection} from "@scm-manager/ui-types";
 
 const hitchhiker_puzzle42Permission_user_eins: Permission = {
   name: "user_eins",