Fixed issues preventing paged changeset list to be accessed via URL

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

@@ -1,9 +1,11 @@
 // @flow
 
 import React from "react";
-import type { Repository } from "@scm-manager/ui-types";
-import { connect } from "react-redux";
-import { fetchBranches, getBranch, getBranches } from "../modules/branches";
+import type {Repository} from "@scm-manager/ui-types";
+import {connect} from "react-redux";
+import {fetchBranches, getBranches, isFetchBranchesPending} from "../modules/branches";
+
+import {Loading} from "@scm-manager/ui-components";
 import DropDown from "../components/DropDown";
 
 type Props = {
@@ -11,7 +13,8 @@ type Props = {
   fetchBranches: Repository => void,
   callback: Branch => void, //TODO use correct branch type
   branches: Branch[], //TODO use correct branch type
-  selectedBranchName: string
+  selectedBranchName: string,
+  loading: boolean
 };
 
 type State = {
@@ -32,8 +35,11 @@ class BranchChooser extends React.Component<Props, State> {
   }
 
   render() {
-    const { branches } = this.props;
-    if (branches) {
+    const { branches, loading } = this.props;
+    if (loading) {
+      return <Loading />;
+    }
+    if (branches && branches.length > 0) {
       return (
         <DropDown
           options={branches.map(b => b.name)}
@@ -56,7 +62,8 @@ class BranchChooser extends React.Component<Props, State> {
 
 const mapStateToProps = (state: State, ownProps: Props) => {
   return {
-    branches: getBranches(state, ownProps.repository)
+    branches: getBranches(state, ownProps.repository),
+    loading: isFetchBranchesPending(state, ownProps.repository)
   };
 };
 

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

@@ -1,12 +1,8 @@
 // @flow
 import React from "react";
-import { connect } from "react-redux";
-import { translate } from "react-i18next";
-import {
-  ErrorNotification,
-  Loading,
-  Paginator
-} from "@scm-manager/ui-components";
+import {connect} from "react-redux";
+import {translate} from "react-i18next";
+import {ErrorNotification, Loading, Paginator} from "@scm-manager/ui-components";
 
 import {
   fetchChangesets,
@@ -18,15 +14,11 @@ import {
   isFetchChangesetsPending,
   selectListAsCollection
 } from "../modules/changesets";
-import type { History } from "history";
-import type {
-  Changeset,
-  PagedCollection,
-  Repository
-} from "@scm-manager/ui-types";
+import type {History} from "history";
+import type {Changeset, PagedCollection, Repository} from "@scm-manager/ui-types";
 import ChangesetList from "../components/changesets/ChangesetList";
-import { withRouter } from "react-router-dom";
-import { fetchBranches, getBranch, getBranchNames } from "../modules/branches";
+import {withRouter} from "react-router-dom";
+import {fetchBranches, getBranch, getBranchNames} from "../modules/branches";
 import BranchChooser from "./BranchChooser";
 
 type Props = {
@@ -94,23 +86,25 @@ class Changesets extends React.PureComponent<Props, State> {
     const { namespace, name } = repository;
     const branch = match.params.branch;
 
-    if (branch !== prevState.branch) {
-      this.updateContent();
-      this.setState({ branch });
-    }
+    if (!this.props.loading) {
+      if (prevProps.branch !== this.props.branch) {
+        this.updateContent();
+        this.setState({ branch });
+      }
 
-    if (list && (list.page || list.page === 0)) {
-      // backend starts paging at 0
-      const statePage: number = list.page + 1;
-      if (page !== statePage) {
-        if (branch) {
-          this.props.history.push(
-            `/repo/${namespace}/${name}/${branch}/history/${statePage}`
-          );
-        } else {
-          this.props.history.push(
-            `/repo/${namespace}/${name}/history/${statePage}`
-          );
+      if (list && (list.page || list.page === 0)) {
+        // backend starts paging at 0
+        const statePage: number = list.page + 1;
+        if (page !== statePage) {
+          if (branch) {
+            this.props.history.push(
+              `/repo/${namespace}/${name}/${branch}/history/${statePage}`
+            );
+          } else {
+            this.props.history.push(
+              `/repo/${namespace}/${name}/history/${statePage}`
+            );
+          }
         }
       }
     }

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

@@ -6,6 +6,7 @@ import {
 } from "../../modules/types";
 import { apiClient } from "@scm-manager/ui-components";
 import type { Repository } from "@scm-manager/ui-types";
+import { isPending } from "../../modules/pending";
 
 export const FETCH_BRANCHES = "scm/repos/FETCH_BRANCHES";
 export const FETCH_BRANCHES_PENDING = `${FETCH_BRANCHES}_${PENDING_SUFFIX}`;
@@ -123,6 +124,10 @@ export function getBranch(state: Object, repository: Repository, name: string) {
   return undefined;
 }
 
+export function isFetchBranchesPending(state: Object, repository: Repository) {
+  return isPending(state, FETCH_BRANCHES, createKey(repository));
+}
+
 function createKey(repository: Repository) {
   const { namespace, name } = repository;
   return `${namespace}/${name}`;

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

@@ -2,13 +2,15 @@ import configureMockStore from "redux-mock-store";
 import thunk from "redux-thunk";
 import fetchMock from "fetch-mock";
 import reducer, {
+  FETCH_BRANCHES,
   FETCH_BRANCHES_FAILURE,
   FETCH_BRANCHES_PENDING,
   FETCH_BRANCHES_SUCCESS,
   fetchBranches,
   getBranch,
   getBranches,
-  getBranchNames
+  getBranchNames,
+  isFetchBranchesPending
 } from "./branches";
 
 const namespace = "foo";
@@ -138,6 +140,16 @@ describe("branches", () => {
       }
     };
 
+    it("should return true, when fetching branches is pending", () => {
+      const state = {
+        pending: {
+          [FETCH_BRANCHES + "/foo/bar"]: true
+        }
+      };
+
+      expect(isFetchBranchesPending(state, repository)).toBeTruthy();
+    });
+
     it("should return branches names", () => {
       const names = getBranchNames(state, repository);
       expect(names.length).toEqual(2);

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

@@ -1,20 +1,11 @@
 // @flow
 
-import {
-  FAILURE_SUFFIX,
-  PENDING_SUFFIX,
-  SUCCESS_SUFFIX
-} from "../../modules/types";
-import { apiClient } from "@scm-manager/ui-components";
-import { isPending } from "../../modules/pending";
-import { getFailure } from "../../modules/failure";
-import { combineReducers } from "redux";
-import type {
-  Action,
-  Changeset,
-  PagedCollection,
-  Repository
-} from "@scm-manager/ui-types";
+import {FAILURE_SUFFIX, PENDING_SUFFIX, SUCCESS_SUFFIX} from "../../modules/types";
+import {apiClient} from "@scm-manager/ui-components";
+import {isPending} from "../../modules/pending";
+import {getFailure} from "../../modules/failure";
+import {combineReducers} from "redux";
+import type {Action, Changeset, PagedCollection, Repository} from "@scm-manager/ui-types";
 
 export const FETCH_CHANGESETS = "scm/repos/FETCH_CHANGESETS";
 export const FETCH_CHANGESETS_PENDING = `${FETCH_CHANGESETS}_${PENDING_SUFFIX}`;
@@ -165,6 +156,7 @@ function byKeyReducer(
       }
       const byIds = extractChangesetsByIds(changesets, oldChangesets[key].byId);
       return {
+        ...state,
         [key]: {
           byId: { ...byIds },
           list: {