Merge pull request #1747 from OneCommunityGlobal/development

Frontend Release to Main [3.10]

Author: one-community

.gitignore

@@ -21,4 +21,6 @@ yarn-debug.log*
 yarn-error.log*
 /.idea
 
-.vscode/launch.json
+.vscode/launch.json
+
+**\ **

public/Portrait_Placeholder.png

@@ -49,6 +49,7 @@ export const Header = props => {
   const { isAuthenticated, user, firstName, profilePic } = props.auth;
 
   // Reports
+  const canGetReports = props.hasPermission('getReports');
   const canGetWeeklySummaries = props.hasPermission('getWeeklySummaries');
   // Users
 
@@ -137,24 +138,28 @@ export const Header = props => {
                   <span className="dashboard-text-link">{TIMELOG}</span>
                 </NavLink>
               </NavItem>
-              {canGetWeeklySummaries ? (
+              {(canGetReports || canGetWeeklySummaries) ? (
                 <UncontrolledDropdown nav inNavbar>
                   <DropdownToggle nav caret>
                     <span className="dashboard-text-link">{REPORTS}</span>
                   </DropdownToggle>
                   <DropdownMenu>
-                        <DropdownItem tag={Link} to="/reports">
-                          {REPORTS}
-                        </DropdownItem>
-                        <DropdownItem tag={Link} to="/weeklysummariesreport">
-                          {WEEKLY_SUMMARIES_REPORT}
-                        </DropdownItem>
+                        {canGetReports &&
+                          <DropdownItem tag={Link} to="/reports">
+                            {REPORTS}
+                          </DropdownItem>
+                        }
+                        {canGetWeeklySummaries &&
+                          <DropdownItem tag={Link} to="/weeklysummariesreport">
+                            {WEEKLY_SUMMARIES_REPORT}
+                          </DropdownItem>
+                        }
                         <DropdownItem tag={Link} to="/teamlocations">
                           {TEAM_LOCATIONS}
                         </DropdownItem>
                   </DropdownMenu>
               </UncontrolledDropdown>
-              ) : 
+              ) :
               <NavItem>
                 <NavLink tag={Link} to="/teamlocations">
                   {TEAM_LOCATIONS}

public/profilepic.webp

@@ -4,7 +4,7 @@ export const permissionLabels = [
     description: 'Category for all permissions related to reports',
     subperms: [
       {
-        label: 'See Analytics Reports (WIP)',
+        label: 'See Analytics Reports',
         key: 'getReports',
         description: 'Make ONLY "Reports -> “Reports” option appear/accessible.',
       },

src/components/Header/Header.jsx

@@ -15,6 +15,7 @@ import { boxStyle } from 'styles';
 import EditableInfoModal from 'components/UserProfile/EditableModal/EditableInfoModal';
 import PermissionsPresetsModal from './PermissionsPresetsModal.jsx';
 import { getPresetsByRole, createNewPreset } from 'actions/rolePermissionPresets';
+import hasPermission from '../../utils/permissions';
 
 
 function RolePermissions(props) {
@@ -27,6 +28,10 @@ function RolePermissions(props) {
   const history = useHistory();
   const [showPresetModal, setShowPresetModal] = useState(false);
 
+  const isEditableRole = props.role === 'Owner' ? props.hasPermission('addDeleteEditOwners') : props.auth.user.role !== props.role;
+  const canEditRole = isEditableRole && props.hasPermission('putRole');
+  const canDeleteRole = isEditableRole && props.hasPermission('deleteRole');
+
   useEffect(() => {
     setRoleName(props.role);
     props.getPresets(props.role);
@@ -109,7 +114,7 @@ function RolePermissions(props) {
         <div className="user-role-tab__name-container">
           <div className="name-container__role-name">
             <h1 className="user-role-tab__h1">Role Name: {roleName}</h1>
-            {props?.userRole === 'Owner' && (
+            {canEditRole && (
               <FontAwesomeIcon
                 icon={faEdit}
                 size="lg"
@@ -118,7 +123,7 @@ function RolePermissions(props) {
               />
             )}
           </div>
-          {props?.userRole === 'Owner' && (
+          {canEditRole && (
             <div style={{ flexDirection: 'row', display: 'flex' }}>
               <div className="name-container__btn_columns">
                 <div className="name-container__btns">
@@ -151,7 +156,7 @@ function RolePermissions(props) {
                   >
                     Save
                   </Button>
-                  <Button color="danger" onClick={toggleDeleteRoleModal} style={boxStyle}>
+                  <Button color="danger" onClick={toggleDeleteRoleModal} style={boxStyle} disabled={!canDeleteRole}>
                     Delete Role
                   </Button>
                 </div>
@@ -222,7 +227,7 @@ function RolePermissions(props) {
         <PermissionList
           rolePermissions={permissions}
           permissionsList={permissionLabel}
-          editable={true}
+          editable={canEditRole}
           setPermissions={setPermissions}
           onChange={()=>{setChanged(true)}}
         />
@@ -276,13 +281,14 @@ function RolePermissions(props) {
   );
 }
 
-const mapStateToProps = state => ({ roles: state.role.roles, presets: state.rolePreset.presets });
+const mapStateToProps = state => ({ roles: state.role.roles, presets: state.rolePreset.presets, auth: state.auth });
 
 const mapDispatchToProps = dispatch => ({
   getAllRoles: () => dispatch(getAllRoles()),
   updateRole: (roleId, updatedRole) => dispatch(updateRole(roleId, updatedRole)),
   getPresets: role => dispatch(getPresetsByRole(role)),
   createNewPreset: newPreset => dispatch(createNewPreset(newPreset)),
+  hasPermission: permission => dispatch(hasPermission(permission)),
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(RolePermissions);

src/components/PermissionsManagement/PermissionsConst.js

@@ -62,7 +62,6 @@ export class Projects extends Component {
   };
 
   onUpdateProjectName = (projectId, projectName, category, isActive) => {
-    console.log('updateName', projectId, projectName, category, isActive);
     this.props.modifyProject('updateName', projectId, projectName, category, isActive);
   };