move changesets and avatar components to ui-components

scm-ui-components/packages/ui-components/src/avatar/Avatar.js

@@ -0,0 +1,8 @@
+// @flow
+
+export type Person = {
+  name: string,
+  mail?: string
+};
+
+export const EXTENSION_POINT = "avatar.factory";

scm-ui-components/packages/ui-components/src/avatar/AvatarImage.js

@@ -1,26 +1,28 @@
 //@flow
 import React from "react";
 import {binder} from "@scm-manager/ui-extensions";
-import type {Changeset} from "@scm-manager/ui-types";
+import {Image} from "..";
-import {Image} from "@scm-manager/ui-components";
+import type { Person } from "./Avatar";
+import { EXTENSION_POINT } from "./Avatar";
+
 
 type Props = {
-  changeset: Changeset
+  person: Person
 };
 
 class AvatarImage extends React.Component<Props> {
   render() {
-    const { changeset } = this.props;
+    const { person } = this.props;
 
-    const avatarFactory = binder.getExtension("changeset.avatar-factory");
+    const avatarFactory = binder.getExtension(EXTENSION_POINT);
     if (avatarFactory) {
-      const avatar = avatarFactory(changeset);
+      const avatar = avatarFactory(person);
 
       return (
         <Image
           className="has-rounded-border"
           src={avatar}
-          alt={changeset.author.name}
+          alt={person.name}
         />
       );
     }

scm-ui-components/packages/ui-components/src/avatar/AvatarWrapper.js

@@ -1,6 +1,7 @@
 //@flow
 import * as React from "react";
 import {binder} from "@scm-manager/ui-extensions";
+import { EXTENSION_POINT } from "./Avatar";
 
 type Props = {
   children: React.Node
@@ -8,7 +9,7 @@ type Props = {
 
 class AvatarWrapper extends React.Component<Props> {
   render() {
-    if (binder.hasExtension("changeset.avatar-factory")) {
+    if (binder.hasExtension(EXTENSION_POINT)) {
       return <>{this.props.children}</>;
     }
     return null;

scm-ui-components/packages/ui-components/src/avatar/index.js

@@ -0,0 +1,4 @@
+// @flow
+
+export { default as AvatarWrapper } from "./AvatarWrapper";
+export { default as AvatarImage } from "./AvatarImage";

scm-ui-components/packages/ui-components/src/index.js

@@ -27,9 +27,11 @@ export { default as Autocomplete} from "./Autocomplete";
 
 export { apiClient, NOT_FOUND_ERROR_MESSAGE, UNAUTHORIZED_ERROR_MESSAGE } from "./apiclient.js";
 
+export * from "./avatar";
 export * from "./buttons";
 export * from "./config";
 export * from "./forms";
 export * from "./layout";
 export * from "./modals";
 export * from "./navigation";
+export * from "./repos";

scm-ui-components/packages/ui-components/src/repos/changesets/ChangesetAuthor.js

@@ -1,13 +1,12 @@
 //@flow
-
 import React from "react";
-import type { Changeset } from "@scm-manager/ui-types";
+import type {Changeset} from "@scm-manager/ui-types";
 
 type Props = {
   changeset: Changeset
 };
 
-export default class ChangesetAuthor extends React.Component<Props> {
+class ChangesetAuthor extends React.Component<Props> {
   render() {
     const { changeset } = this.props;
     if (!changeset.author) {
@@ -35,3 +34,5 @@ export default class ChangesetAuthor extends React.Component<Props> {
     }
   }
 }
+
+export default ChangesetAuthor;

scm-ui-components/packages/ui-components/src/repos/changesets/ChangesetList.js

@@ -1,8 +1,8 @@
 // @flow
 import ChangesetRow from "./ChangesetRow";
 import React from "react";
+
 import type { Changeset, Repository } from "@scm-manager/ui-types";
-import classNames from "classnames";
 
 type Props = {
   repository: Repository,
@@ -21,7 +21,7 @@ class ChangesetList extends React.Component<Props> {
         />
       );
     });
-    return <div className={classNames("box")}>{content}</div>;
+    return <div className="box">{content}</div>;
   }
 }
 

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

@@ -1,17 +1,17 @@
 //@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 {Interpolate, translate} from "react-i18next";
 import ChangesetId from "./ChangesetId";
 import injectSheet from "react-jss";
-import {DateFromNow} from "@scm-manager/ui-components";
+import {DateFromNow} from "../..";
 import ChangesetAuthor from "./ChangesetAuthor";
 import ChangesetTag from "./ChangesetTag";
-import {compose} from "redux";
+
 import {parseDescription} from "./changesets";
-import AvatarWrapper from "./AvatarWrapper";
+import {AvatarWrapper, AvatarImage} from "../../avatar";
-import AvatarImage from "./AvatarImage";
 
 const styles = {
   pointer: {
@@ -56,7 +56,7 @@ class ChangesetRow extends React.Component<Props> {
           <div>
             <figure className="media-left">
               <p className="image is-64x64">
-                <AvatarImage changeset={changeset} />
+                <AvatarImage person={changeset.author} />
               </p>
             </figure>
           </div>
@@ -95,7 +95,4 @@ class ChangesetRow extends React.Component<Props> {
   };
 }
 
-export default compose(
+export default injectSheet(styles)(translate("repos")(ChangesetRow));
-  injectSheet(styles),
-  translate("repos")
-)(ChangesetRow);

scm-ui-components/packages/ui-components/src/repos/changesets/index.js

@@ -0,0 +1,9 @@
+// @flow
+import * as changesets from "./changesets";
+export { changesets };
+
+export { default as ChangesetAuthor } from "./ChangesetAuthor";
+export { default as ChangesetId } from "./ChangesetId";
+export { default as ChangesetList } from "./ChangesetList";
+export { default as ChangesetRow } from "./ChangesetRow";
+export { default as ChangesetTag } from "./ChangesetTag";

scm-ui-components/packages/ui-components/src/repos/index.js

@@ -0,0 +1,3 @@
+// @flow
+
+export * from "./changesets";

scm-ui/src/containers/ProfileInfo.js

@@ -1,8 +1,7 @@
 // @flow
 import React from "react";
-import AvatarWrapper from "../repos/components/changesets/AvatarWrapper";
 import type { Me } from "@scm-manager/ui-types";
-import { MailLink } from "@scm-manager/ui-components";
+import { MailLink, AvatarWrapper, AvatarImage } from "@scm-manager/ui-components";
 import { compose } from "redux";
 import { translate } from "react-i18next";
 
@@ -23,9 +22,7 @@ class ProfileInfo extends React.Component<Props, State> {
           <div>
             <figure className="media-left">
               <p className="image is-64x64">
-                {
+                <AvatarImage person={ me }/>
-                  // TODO: add avatar
-                }
               </p>
             </figure>
           </div>

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

@@ -3,14 +3,18 @@ import React from "react";
 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 {
-import { parseDescription } from "./changesets";
+  DateFromNow,
-import { DateFromNow } from "@scm-manager/ui-components";
+  ChangesetId,
-import AvatarWrapper from "./AvatarWrapper";
+  ChangesetTag,
-import AvatarImage from "./AvatarImage";
+  ChangesetAuthor,
+  AvatarWrapper,
+  AvatarImage,
+  changesets
+} from "@scm-manager/ui-components";
+
 import classNames from "classnames";
-import ChangesetId from "./ChangesetId";
 import type { Tag } from "@scm-manager/ui-types";
 import ScmDiff from "../../containers/ScmDiff";
 
@@ -31,12 +35,12 @@ class ChangesetDetails extends React.Component<Props> {
   render() {
     const { changeset, repository, classes } = this.props;
 
-    const description = parseDescription(changeset.description);
+    const description = changesets.parseDescription(changeset.description);
 
     const id = (
-      <ChangesetId repository={repository} changeset={changeset} link={false} />
+      <ChangesetId repository={repository} changeset={changeset} link={false}/>
     );
-    const date = <DateFromNow date={changeset.date} />;
+    const date = <DateFromNow date={changeset.date}/>;
 
     return (
       <div>
@@ -45,12 +49,12 @@ class ChangesetDetails extends React.Component<Props> {
           <article className="media">
             <AvatarWrapper>
               <p className={classNames("image", "is-64x64", classes.spacing)}>
-                <AvatarImage changeset={changeset} />
+                <AvatarImage changeset={changeset}/>
               </p>
             </AvatarWrapper>
             <div className="media-content">
               <p>
-                <ChangesetAuthor changeset={changeset} />
+                <ChangesetAuthor changeset={changeset}/>
               </p>
               <p>
                 <Interpolate
@@ -67,14 +71,14 @@ class ChangesetDetails extends React.Component<Props> {
               return (
                 <span key={key}>
                   {item}
-                  <br />
+                  <br/>
                 </span>
               );
             })}
           </p>
         </div>
         <div>
-          <ScmDiff changeset={changeset} sideBySide={false} />
+          <ScmDiff changeset={changeset} sideBySide={false}/>
         </div>
       </div>
     );
@@ -91,7 +95,7 @@ class ChangesetDetails extends React.Component<Props> {
       return (
         <div className="level-item">
           {tags.map((tag: Tag) => {
-            return <ChangesetTag key={tag.name} tag={tag} />;
+            return <ChangesetTag key={tag.name} tag={tag}/>;
           })}
         </div>
       );

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

@@ -12,8 +12,7 @@ import {
 } from "../modules/changesets";
 
 import {connect} from "react-redux";
-import ChangesetList from "../components/changesets/ChangesetList";
+import {ErrorNotification, getPageFromMatch, LinkPaginator, ChangesetList, Loading} from "@scm-manager/ui-components";
-import {ErrorNotification, getPageFromMatch, LinkPaginator, Loading} from "@scm-manager/ui-components";
 import {compose} from "redux";
 
 type Props = {

scm-ui/src/repos/sources/containers/HistoryView.js

@@ -9,10 +9,10 @@ import type {
 import {
   ErrorNotification,
   Loading,
-  StatePaginator
+  StatePaginator,
+  ChangesetList
 } from "@scm-manager/ui-components";
 import { getHistory } from "./history";
-import ChangesetList from "../../components/changesets/ChangesetList";
 
 type Props = {
   file: File,