fix re-render bug for changesets

scm-ui/ui-webapp/src/repos/modules/changesets.test.ts

@@ -581,6 +581,31 @@ describe("changesets", () => {
       ]);
     });
 
+    it("should return always the same changeset array for the given parameters", () => {
+      const state = {
+        changesets: {
+          "foo/bar": {
+            byId: {
+              id2: {
+                id: "id2"
+              },
+              id1: {
+                id: "id1"
+              }
+            },
+            byBranch: {
+              "": {
+                entries: ["id1", "id2"]
+              }
+            }
+          }
+        }
+      };
+      const one = getChangesets(state, repository);
+      const two = getChangesets(state, repository);
+      expect(one).toBe(two);
+    });
+
     it("should return true, when fetching changesets is pending", () => {
       const state = {
         pending: {
@@ -639,5 +664,14 @@ describe("changesets", () => {
       expect(collection.page).toBe(1);
       expect(collection.pageTotal).toBe(10);
     });
+
+    it("should return always the same empty object", () => {
+      const state = {
+        changesets: {}
+      };
+      const one = selectListAsCollection(state, repository);
+      const two = selectListAsCollection(state, repository);
+      expect(one).toBe(two);
+    });
   });
 });

scm-ui/ui-webapp/src/repos/modules/changesets.ts

@@ -3,6 +3,7 @@ import { apiClient, urls } from "@scm-manager/ui-components";
 import { isPending } from "../../modules/pending";
 import { getFailure } from "../../modules/failure";
 import { Action, Branch, PagedCollection, Repository } from "@scm-manager/ui-types";
+import memoizeOne from "memoize-one";
 
 export const FETCH_CHANGESETS = "scm/repos/FETCH_CHANGESETS";
 export const FETCH_CHANGESETS_PENDING = `${FETCH_CHANGESETS}_${PENDING_SUFFIX}`;
@@ -254,10 +255,15 @@ export function getChangesets(state: object, repository: Repository, branch?: Br
     return null;
   }
 
+  return collectChangesets(stateRoot, changesets);
+}
+const mapChangesets = (stateRoot, changesets) => {
   return changesets.entries.map((id: string) => {
     return stateRoot.byId[id];
   });
-}
+};
+
+const collectChangesets = memoizeOne(mapChangesets);
 
 export function getChangeset(state: object, repository: Repository, id: string) {
   const key = createItemId(repository);
@@ -291,6 +297,8 @@ export function getFetchChangesetsFailure(state: object, repository: Repository,
   return getFailure(state, FETCH_CHANGESETS, createItemId(repository, branch));
 }
 
+const EMPTY = {};
+
 const selectList = (state: object, repository: Repository, branch?: Branch) => {
   const repoId = createItemId(repository);
 
@@ -302,7 +310,7 @@ const selectList = (state: object, repository: Repository, branch?: Branch) => {
       return repoState.byBranch[branchName];
     }
   }
-  return {};
+  return EMPTY;
 };
 
 const selectListEntry = (state: object, repository: Repository, branch?: Branch): object => {
@@ -310,7 +318,7 @@ const selectListEntry = (state: object, repository: Repository, branch?: Branch)
   if (list.entry) {
     return list.entry;
   }
-  return {};
+  return EMPTY;
 };
 
 export const selectListAsCollection = (state: object, repository: Repository, branch?: Branch): PagedCollection => {