Security fixes (#115)

* Add Orcid User Info Api Fix biocompute-objects/playbook-partnership#16 Changes to be committed: modified: server/authentication/apis.py modified: server/authentication/services.py modified: server/authentication/urls.py * Typo fix Changes to be committed: modified: client/src/components/bcodbs/SearchOptions.js * Update services.py move `now = make_aware(datetime.utcnow())` to top * 1st round of changes Changes to be committed: modified: client/src/components/builder/index.js modified: client/src/components/builder/preview.js modified: client/src/components/viewer/cardViews.js modified: client/src/components/viewer/index.js modified: client/src/layouts/MainLayout/index.js * GA4 added * Add resetToken API for server For biocompute-objects/bco_api#158 Changes to be committed: modified: server/bcodb/apis.py modified: server/bcodb/services.py modified: server/bcodb/urls.py * Token reset button for the client Fix biocompute-objects/bco_api#158 * Add functions for ORCID authentication Changes to be committed: modified: server/authentication/apis.py modified: server/authentication/services.py modified: server/authentication/urls.py modified: server/bcodb/services.py modified: server/users/apis.py * Add/Remove ORCID for UI Fix #90 Changes to be committed: modified: client/src/components/account/Profile.js modified: client/src/services/auth.service.js modified: client/src/slices/accountSlice.js * Add/Remove ORCID for server Fix #90 Changes to be committed: modified: server/authentication/apis.py modified: server/authentication/urls.py modified: server/bcodb/services.py --------- Co-authored-by: tianywan819 <[email protected]>
biocompute-objects · Jun 8, 2023 · 781bced · 781bced
1 parent 565b591
commit 781bced
Show file tree

Hide file tree

Showing 16 changed files with 519 additions and 100 deletions.
diff --git a/client/src/components/account/Profile.js b/client/src/components/account/Profile.js
@@ -1,20 +1,43 @@
-import React from "react";
-import { Navigate } from "react-router-dom";
+import React, { useEffect} from "react";
+import { Navigate, useNavigate } from "react-router-dom";
 import { useDispatch, useSelector } from "react-redux";
-import { Button, Card, CardContent, CardHeader, Grid } from "@material-ui/core";
+import { Button, Card, CardContent, CardHeader, Grid, Typography } from "@material-ui/core";
 import { Formik, Form, } from "formik";
 import { MyTextField } from "../builder/specialFeilds";
 import { account } from "../../slices/accountSlice";
 import * as Yup from "yup";
+import { useSearchParams } from "react-router-dom";
+import { orcidAdd, orcidRemove } from "../../slices/accountSlice";
 
 const Profile = () => {
+  const navigate = useNavigate();
   const dispatch = useDispatch()
   const currentUser = useSelector((state) => state.account.user);
+  const orcidUrl = process.env.REACT_APP_ORCID_URL
+  const orcid_id = process.env.REACT_APP_ORCID_CLIENT_ID
+  const serverUrl = process.env.REACT_APP_SERVER_URL
+  const [searchParams, setSearchParams] = useSearchParams();
+  const code = searchParams.get("code")
 
   if (!currentUser) {
     return <Navigate to="/login" />;
   }
 
+  useEffect(() => {
+    if (code !== null) {
+      console.log("response", code);
+      dispatch(orcidAdd(code))
+        .unwrap()
+        .then(() => {
+          navigate("/profile");
+        })
+        .catch((error) => {
+          console.log(error)
+          navigate("/profile");
+        })
+    }
+  }, [])
+
   return (
     <Card>
       <CardHeader title="User Profile"/>
@@ -26,6 +49,7 @@ const Profile = () => {
           justifyContent="center"
         >
           <Formik
+            enableReinitialize
             initialValues={{
               username: currentUser.userinfo.username,
               first_name: currentUser.userinfo.first_name,
@@ -69,7 +93,34 @@ const Profile = () => {
                     <MyTextField name='affiliation' label='Affiliation'/>
                   </Grid>
                   <Grid item>
-                    <MyTextField name='orcid' label='ORCID'/>
+                    { (values.orcid.length > 3)
+                      ? (<Typography>
+                        <MyTextField name='orcid' label='ORCID' isDisabled/>
+                        <Button
+                          variant="outlined"
+                          onClick={()=> {
+                            dispatch(orcidRemove())
+                          }}
+                        >
+                          <img  
+                            alt="Remove ORCID"
+                            src="https://orcid.org/assets/vectors/orcid.logo.icon.svg"
+                            width="25"
+                          />
+                          <Typography variant="subtitle1" > Remove ORCID</Typography>
+                        </Button>
+                      </Typography>)
+                      : ( <a href={`${orcidUrl}/oauth/authorize?client_id=${orcid_id}&response_type=code&scope=/authenticate&redirect_uri=${serverUrl}/profile`}>
+                        <Button variant="outlined">
+                          <img  
+                            alt="ORCID Sign in"
+                            src="https://orcid.org/assets/vectors/orcid.logo.icon.svg"
+                            width="25"
+                          />
+                          <Typography variant="subtitle1" > Add ORCID</Typography>
+                        </Button>
+                      </a> )
+                    }
                   </Grid>
                 </Grid>
                 <div style={{padding: 20}}> 

diff --git a/client/src/components/account/Servers.js b/client/src/components/account/Servers.js
@@ -5,7 +5,7 @@ import {
   Button, Card, CardContent, CardHeader, Container, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, Grid, makeStyles, TextField, Typography
 } from "@material-ui/core"
 import { useSelector, useDispatch } from "react-redux";
-import { removeBcoDb, groupsPermissions, groupInfo } from "../../slices/accountSlice";
+import { removeBcoDb, resetToken } from "../../slices/accountSlice";
 import AddServer from "./AddServer";
 import { useNavigate } from "react-router-dom";
 
@@ -64,6 +64,16 @@ export default function Servers() {
     setOpen(false);
   };
 
+  const handleTokenReset = (index) => {
+    const { public_hostname, token } = bcodbs[index]
+    console.log("Dispatch", public_hostname, token)
+    dispatch(resetToken({public_hostname, token}))
+      .unwrap()
+      .catch((error) =>{
+        console.log(error);
+      })
+  }
+
   return (
     <Container elevation={2}>
       <Typography className={classes.title}>BCO databases</Typography>
@@ -151,6 +161,11 @@ export default function Servers() {
                   >Cancel</Button>
                 </DialogActions>
               </Dialog>
+              <Button
+                variant="outlined"
+                onClick={() => handleTokenReset(index)}
+                disabled={database.recent_status !== "200"}
+              >Reset API Token</Button>
             </CardContent>
           </Card>
         ))

diff --git a/client/src/components/builder/index.js b/client/src/components/builder/index.js
@@ -469,7 +469,6 @@ export const  BuilderColorCode = () => {
               </TabPanel>
             </Grid>
           </Grid>
-          <NotificationBox />
         </Paper>
       </div>
       <br/>

diff --git a/client/src/components/builder/preview.js b/client/src/components/builder/preview.js
@@ -28,13 +28,8 @@ export const TreeView = () => {
           onAdd={handleChange}
         />
       </CardContent>
-
       <CardContent>
         <Grid container spacing={2}> 
-
-
-
-
         </Grid>
       </CardContent>
     </Card>

diff --git a/client/src/components/viewer/cardViews.js b/client/src/components/viewer/cardViews.js
@@ -7,7 +7,6 @@ export const ProvenanceView = () => {
   return (
     <Card>
       <CardHeader title="Provenance Domain" />
-      {console.log(prov)}
       <CardContent>
         <Typography>Name: {prov.name}</Typography>
         <Typography>Version: {prov.version}</Typography>
@@ -18,7 +17,7 @@ export const ProvenanceView = () => {
       <CardContent>
         <CardHeader subheader="Contributors" />
         {prov.contributors.map((contributor, cont_index)=> (
-          <div key={cont_index}>
+          <Card key={cont_index}>
             <Typography >Name: {contributor.name}</Typography>
             <Typography >Email: {contributor.email}</Typography>
             <Typography >Affiliation: {contributor.affiliation}</Typography>
@@ -28,23 +27,23 @@ export const ProvenanceView = () => {
                 <Typography key={contribution_index}>{contribution}</Typography>
               ))}
             </Typography>
-          </div>
+          </Card>
         ))}
       </CardContent>
       <CardContent>
         <CardHeader subheader="Review" />
         {
           prov.review
             ? (prov.review.map((review, review_index)=>(
-              <div key={review_index}>
+              <Card key={review_index}>
                 <Typography>Reviewer name: {review.reviewer.name}</Typography>
                 <Typography>Reviewer comment: {review.reviewer_comment}</Typography>
                 <Typography>Status: {review.status}</Typography>
                 <Typography>Date: {review.date}</Typography>
                 <Typography>Reviewer email: {review.reviewer.email}</Typography>
                 <Typography>Reviewer affiliation: {review.reviewer.affiliation}</Typography>
                 <Typography>Reviewer ORCID: {review.reviewer.orcid}</Typography>
-              </div>
+              </Card>
             )))
             : (<div></div>)
         }
@@ -149,10 +148,17 @@ export const DescriptionView = () => {
   )
 };
 export const ExtensionView = () => {
+  const extension = useSelector(state => state.bco.data.extension_domain)
   return (
     <Card>
       <CardHeader title="Extension Domain"/>
-      <CardContent></CardContent>
+      <CardContent>
+        <Typography>
+          <pre><code>
+            {JSON.stringify(extension, null, 2)}
+          </code></pre>
+        </Typography>
+      </CardContent>
     </Card>
   )
 };
@@ -219,18 +225,45 @@ export const IoView = () => {
               ))}
             </div>
           )
-          : <div>no</div>
+          : <div></div>
         }
       </CardContent>
     </Card>
   )
 };
+
 export const ExecutionView = () => {
-  const IoDom = useSelector(state => state.bco.data.io_domain)
+  const ExDom = useSelector(state => state.bco.data.execution_domain)
   return (
     <Card>
       <CardHeader title="Execution Domain"/>
-      <CardContent></CardContent>
+      <CardContent>
+        <Typography>Script: {JSON.stringify(ExDom.script)}</Typography>
+        <Typography>Script Driver: {JSON.stringify(ExDom.script_driver)}</Typography>
+        <Typography>Software Prerequisties: {JSON.stringify(ExDom.software_prerequisites)}</Typography>
+        <Typography>Environmane Variables: {JSON.stringify(ExDom.environment_variables)}</Typography>
+        {/* <Typography>
+          <pre>
+            {JSON.stringify(ExDom, null, 2)}
+          </pre>
+        </Typography> */}
+      </CardContent>
+    </Card>
+  )
+};
+
+export const ErrorView = () => {
+  const ErrDom = useSelector(state => state.bco.data.error_domain)
+  return (
+    <Card>
+      <CardHeader title="Error Domain"/>
+      <CardContent>
+        <Typography>
+          <pre><code>
+            {JSON.stringify(ErrDom, null, 2)}
+          </code></pre>
+        </Typography>
+      </CardContent>
     </Card>
   )
 };
-Original file line number
+Diff line change
@@ Expand Up / @@ -469,7 +469,6 @@ export const BuilderColorCode = () => { @@
                   </TabPanel>
                 </Grid>
               </Grid>
-              <NotificationBox />
             </Paper>
           </div>
           <br/>
@@ Expand Down @@