Added Lab Name and OSAR download and check mark

Be-Secure · Aug 30, 2024 · 2049dfc · 2049dfc
1 parent dc8ba8f
commit 2049dfc
Show file tree

Hide file tree

Showing 4 changed files with 75 additions and 40 deletions.
diff --git a/src/apiDetailsConfig.json b/src/apiDetailsConfig.json
@@ -13,5 +13,6 @@
         "token": ""
     },
     "activeTool": "github",
-    "version": "0.19.0"
+    "version": "0.19.1",
+    "labName": "Be-Secure Community Lab"
 }
diff --git a/src/components/Navbars/DefaultNavbar/index.tsx b/src/components/Navbars/DefaultNavbar/index.tsx
@@ -510,9 +510,12 @@ function DefaultNavbar({
             <MKTypography
               fontWeight="bold"
               color={ light ? "white" : "dark" }
-              style={ { display: "flex", fontSize: "0.675rem" } }
+              style={ { display: "flex", fontSize: "0.675rem", alignItems: "center" } }
             >
-              Version: { jsonData.version }
+              <MKTypography style={ { fontSize: "12px" } }>
+                Powered By &nbsp;
+              </MKTypography>
+              BeSLighthouse { jsonData.version }
             </MKTypography>
           </MKBox>
           <MKBox
@@ -588,7 +591,7 @@ function DefaultNavbar({
 
 // Setting default values for the props of DefaultNavbar
 DefaultNavbar.defaultProps = {
-  brand: "BeSLighthouse",
+  brand: jsonData.labName,
   transparent: false,
   light: false,
   action: false,

diff --git a/src/pages/BesVersionHistory/index.tsx b/src/pages/BesVersionHistory/index.tsx
@@ -3,7 +3,7 @@ import Grid from "@mui/material/Grid";
 import Card from "@mui/material/Card";
 import { useParams } from "react-router-dom";
 import { projectOfInterestData } from "../../utils/ProjectOfInterestData";
-import { MenuItem, Select, Tooltip } from "@mui/material";
+import { MenuItem, Select } from "@mui/material";
 import MKBox from "../../components/MKBox";
 import MKTypography from "../../components/MKTypography";
 import AssessmentReport from "./AssessmentReport";
@@ -17,8 +17,13 @@ import Modal from '@mui/material/Modal';
 import Fade from '@mui/material/Fade';
 import { projectTags } from "./tags";
 import DefaultNavbar from "../../components/Navbars/DefaultNavbar";
-import MKButton from "../../components/MKButton";
-import { Science } from "@mui/icons-material";
+import GitHubIcon from "@mui/icons-material/GitHub";
+import DownloadIcon from '@mui/icons-material/Download';
+
+import CheckIcon from '../../assets/images/checked.png';
+import { verifyLink } from "../ShowModelDetails/AssessmentSummary";
+import { checkFileExists } from "../ShowModelDetails/AdversarialAttackSummary";
+import { assessmentDatastoreURL } from "../../dataStore";
 
 export const osspoiMasterAndSummary = async (
   setData: any,
@@ -153,6 +158,11 @@ function BesVersionHistory() {
   // const classes = useStyles();
   const { besId, besName }: any = useParams();
   const [data, setData] = React.useState([]);
+  const [getOsarReport, setOsarReportData]: any = React.useState(
+    {}
+  );
+  const [selectedOption, setSelectedOption] = React.useState("");
+  const [getCosignLink, setCosignLink]: any = React.useState(false);
 
   const [versionSummary, setVersionSummary]: any = React.useState([]);
   React.useEffect(() => {
@@ -165,7 +175,29 @@ function BesVersionHistory() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const [selectedOption, setSelectedOption] = React.useState("");
+  React.useEffect(() => {
+    // Call osspoiMasterAndSummary only when selectedOption changes
+    if (selectedOption) {
+
+      const osarReportLink = `${assessmentDatastoreURL}/${besName}/${selectedOption}/${besName}-osar.json`;
+      const cosignLink = `${assessmentDatastoreURL}/${besName}/${selectedOption}/cosign.pub`;
+
+      verifyLink(osarReportLink, setOsarReportData);
+      checkFileExists(cosignLink, setCosignLink);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [selectedOption]);
+
+  const downloadJson = () => {
+    const jsonContent = JSON.stringify(getOsarReport);
+    const blob = new Blob([jsonContent], { type: 'application/json' });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement('a');
+    link.href = url;
+    link.setAttribute('download', `${besName}-${selectedOption}-osar.json`);
+    document.body.appendChild(link);
+    link.click();
+  };
 
   try {
     if (!selectedOption && versionSummary) {
@@ -344,50 +376,49 @@ function BesVersionHistory() {
                         { item.id }
                       </MKTypography>
                     </Grid>
-                    { /* For Open Source Assurance Provider */ }
                     <Grid
                       item
                       xs={ 6 }
                       md={ 3 }
                       style={ { display: "flex", paddingTop: "12px" } }
                     >
-                      <MKTypography
-                        variant="h6"
-                        textTransform="capitalize"
-                        color="text"
-                        title="Open Source Assurance Service Provider"
-                        style={ { fontSize: "15px", fontWeight: "normal" } }
-                      >
-                        OASP: &nbsp;
-                      </MKTypography>
-                      { /* Tooltip is used to provide the title for the icon */ }
-                      <Tooltip title="Lab">
-                        <Science />
-                      </Tooltip>
-                      <MKTypography
-                        variant="h6"
-                        fontWeight="regular"
-                        style={ { fontSize: "15px", paddingLeft: "2px" } }
-                      >
-                        { item.owner.login }
-                      </MKTypography>
+                      <a href={ item.html_url } target="_blank" rel="noopener noreferrer" style={ { textDecoration: 'none', color: 'inherit' } }>
+                        <MKTypography
+                          variant="h6"
+                          textTransform="capitalize"
+                          color="text"
+                          title="Open Source Assurance Service Provider"
+                          style={ { fontSize: "15px", fontWeight: "normal" } }
+                        >
+                          <GitHubIcon style={ { position: 'relative', top: '3px' } } fontSize="small" />
+                          &nbsp; repository
+                        </MKTypography>
+                      </a>
                     </Grid>
                     <Grid
                       item
                       xs={ 6 }
                       md={ 3 }
-                      style={ { display: "flex", paddingTop: "12px", position: "relative", bottom: "7px" } }
+                      style={ { display: "flex", paddingTop: "12px" } }
                     >
-                      <MKButton
-                        // onClick={ downloadJson }
-                        variant="gradient"
-                        color="info"
-                        size="small"
-                        endIcon={ <i className="fa fa-download" /> }
-                        disabled
+                      <MKTypography
+                        variant="h6"
+                        textTransform="capitalize"
+                        color="text"
+                        style={ { fontSize: "15px", fontWeight: "normal" } }
                       >
-                        OSAR
-                      </MKButton>
+                        OSAR: &nbsp;
+                      </MKTypography>
+                      <div style={ { display: 'flex' } }>
+                        { Object.keys(getOsarReport).length === 0 ? <MKTypography
+                          variant="h6"
+                          fontWeight="regular"
+                          style={ { fontSize: "15px" } }
+                        >
+                          Not Available
+                        </MKTypography> : <DownloadIcon onClick={ downloadJson } style={ { cursor: "pointer" } } fontSize="medium" /> }
+                        { getCosignLink ? <img style={ { position: 'relative', top: '-2px' } } src={ CheckIcon } alt="Checked Icon" width={ 24 } height={ 24 } /> : <></> }
+                      </div>
                     </Grid>
                     <Grid
                       item

diff --git a/src/pages/ShowModelDetails/AdversarialAttackSummary.tsx b/src/pages/ShowModelDetails/AdversarialAttackSummary.tsx
@@ -21,7 +21,7 @@ const TABLE_HEAD = [
   { id: "defenceAvailable", label: "Defence Available", alignRight: false }
 ];
 
-async function checkFileExists(url: string, status: any) {
+export async function checkFileExists(url: string, status: any) {
   try {
     const response = await axios.get(url);
     if (response.status === 200) {