Merge pull request #134 from ligangty/2.0-refactor

Add GroupView Page

src/main/webui/src/app/components/content/common/StoreBasicSections.jsx

@@ -27,6 +27,7 @@ export const StoreViewBasicSection = ({store})=>{
     authoritativeIndexHint += " (when readonly, this will be enabled automatically)";
   }
   const readOnlyHint = "If set to readonly, all uploading and deleting operations to this repo are prohibited";
+  const constituentsPrependHint = "If enabled, all new constituents which are added not manually(like promotion) will be at the top of constituents list";
   return <div className="fieldset">
     <div className="detail-field">
         <label>Package Type:</label>
@@ -45,23 +46,35 @@ export const StoreViewBasicSection = ({store})=>{
       }
     </div>
     {
-      store.type==="hosted"&&<div className="detail-field">
+      store.type==="hosted" &&
+      <div className="detail-field">
         <span>{Filters.checkmark(store.readonly)}</span>
         <label>Readonly?</label>
         {
-          store.type==="hosted" && !store.readonly &&
+          !store.readonly &&
           <span className="hint">{readOnlyHint}</span>
         }
       </div>
     }
-    <div className="detail-field">
-      <span>{Filters.checkmark(store.authoritative_index)}</span>
-      <label>Authoritative index enabled?</label>
-      {
-        (store.type==="remote" || store.type==="hosted") && !store.authoritative_index &&
-        <span className="hint">{authoritativeIndexHint}</span>
-      }
-    </div>
+    {
+      (store.type==='remote'||store.type==='hosted') &&
+      <div className="detail-field">
+        <span>{Filters.checkmark(store.authoritative_index)}</span>
+        <label>Authoritative index enabled?</label>
+        {
+          !store.authoritative_index &&
+          <span className="hint">{authoritativeIndexHint}</span>
+        }
+      </div>
+    }
+    {
+      store.type==='group' &&
+      <div className="detail-field">
+        <span>{Filters.checkmark(store.prepend_constituent)}</span>
+        <label>Prepend Constituents?</label>
+        <span className="hint">{constituentsPrependHint}</span>
+      </div>
+    }
     <div className="sub-fields">
       <div className="detail-field">
         <label>Disable Timeout:</label>

src/main/webui/src/app/components/content/common/StoreBasicSections.test.jsx

