Content/flatten navbar link items (#174)

* #173: flattened navbar links items * #173: fixed slice builder image issue
fabric-testbed · May 16, 2022 · 5361074 · 5361074
1 parent c3984aa
commit 5361074
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 28 deletions.
diff --git a/src/components/Header.jsx b/src/components/Header.jsx
@@ -36,15 +36,18 @@ class Header extends React.Component {
         child: [],
         exact: false,
       },
-      { 
-        name: "Links",
-        path: "/links",
-        child: [
-          { name: "Knowledge Base", href: portalData.knowledgeBaseLink, path: ""},
-          { name: "JupyterHub", href: this.jupyterLinkMap[checkPortalType(window.location.href)], path: ""}
-          ],
-          exact: false
-        },
+      {
+        name: "Knowledge Base",
+        href: portalData.knowledgeBaseLink,
+        child: [],
+        path: ""
+      },
+      {
+        name: "JupyterHub",
+        href: this.jupyterLinkMap[checkPortalType(window.location.href)],
+        child: [],
+        path: ""
+      },
       { name: "User Profile", path: "/user", child: [], exact: false },
     ],
   };
@@ -114,20 +117,34 @@ class Header extends React.Component {
                   }
                   key={index}
                 >
-                  <NavLink
-                    className={
-                      "nav-link" +
-                      (item.child.length > 0 ? " dropdown-toggle" : "")
-                    }
-                    to={item.path}
-                    id={`navbarDropdownMenuLink-${index}`}
-                    data-toggle={item.child.length > 0 ? "dropdown" : ""}
-                    aria-haspopup="true"
-                    aria-expanded="false"
-                    exact={item.exact}
-                  >
-                    {item.name}
-                  </NavLink>
+                  {
+                    item.href && <a
+                      className="nav-link"
+                      key={item.name}
+                      href={item.href}
+                      target="_blank"
+                      rel="noreferrer"
+                    >
+                      {item.name}
+                    </a>
+                  }
+                  {
+                    !item.href && 
+                    <NavLink
+                      className={
+                        "nav-link" +
+                        (item.child.length > 0 ? " dropdown-toggle" : "")
+                      }
+                      to={item.path}
+                      id={`navbarDropdownMenuLink-${index}`}
+                      data-toggle={item.child.length > 0 ? "dropdown" : ""}
+                      aria-haspopup="true"
+                      aria-expanded="false"
+                      exact={item.exact}
+                    >
+                      {item.name}
+                    </NavLink>
+                  }
                   {item.child.length > 0 && (
                     <div
                       className="dropdown-menu"

diff --git a/src/components/SliceViewer/SideNodes.jsx b/src/components/SliceViewer/SideNodes.jsx
@@ -33,8 +33,8 @@ class SideNodes extends React.Component {
 
   handleAddNode = () => {
     // type: currently only support 'VM'
-    const { selectedSite, nodeName, nodeType, core, ram, disk, imageType, imageRef, nodeComponents } = this.state;
-    const image = `${imageRef},${imageType}`;
+    const { selectedSite, nodeName, nodeType, core, ram, disk, imageType, selectedImageRef, nodeComponents } = this.state;
+    const image = `${selectedImageRef},${imageType}`;
     this.props.onNodeAdd(nodeType, selectedSite, nodeName, core, ram, disk, image, nodeComponents);
     this.setState({ selectedSite: "", nodeName: "", nodeComponents: [], selectedImageRef: "default_rocky_8" })
   }
@@ -90,7 +90,7 @@ class SideNodes extends React.Component {
   }
 
   handleImageRefChange = (e) => {
-    this.setState({ imageRef: e.target.value })
+    this.setState({ selectedImageRef: e.target.value })
   }
 
   getSiteResource = () => {

diff --git a/src/pages/NewSliceForm.jsx b/src/pages/NewSliceForm.jsx
@@ -281,8 +281,9 @@ class NewSliceForm extends React.Component {
           const { data } = await createSlice(requestData);
           toast.success("Slice created successfully.");
           // redirect users directly to the new slice page
-          // const slice_id = data["value"]["reservations"][0].slice_id;
-          this.props.history.push("/experiments#slices")
+          const slice_id = data["value"]["reservations"][0].slice_id;
+          // this.props.history.push("/experiments#slices");
+          this.props.history.push(`/slices/${slice_id}`)
         } catch (ex) {
           console.log("failed to create slice: " + ex.response.data);
           toast.error("Failed to create slice.");