Added types, components and logic for changesets

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

@@ -0,0 +1,21 @@
+import React from "react"
+import type { Changeset } from "@scm-manager/ui-types"
+
+type Props = {
+  changeset: Changeset
+}
+
+class ChangesetRow extends React.Component<Props> {
+
+  // Todo: Add extension point to author field
+  render() {
+    const {changeset} = this.props;
+    return <tr>
+      <td>{ changeset.author.name }</td>
+      <td>{ changeset.description }</td>
+      <td>{ changeset.date }</td>
+    </tr>
+  }
+}
+
+export default ChangesetRow;

scm-ui/src/changesets/components/Changesets.js

@@ -0,0 +1,59 @@
+import React from "react"
+import { connect } from "react-redux";
+import ChangesetRow from "./ChangesetRow";
+import type {Changeset} from "@scm-manager/ui-types";
+
+import { fetchChangesetsByNamespaceAndName, getChangesetsForNameAndNamespaceFromState } from "../modules/changesets";
+import { translate } from "react-i18next";
+
+type Props = {
+  changesets: Changeset[],
+  t: string => string
+}
+
+class Changesets extends React.Component<Props> {
+  componentDidMount() {
+    const {namespace, name} = this.props.repository;
+    this.props.fetchChangesetsByNamespaceAndName(namespace, name);
+  }
+
+  render() {
+    const { t, changesets } = this.props;
+    if (!changesets) {
+      return null;
+    }
+    return <table className="table is-hoverable is-fullwidth">
+      <thead>
+      <tr>
+        <th>{t("author.name")}</th>
+        <th>{t("changeset.description")}</th>
+        <th className="is-hidden-mobile">{t("changeset.date")}</th>
+      </tr>
+      </thead>
+      <tbody>
+      {changesets.map((changeset, index) => {
+        return <ChangesetRow key={index} changeset={changeset} />;
+      })}
+      </tbody>
+    </table>
+  }
+}
+
+const mapStateToProps = (state, ownProps) => {
+  return {
+    changesets: getChangesetsForNameAndNamespaceFromState(ownProps.repository.namespace, ownProps.repository.name, state)
+  }
+};
+
+const mapDispatchToProps = dispatch => {
+  return {
+    fetchChangesetsByNamespaceAndName: (namespace: string, name: string) => {
+      dispatch(fetchChangesetsByNamespaceAndName(namespace, name))
+    }
+  }
+};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(translate("changesets")(Changesets));