@@ -55,7 +55,7 @@ describe('StoreBasicSections tests', () => {
     const mockHostedStore = {name: "local-deployments", type: "hosted", packageType: "maven",
        key: "maven:hosted:local-deployments", disabled: false, readonly: false, "allow_snapshots": true,
        "allow_releases": true, description: "work for local deployment",
-       url: "http://fakeurl", storage: "/var/lib/teststorage"};
+        storage: "/var/lib/teststorage"};
     render(<StoreViewBasicSection store={mockHostedStore} />);
     expect(screen.getByText("Package Type:")).toBeInTheDocument();
     expect(screen.getByText(/\s*maven\s*$/u, {selector: "span"})).toBeInTheDocument();
@@ -69,7 +69,6 @@ describe('StoreBasicSections tests', () => {
 
     const storeLocalURL = Utils.storeHref(mockHostedStore.key);
     expect(screen.getByRole("link", {name: storeLocalURL})).toHaveAttribute("href", storeLocalURL);
-    expect(screen.queryByRole("link", {name: mockHostedStore.url})).not.toBeInTheDocument();
 
     expect(screen.queryByText("Content Cache Timeout:")).not.toBeInTheDocument();
     expect(screen.queryByText("Metadata Cache Timeout:")).not.toBeInTheDocument();
@@ -83,21 +82,20 @@ describe('StoreBasicSections tests', () => {
 
   it("Verify StoreViewBasicSection for group repo", ()=>{
     const mockGroupStore = {name: "public", type: "group", packageType: "maven",
-       key: "maven:group:public", disabled: false, description: "public group",
-       url: "http://fakeurl", constituents: ["maven:remote:central", "maven:hosted:local-deployments",]};
+       // eslint-disable-next-line camelcase
+       key: "maven:group:public", disabled: false, prepend_constituent: false,
+       description: "public group", constituents: ["maven:remote:central", "maven:hosted:local-deployments",]};
     render(<StoreViewBasicSection store={mockGroupStore} />);
     expect(screen.getByText("Package Type:")).toBeInTheDocument();
     expect(screen.getByText(/\s*maven\s*$/u, {selector: "span"})).toBeInTheDocument();
 
     expect(screen.getByText("Name:")).toBeInTheDocument();
     expect(screen.getByText(/\s*public\s*$/u, {selector: "span"})).toBeInTheDocument();
 
-    expect(screen.queryByText("Make the content index authoritative to this repository")).not.toBeInTheDocument();
-    expect(screen.queryByText("Make the content index authoritative to this repository (when readonly, this will be enabled automatically)")).not.toBeInTheDocument();
+    expect(screen.getByText("If enabled, all new constituents which are added not manually(like promotion) will be at the top of constituents list")).toBeInTheDocument();
 
     const storeLocalURL = Utils.storeHref(mockGroupStore.key);
     expect(screen.getByRole("link", {name: storeLocalURL})).toHaveAttribute("href", storeLocalURL);
-    expect(screen.queryByRole("link", {name: mockGroupStore.url})).not.toBeInTheDocument();
 
     expect(screen.queryByText("Content Cache Timeout:")).not.toBeInTheDocument();
     expect(screen.queryByText("Metadata Cache Timeout:")).not.toBeInTheDocument();

src/main/webui/src/app/components/content/group/GroupView.jsx

@@ -14,8 +14,98 @@
  * limitations under the License.
  */
 
-import React from 'react';
+import React, {useState, useEffect} from 'react';
+import {useParams, Link} from 'react-router-dom';
+import {StoreViewControlPanel as ControlPanel} from '../common/StoreControlPanels.jsx';
+import {StoreViewBasicSection as BasicSection} from '../common/StoreBasicSections.jsx';
+import {LoadingSpiner} from '../common/LoadingSpiner.jsx';
+// import ViewJsonDebugger from './Debugger.jsx';
+import {Utils} from '#utils/AppUtils.js';
+import {IndyRest} from '#utils/RestClient.js';
+
+const {storeRes, disableRes} = IndyRest;
+
 
 export default function GroupView() {
-  return <div>This is not implemented yet!</div>;
+  const [state, setState] = useState({
+    store: {},
+    raw: {},
+    message: ''
+  });
+  const [loading, setLoading] = useState(true);
+  const {packageType, name} = useParams();
+
+  useEffect(()=>{
+    setLoading(true);
+    const fetchStore = async () => {
+      const res = await storeRes.get(packageType, "group", name);
+      if (res.success){
+        const raw = res.result;
+        const store = Utils.cloneObj(raw);
+        store.disabled = raw.disabled === undefined ? false : raw.disabled;
+
+        // get Store disablement data
+        const timeoutRes = await disableRes.getStoreTimeout(store.packageType, store.type, store.name);
+        const newStore = Utils.cloneObj(store);
+        if(timeoutRes.success){
+          const timeoutData = timeoutRes.result;
+          newStore.disableExpiration = timeoutData.expiration;
+        }
+        // Change state and re-rendering
+        setState({
+          store: newStore
+        });
+      }else{
+        Utils.logMessage(`Failed to get store data. Error reason: ${res.error.status}->${res.error.message}`);
+      }
+      setLoading(false);
+    };
+
+    fetchStore();
+  }, [packageType, name]);
+
+  if (loading) {
+    return <LoadingSpiner />;
+  }
+
+  const store = state.store;
+  if(!Utils.isEmptyObj(store)) {
+    return (
+      <React.Fragment>
+        <div className="control-panel">
+          <ControlPanel store={store} />
+        </div>
+
+        <div className="content-panel">
+          <div className="fieldset-caption">Basics</div>
+          <BasicSection store={store} />
+
+          <div className="fieldset-caption">Description</div>
+          <div className="fieldset">
+            <div className="text-field">
+              <textarea readOnly className="text-description" value={Utils.defaultDescription(store.description)} />
+            </div>
+          </div>
+
+          <div className="fieldset-caption">Constituents</div>
+            <div className="fieldset">
+              {
+                store.constituents && store.constituents.length > 0 &&
+                <ol className="detail-value detail-value-list">
+                  {
+                    store.constituents.map(item => <li key={`constituent-${item}`} className="detail-value-list-item">
+                      <Link to={Utils.detailHref(item)}>{item}</Link>
+                    </li>)
+                  }
+                </ol>
+              }
+            </div>
+        </div>
+        {
+          // <ViewJsonDebugger enableDebug={false} storeJson={store} rawJson={raw} />
+        }
+      </React.Fragment>
+    );
+  }
+  return <React.Fragment />;
 }

src/main/webui/src/app/components/content/hosted/HostedView.jsx

@@ -96,5 +96,5 @@ export default function HostedView() {
       </React.Fragment>
     );
   }
-  return null;
+  return <React.Fragment />;
 }

src/main/webui/src/app/components/content/remote/RemoteView.jsx

@@ -227,5 +227,5 @@ export default function RemoteView() {
       </React.Fragment>
     );
   }
-  return null;
+  return <React.Fragment />;
 }

src/main/webui/src/app/utils/AppUtils.js

@@ -180,4 +180,11 @@ export const Utils = {
       return 0;
     });
   },
+  defaultDescription: description => {
+    let desc = description;
+    if (!desc || desc.length < 1){
+      desc = 'No description provided.';
+    }
+    return desc;
+  }
 };