From b1ffb0a5628f6d8bdd34cd0582f1a89ff7ddbfa1 Mon Sep 17 00:00:00 2001
From: Philipp Czora <philipp.czora@cloudogu.com>
Date: Mon, 17 Sep 2018 17:20:17 +0200
Subject: [PATCH 1/2] Added loading spinner to Changesets

---
 scm-ui/src/changesets/containers/Changesets.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/scm-ui/src/changesets/containers/Changesets.js b/scm-ui/src/changesets/containers/Changesets.js
index 48e95dd5d6..42a0efbb34 100644
--- a/scm-ui/src/changesets/containers/Changesets.js
+++ b/scm-ui/src/changesets/containers/Changesets.js
@@ -1,9 +1,10 @@
 import React from "react"
 import {connect} from "react-redux";
+import {Loading} from "@scm-manager/ui-components";
 
 import {
   fetchChangesetsByNamespaceAndName, fetchChangesetsByNamespaceNameAndBranch,
-  getChangesets,
+  getChangesets, isFetchChangesetsPending,
 } from "../modules/changesets";
 import type { History } from "history";
 import {fetchBranchesByNamespaceAndName, getBranchNames} from "../../repos/modules/branches";
@@ -39,10 +40,10 @@ class Changesets extends React.Component<State, Props> {
   }
 
   render() {
-    const {changesets, branchNames} = this.props;
+    const {changesets, branchNames, loading} = this.props;
     const branch = this.props.match.params.branch;
-    if (changesets === null) {
-      return null
+    if (loading || !changesets) {
+      return <Loading />
     }
     if (branchNames) {
       return <div>
@@ -65,7 +66,8 @@ 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),
+    loading: isFetchChangesetsPending(namespace, name, state),
+    changesets: getChangesets(state, namespace, name, ownProps.match.params.branch),
     branchNames: getBranchNames(namespace, name, state)
   }
 };

From a34dad585ee0ac49e22dbfa1d99e737c48438d24 Mon Sep 17 00:00:00 2001
From: Philipp Czora <philipp.czora@cloudogu.com>
Date: Tue, 18 Sep 2018 09:22:08 +0200
Subject: [PATCH 2/2] Added displaying of errors in changesets

---
 .../src/changesets/containers/Changesets.js   | 47 ++++++++++++-------
 scm-ui/src/changesets/modules/changesets.js   |  2 +-
 2 files changed, 30 insertions(+), 19 deletions(-)

diff --git a/scm-ui/src/changesets/containers/Changesets.js b/scm-ui/src/changesets/containers/Changesets.js
index 42a0efbb34..64b56fa559 100644
--- a/scm-ui/src/changesets/containers/Changesets.js
+++ b/scm-ui/src/changesets/containers/Changesets.js
@@ -1,12 +1,12 @@
 import React from "react"
 import {connect} from "react-redux";
-import {Loading} from "@scm-manager/ui-components";
+import {ErrorNotification, Loading} from "@scm-manager/ui-components";
 
 import {
   fetchChangesetsByNamespaceAndName, fetchChangesetsByNamespaceNameAndBranch,
-  getChangesets, isFetchChangesetsPending,
+  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";
@@ -24,8 +24,7 @@ type Props = {
 class Changesets extends React.Component<State, Props> {
   constructor(props) {
     super(props);
-    this.state = {
-    };
+    this.state = {};
   }
 
   componentDidMount() {
@@ -40,24 +39,35 @@ class Changesets extends React.Component<State, Props> {
   }
 
   render() {
-    const {changesets, branchNames, loading} = this.props;
-    const branch = this.props.match.params.branch;
+    const {changesets, loading, error} = this.props;
     if (loading || !changesets) {
-      return <Loading />
-    }
-    if (branchNames) {
-      return <div>
-        <DropDown options={branchNames} preselectedOption={branch} optionSelected={branch => this.branchChanged(branch)}/>
-        <ChangesetTable changesets={changesets}/>
-      </div>;
-    } else {
-      return <ChangesetTable changesets={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}`);
   };
 }
@@ -68,7 +78,8 @@ const mapStateToProps = (state, ownProps: Props) => {
   return {
     loading: isFetchChangesetsPending(namespace, name, state),
     changesets: getChangesets(state, namespace, name, ownProps.match.params.branch),
-    branchNames: getBranchNames(namespace, name, state)
+    branchNames: getBranchNames(namespace, name, state),
+    error: getFetchChangesetsFailure(state, namespace, name, ownProps.match.params.branch)
   }
 };
 
diff --git a/scm-ui/src/changesets/modules/changesets.js b/scm-ui/src/changesets/modules/changesets.js
index e5f41fda20..498f6b3aea 100644
--- a/scm-ui/src/changesets/modules/changesets.js
+++ b/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;