Merge

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

@@ -1,11 +1,12 @@
 import React from "react"
 import {connect} from "react-redux";
+import {ErrorNotification, Loading} from "@scm-manager/ui-components";
 
 import {
   fetchChangesetsByNamespaceAndName, fetchChangesetsByNamespaceNameAndBranch,
-  getChangesets,
+  getChangesets, getFetchChangesetsFailure, isFetchChangesetsPending,
 } from "../modules/changesets";
-import type { History } from "history";
+import type {History} from "history";
 import {fetchBranchesByNamespaceAndName, getBranchNames} from "../../repos/modules/branches";
 import type {Repository} from "@scm-manager/ui-types";
 import ChangesetTable from "../components/ChangesetTable";
@@ -23,8 +24,7 @@ type Props = {
 class Changesets extends React.Component<State, Props> {
   constructor(props) {
     super(props);
-    this.state = {
-    };
+    this.state = {};
   }
 
   componentDidMount() {
@@ -39,24 +39,35 @@ class Changesets extends React.Component<State, Props> {
   }
 
   render() {
-    const {changesets, branchNames} = this.props;
-    const branch = this.props.match.params.branch;
-    if (changesets === null) {
-      return null
-    }
-    if (branchNames) {
-      return <div>
-        <DropDown options={branchNames} preselectedOption={branch} optionSelected={branch => this.branchChanged(branch)}/>
-        <ChangesetTable changesets={changesets}/>
-      </div>;
-    } else {
-      return <ChangesetTable changesets={changesets}/>
+    const {changesets, loading, error} = this.props;
+    if (loading || !changesets) {
+      return <Loading/>
     }
+    return <div>
+      <ErrorNotification error={error}/>
+      {this.renderContent()}
+    </div>
 
   }
 
+  renderContent = () => {
+    const branch = this.props.match.params.branch;
+    const {changesets, branchNames} = this.props;
+
+    if (branchNames) {
+      return <div>
+        <DropDown options={branchNames} preselectedOption={branch}
+                  optionSelected={branch => this.branchChanged(branch)}/>
+        <ChangesetTable changesets={changesets}/>
+      </div>;
+    }
+
+    return <ChangesetTable changesets={changesets}/>
+  };
+
+
   branchChanged = (branchName: string) => {
-    const { history, repository } = this.props;
+    const {history, repository} = this.props;
     history.push(`/repo/${repository.namespace}/${repository.name}/history/${branchName}`);
   };
 }
@@ -65,8 +76,10 @@ class Changesets extends React.Component<State, Props> {
 const mapStateToProps = (state, ownProps: Props) => {
   const {namespace, name} = ownProps.repository;
   return {
-    changesets: getChangesets(namespace, name, ownProps.match.params.branch, state),
-    branchNames: getBranchNames(namespace, name, state)
+    loading: isFetchChangesetsPending(namespace, name, state),
+    changesets: getChangesets(state, namespace, name, ownProps.match.params.branch),
+    branchNames: getBranchNames(namespace, name, state),
+    error: getFetchChangesetsFailure(state, namespace, name, ownProps.match.params.branch)
   }
 };
 

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

@@ -119,7 +119,7 @@ export function getChangesetsForNamespaceAndNameFromState(namespace: string, nam
   return Object.values(state.changesets[key].byId);
 }
 
-export function getChangesets(namespace: string, name: string, branch: string, state: Object) {
+export function getChangesets(state: Object, namespace: string, name: string, branch: string) {
   const key = createItemId(namespace, name, branch);
   if (!state.changesets[key]) {
     return null;