Dev v2 mrj4001

src/components/elements/CurateIndividual/CurateIndividual.tsx

@@ -1,17 +1,22 @@
-import React, { useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import { useRouter } from 'next/router';
 import { useDispatch, useSelector, RootStateOrAny } from "react-redux";
 import { identityFetchData, reciterFetchData,reCalcPubMedPubCount } from "../../../redux/actions/actions";
 import Loader from "../Common/Loader";
 import fullName from "../../../utils/fullName";
-import { Container, Button, Row } from "react-bootstrap";
+import { Container, Button, Row,Toast } from "react-bootstrap";
 import appStyles from '../App/App.module.css';
 import styles from "./CurateIndividual.module.css";
 import InferredKeywords from "./InferredKeywords"
 import SuggestionsBanner from "./SuggestionsBanner";
 import ReciterTabs from "./ReciterTabs";
 import Image from "next/image";
 import Profile from "../Profile/Profile";
+import { useSession } from "next-auth/client";
+import { allowedPermissions, toastMessage } from "../../../utils/constants";
+import ToastContainerWrapper from "../ToastContainerWrapper/ToastContainerWrapper";
+
+
 
 interface PrimaryName {
   firstInitial?: string,
@@ -24,17 +29,37 @@ interface PrimaryName {
 const CurateIndividual = () => {
   const router = useRouter()
   const { id } = router.query
+  const [newId, setNewId ] = useState<string>("");
   const dispatch = useDispatch();
   const identityData = useSelector((state: RootStateOrAny) => state.identityData)
   const identityFetching = useSelector((state: RootStateOrAny) => state.identityFetching)
   const reciterData = useSelector((state: RootStateOrAny) => state.reciterData)
   const reciterFetching = useSelector((state: RootStateOrAny) => state.reciterFetching)
   const [displayImage, setDisplayImage] = useState<boolean>(true);
   const [modalShow, setModalShow] = useState(false);
+  const [session, loading] = useSession();
 
   useEffect(() => {
-    dispatch(identityFetchData(id));
-    fetchData();
+    let userPermissions = JSON.parse(session.data?.userRoles);
+    let routerUserId = router.query.id ;
+
+    let nextPersonIdentifier = "";
+    //Commented as this needs to be worked on later..
+    // checking curator_self
+   /* if (userPermissions.length === 1 &&  userPermissions.some(role => role.roleLabel === allowedPermissions.Curator_Self && 'aaa2020' != routerUserId) ){
+        toastMessage("error", "You do not have access to view  page");
+        //userPermissions.map((id)=>{ nextPersonIdentifier = id.personIdentifier})
+        //router.push(`/curate/${routerUserId}`,`/curate/aaa2020`,{shallow : true});
+    }else{
+      userPermissions.map((id)=>{ nextPersonIdentifier = id.personIdentifier})
+      console.log('nextPersonIdentifier',nextPersonIdentifier);
+      setNewId('aaa2020');
+      dispatch(identityFetchData('aaa2020'));
+      fetchData();
+    }*/
+     setNewId('${routerUserId}');
+     dispatch(identityFetchData(routerUserId));
+     fetchData();
   }, [])
 
   const fetchData = () => {
@@ -59,6 +84,7 @@ const CurateIndividual = () => {
 
   return (
       <div className={appStyles.mainContainer}>
+       <ToastContainerWrapper />
         <h1 className={styles.header}>Curate Publications</h1>
         {
           identityData &&
@@ -95,7 +121,7 @@ const CurateIndividual = () => {
 
       {reciterData.reciterPending && reciterData.reciterPending.length > 0 &&
         <SuggestionsBanner
-          uid={id}
+          uid={newId}
           count={reciterData.reciterPending.length}
         />
       }

src/components/elements/CurateIndividual/ReciterTabs.tsx

@@ -5,31 +5,34 @@ import ReciterTabContent from "./ReciterTabContent";
 import styles from "./CurateIndividual.module.css";
 import { RootStateOrAny, useSelector } from "react-redux";
 import TabAddPublication from "../TabAddPublication/TabAddPublication";
+import { allowedPermissions } from "../../../utils/constants";
+import { useSession } from "next-auth/client";
 
 
 const ReciterTabs = ({ reciterData, fullName, fetchOriginalData }: { reciterData: any, fullName: string, fetchOriginalData: any }) => {
   //default tab
   const [key, setKey] = useState('NULL');
   const [filteredData, setFilteredData] = useState([])
   const [pubKey, setPubKey] = useState(false);
+  const [session, loading] = useSession();
   const isSearchText = useSelector((state: RootStateOrAny) => state.curateSearchtext)
 
   const addnewtabName = <p id="addnewtabName" className="noSpace" >Add New record:</p>
   const pubMedTabName = <p id="pubMedTabName" className="text-primary noSpace" ><span >PubMed</span></p>
 
   const tabsData = [
-    { name: 'Suggested', value: 'NULL' },
-    { name: 'Accepted', value: 'ACCEPTED' },
-    { name: 'Rejected', value: 'REJECTED' },
-    { name: addnewtabName, value: 'addNewRecord' },
-    { name: pubMedTabName, value: 'AddPub' },
+    { name: 'Suggested', value: 'NULL',allowedRoleNames: ["Superuser", "Curator_All","Curator_Self"] },
+    { name: 'Accepted', value: 'ACCEPTED',allowedRoleNames: ["Superuser", "Curator_All","Curator_Self"] },
+    { name: 'Rejected', value: 'REJECTED',allowedRoleNames: ["Superuser", "Curator_All","Curator_Self"] },
+    { name: addnewtabName, value: 'addNewRecord',allowedRoleNames: ["Superuser","Curator_Self","Curator_All"] },
+    { name: pubMedTabName, value: 'AddPub', allowedRoleNames: ["Superuser","Curator_Self","Curator_All"] },
   ]
 
   useEffect(() => {
     let publicationsPerTabs = [];
     tabsData.forEach((tab) => {
       let filteredReciterData = filterPublications(reciterData, tab.value, "");
-      publicationsPerTabs.push({ value: tab.value, name: tab.name, data: filteredReciterData, count: filteredReciterData.length })
+      publicationsPerTabs.push({ value: tab.value, name: tab.name, data: filteredReciterData, count: filteredReciterData.length, allowedRoleNames: tab.allowedRoleNames})
     })
     setFilteredData(publicationsPerTabs);
   }, [])
@@ -96,6 +99,9 @@ const ReciterTabs = ({ reciterData, fullName, fetchOriginalData }: { reciterData
         className={`${styles.tabsContainer}`}
       > {
           filteredData.map((tabData: any, index: number) => {
+            let userPermissions = JSON.parse(session.data.userRoles);
+            const matchedRoles = userPermissions.filter(role => tabData.allowedRoleNames.includes(role.roleLabel));
+            if(matchedRoles.length >= 1){
             return (
               <Tab
                 eventKey={tabData.value}
@@ -127,6 +133,7 @@ const ReciterTabs = ({ reciterData, fullName, fetchOriginalData }: { reciterData
                 }
               </Tab>
             )
+              }
           })
         }
       </Tabs>

src/components/elements/Dropdown/SplitDropdown.tsx

@@ -13,9 +13,10 @@ interface DropdownProps {
   secondary?: boolean,
   disabled?: boolean,
   onDropDownClick:any,
+  isUserRole:any
 }
 
-const SplitDropdown: React.FC<DropdownProps> = ({ title, to, onClick, id, listItems, secondary,onDropDownClick,disabled}) => {
+const SplitDropdown: React.FC<DropdownProps> = ({ isUserRole,title, to, onClick, id, listItems, secondary,onDropDownClick,disabled}) => {
 
   return (
     <div className="mt-2">

src/components/elements/Login/Login.js

@@ -5,18 +5,21 @@ import { Footer } from "../Footer/Footer";
 import ToastContainerWrapper from "../ToastContainerWrapper/ToastContainerWrapper"
 import Router from "next/router"
 import Header from "../Header/Header"
-import { signIn } from "next-auth/client"
+import { signIn,getSession } from "next-auth/client"
 import { toast } from "react-toastify"
+import { allowedPermissions } from "../../../utils/constants";
+
 
 const Login = () => {
 
     const [invalidCredentialsFlag, setInvalidCredentialsFlag] = useState(false)
     const [username, setUsername] = useState("")
     const [password, setPassword] = useState("")
     const [isShowButton, setIsShowButton] = useState(true)
+    const session = getSession();
 
    useEffect(() => {
-
+        
     })
 
     const validateForm = () => {
@@ -48,7 +51,19 @@ const Login = () => {
                 autoClose: 2000,
                 theme: "colored"
             });
-            Router.push(`${window.location.origin}/search`);
+            //if(session && session.data && session.data.userRoles)
+             getSession().then((session) => {
+                if (session) {
+                    let userPermissions = JSON.parse(session.data.userRoles);
+                    let userName = session.data.username;
+                    let personIdentifier = userPermissions && userPermissions.length > 0 ? userPermissions[0].personIdentifier : ""
+                    if((userPermissions.some(role => role.roleLabel === allowedPermissions.Curator_Self)) && userName)  
+                        Router.push(`${window.location.origin}/curate/${personIdentifier}`);
+                    else 
+                        Router.push(`${window.location.origin}/search`);
+                } 
+            });
+
         } else {
             setInvalidCredentialsFlag(true)
             toast.error("Invalid credentials", {

src/components/elements/Navbar/NestedListItem.tsx

@@ -10,7 +10,9 @@ import { MenuItem } from "../../../../types/menu";
 import Image from 'next/image';
 import MenuListItem from "./MenuListItem";
 import Box from '@mui/material/Box';
-import styles from './Navbar.module.css'
+import styles from './Navbar.module.css';
+import { useSession } from 'next-auth/client';
+
 
 type ImageSourcePropType = React.ComponentProps<typeof Image>['src']
 
@@ -22,6 +24,8 @@ type NestedListItemProps = {
 
 const NestedListItem: React.FC<NestedListItemProps> = ({ header, menuItems, imgUrl}) => {
   const [open, setOpen] = React.useState(false);
+  const [session, loading] = useSession();
+
 
   const handleClick = () => {
     setOpen(!open);
@@ -31,33 +35,37 @@ const NestedListItem: React.FC<NestedListItemProps> = ({ header, menuItems, imgU
     <>
       <ListItemButton onClick={handleClick}>
         <ListItemIcon>
-          <Image 
-              src={imgUrl || ""}
-              height={15}
-              width={15}
-              alt='Menu Icon'
-            />
+          <Image
+            src={imgUrl || ""}
+            height={15}
+            width={15}
+            alt='Menu Icon'
+          />
         </ListItemIcon>
         <ListItemText primary={header} />
         {open ? <ExpandLess /> : <ExpandMore />}
       </ListItemButton>
       <Collapse in={open} timeout="auto" unmountOnExit>
-      <List component="div" disablePadding>
-        {
-          menuItems.map((item: MenuItem, index: number) => {
-            return (
-              <Box p={2} key={index} className={styles.subMenu}>
-                <MenuListItem
-                  title={item.title}
-                  to={item.to}
-                  id={index}
-                  imgUrl={item.imgUrl}
-                  imgUrlActive={item.imgUrlActive}
-                />
-              </Box>
-            )
-          })
-        }
+        <List component="div" disablePadding>
+          {
+            menuItems.map((item: MenuItem, index: number) => {
+              let userPermissions = JSON.parse(session.data.userRoles);
+              const matchedRoles = userPermissions.filter(role => item.allowedRoleNames.includes(role.roleLabel));
+              if (matchedRoles.length >= 1) {
+                return (
+                  <Box p={2} key={index} className={styles.subMenu}>
+                    <MenuListItem
+                      title={item.title}
+                      to={item.to}
+                      id={index}
+                      imgUrl={item.imgUrl}
+                      imgUrlActive={item.imgUrlActive}
+                    />
+                  </Box>
+                )
+              }
+            })
+          }
         </List>
       </Collapse>
     </>

src/components/elements/Navbar/SideNavbar.tsx

@@ -19,6 +19,7 @@ import settingsIconActive from '../../../../public/images/icon-side-faculty_admi
 import chartIconActive from '../../../../public/images/icon-side-faculty_report-active.png';
 import checkMarkIconActive from '../../../../public/images/icon-side-check_mark-active.png';
 import { useSelector, RootStateOrAny } from "react-redux";
+import { useSession } from 'next-auth/client';
 
 type SideNavBarProps = {
     items: any
@@ -135,6 +136,9 @@ const SideNavbar: React.FC<SideNavBarProps> = () => {
   const theme = useTheme();
   const [open, setOpen] = React.useState(true);
   const filters = useSelector((state: RootStateOrAny) => state.filters)
+
+  const [isCurateSelf, setIsCurateSelf] = React.useState(false);
+  const [session, loading] = useSession();
 
   const menuItems: Array<MenuItem> = [
     {
@@ -143,33 +147,45 @@ const SideNavbar: React.FC<SideNavBarProps> = () => {
       imgUrl: facultyIcon,
       imgUrlActive: facultyIconActive,
       disabled: false,
+      allowedRoleNames: ["Superuser", "Curator_All","Reporter_All"],
     },
     {
       title: 'Curate Publications',
       to: '/curate',
       imgUrl: settingsIcon,
       imgUrlActive: settingsIconActive,
       disabled: (Object.keys(filters).length === 0),
+      allowedRoleNames: ["Superuser", "Curator_All","Curator_Self"],
     },
     {
       title: 'Create Reports',
       to: '/report',
       imgUrl: chartIcon,
       imgUrlActive: chartIconActive,
       disabled: false,
+      allowedRoleNames: ["Superuser","Reporter_All" ],
     },
-    {
-      title: 'Perform Analysis',
-      to: '/login',
-      imgUrl: checkMarkIcon,
-      imgUrlActive: checkMarkIconActive,
-      disabled: false,
-    },
+    // {
+    //   title: 'Perform Analysis',
+    //   to: '/login',
+    //   imgUrl: checkMarkIcon,
+    //   imgUrlActive: checkMarkIconActive,
+    //   disabled: false,
+    //   allowedRoleNames: ["Superuser","Reporter_All" ],
+    // },
     {
       title: 'Manage Module',
       imgUrl: settingsIcon,
       imgUrlActive: settingsIconActive,
-      nestedMenu: [{title: 'Manage Users', to: '/admin/manage/users', imgUrl: facultyIcon, imgUrlActive: facultyIconActive, disabled: false,}]
+      nestedMenu: [{title: 'Add Users', 
+      to: '/admin/add/users', 
+      imgUrl: facultyIcon, 
+      imgUrlActive: facultyIconActive, 
+      disabled: false,
+      allowedRoleNames: ["Superuser"],
+    }],
+      allowedRoleNames: ["Superuser"],
+
     }
   ]
 
@@ -192,6 +208,9 @@ const SideNavbar: React.FC<SideNavBarProps> = () => {
       <StyledList>
           {
             menuItems.map((item: MenuItem, index: number) => {
+              let userPermissions = JSON.parse(session.data.userRoles);
+              const matchedRoles = userPermissions.filter(role => item.allowedRoleNames.includes(role.roleLabel));
+              if(matchedRoles.length >= 1){
               return item.nestedMenu ? 
                 <NestedListItem 
                   header={item.title}
@@ -209,6 +228,7 @@ const SideNavbar: React.FC<SideNavBarProps> = () => {
                   imgUrlActive={item.imgUrlActive}
                   disabled={item.disabled}
                 />
+              }
             })
           }
       </StyledList>