Merge pull request #111 from ligangty/2.0-refactor

Implement sort by for remote listing
Commonjava · Nov 30, 2023 · 81511ed · 81511ed
2 parents 8565cee + 451a965
commit 81511ed
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 3 deletions.
diff --git a/src/main/webui/src/app/components/content/common/ListControl.jsx b/src/main/webui/src/app/components/content/common/ListControl.jsx
@@ -19,7 +19,7 @@ import React, {useState} from 'react';
 import {useNavigate} from 'react-router-dom';
 import {PropTypes} from 'prop-types';
 
-export default function ListControl({type, legends, handleHideAll, handleSearch, handleDebug}) {
+export default function ListControl({type, legends, handleHideAll, handleSearch, handleDebug, handleSortBy}) {
   const [debug, setDebug] = useState(false);
   const navigate = useNavigate();
   return (
@@ -38,7 +38,7 @@ export default function ListControl({type, legends, handleHideAll, handleSearch,
         type==="remote" &&
           <div className="cp-row">
             Sort by:{' '}
-            <select name="orderProp">
+            <select name="orderProp" onChange={handleSortBy}>
               {
                 [
                   {value: 'key', text: 'Name'},
@@ -83,5 +83,6 @@ ListControl.propTypes={
   legends: PropTypes.array,
   handleHideAll: PropTypes.func,
   handleSearch: PropTypes.func.isRequired,
-  handleDebug: PropTypes.func
+  handleDebug: PropTypes.func,
+  handleSortBy: PropTypes.func
 };
diff --git a/src/main/webui/src/app/components/content/remote/RemoteList.jsx b/src/main/webui/src/app/components/content/remote/RemoteList.jsx
@@ -34,6 +34,12 @@ const handlers = {
       rawList,
       listing: Utils.searchByKeyForNewStores(event.target.value, rawList)
     });
+  },
+  handleSortBy: (event, rawList, setState) => {
+    setState({
+      rawList,
+      listing: Utils.sortByPropForStores(event.target.value, rawList)
+    });
   }
 };
 
@@ -86,6 +92,7 @@ export default function RemoteList() {
         legends={options}
         handleSearch={event => handlers.handleSearch(event, state.rawList, setState)}
         handleDebug={event => handlers.handleDebug(event, setState)}
+        handleSortBy={event => handlers.handleSortBy(event, state.rawList, setState)}
       />
       {
       state.listing?

diff --git a/src/main/webui/src/app/utils/AppUtils.js b/src/main/webui/src/app/utils/AppUtils.js
@@ -121,6 +121,15 @@ export const Utils = {
     rawStoresList.forEach(item=>item.key.toLowerCase().includes(searchString.toLowerCase()) && newListing.push(item));
     return newListing;
   },
+  sortByPropForStores: (prop, rawStoresList) => {
+    const newListing = rawStoresList.sort((a, b) => {
+      if (a[prop] < b[prop]) {
+        return -1;
+      }
+      return 1;
+    });
+    return newListing;
+  },
   isEmptyObj: obj => Object.keys(obj).length === 0 && obj.constructor === Object,
   cloneObj: src => {
     const target = {};

diff --git a/src/main/webui/src/app/utils/AppUtils.test.js b/src/main/webui/src/app/utils/AppUtils.test.js
@@ -133,6 +133,41 @@ describe('AppUtils tests', () => {
     ]);
   });
 
+  it("Check sortByPropForStores", ()=>{
+    const mockData = [
+      {
+      "name": "central",
+      "type": "remote",
+      "packageType": "maven",
+      "key": "maven:remote:central",
+      "url": "https://repo.maven.apache.org/maven2"
+      },
+      {
+      "name": "mrrc",
+      "type": "remote",
+      "packageType": "maven",
+      "key": "maven:remote:mrrc",
+      "url": "https://maven.repository.redhat.com/ga/"
+      },
+      {
+      "name": "jboss.org",
+      "type": "remote",
+      "packageType": "maven",
+      "key": "maven:remote:jboss.org",
+      "url": "https://repository.jboss.org/nexus/content/repositories/"
+      }
+    ];
+    const sortByName = Utils.sortByPropForStores("name", mockData);
+    expect(sortByName).toHaveLength(3);
+    expect(sortByName[0].name).toBe("central");
+    expect(sortByName[2].name).toBe("mrrc");
+
+    const sortByUrl = Utils.sortByPropForStores("url", mockData);
+    expect(sortByUrl).toHaveLength(3);
+    expect(sortByUrl[0].name).toBe("mrrc");
+    expect(sortByUrl[2].name).toBe("jboss.org");
+  });
+
   it("Check Object utils", () => {
     expect(Utils.isEmptyObj({})).toBeTruthy();
     expect(Utils.isEmptyObj({a: 1})).toBeFalsy();