fixed assign role api and handle delete user on role based

Author: talhainvenxion

src/ui/layouts/pipelines/Pipelines/AllRuns/useService.ts

@@ -3,6 +3,7 @@ import { runsActions } from '../../../../../redux/actions';
 import {
   runSelectors,
   runPagesSelectors,
+  projectSelectors,
 } from '../../../../../redux/selectors';
 import { useDispatch, useSelector } from '../../../../hooks';
 
@@ -15,11 +16,12 @@ export const useService = (): ServiceInterface => {
   const fetching = useSelector(runPagesSelectors.fetching);
   const dispatch = useDispatch();
   const runs = useSelector(runSelectors.myRuns);
+  const selectedProject = useSelector(projectSelectors.selectedProject);
 
   useEffect(() => {
     const intervalId = setInterval(() => {
       //assign interval to a variable to clear it.
-      dispatch(runsActions.allRuns({}));
+      dispatch(runsActions.allRuns({ project: selectedProject }));
     }, 5000);
 
     return () => clearInterval(intervalId); //This is important

src/ui/layouts/settings/Organization/InvitePopup.tsx

@@ -38,7 +38,8 @@ export const InvitePopup: React.FC<{
   const invite = useSelector(organizationSelectors.invite);
   const roles = useSelector(rolesSelectors.getRoles);
 
-  const [role, setrole] = useState('');
+  const [role, setRole] = useState('');
+
   const authToken = useSelector(sessionSelectors.authenticationToken);
 
   const inviteNewMembers = () => {
@@ -62,8 +63,12 @@ export const InvitePopup: React.FC<{
             };
             axios
               .post(
-                `${process.env.REACT_APP_BASE_API_URL}/users/${user.id}/roles?role_name_or_id=${role}`,
-                {},
+                // users/${user.id}/roles?role_name_or_id=${role}
+                `${process.env.REACT_APP_BASE_API_URL}/role_assignments`,
+                {
+                  user: user.id,
+                  role: role,
+                },
                 { headers },
               )
               .then(() => {
@@ -93,8 +98,8 @@ export const InvitePopup: React.FC<{
       );
     }
   };
-  function handleChange(value: any) {
-    setrole(value);
+  function handleChange(value: string) {
+    setRole(value);
   }
 
   return (
@@ -126,37 +131,40 @@ export const InvitePopup: React.FC<{
                 }}
               />
             </Box>
-            <Box marginLeft="md">
-              <FlexBox.Column fullWidth>
-                <Box paddingBottom="xs">
-                  <Paragraph size="body" style={{ color: 'black' }}>
-                    <label htmlFor={name}>{'Roles'}</label>
-                  </Paragraph>
-                </Box>
-                <select
-                  onChange={(e: any) => handleChange(e.target.value)}
-                  value={role}
-                  placeholder={'Roles'}
-                  className={cn(styles.input)}
-                  style={{
-                    // borderTopRightRadius: 0,
-                    // borderBottomRightRadius: 0,
-                    width: '146px',
-                    fontSize: '12px',
-                    color: '#424240',
-                  }}
-                >
-                  <option selected disabled value="">
-                    {'Roles'}
-                  </option>
-                  {roles.map((option, index) => (
-                    <option key={index} value={option.name}>
-                      {option.name.toUpperCase()}
+            {!showTokField && (
+              <Box marginLeft="md">
+                <FlexBox.Column fullWidth>
+                  <Box paddingBottom="xs">
+                    <Paragraph size="body" style={{ color: 'black' }}>
+                      <label htmlFor={name}>{'Roles'}</label>
+                    </Paragraph>
+                  </Box>
+
+                  <select
+                    onChange={(e: any) => handleChange(e.target.value)}
+                    value={role}
+                    placeholder={'Roles'}
+                    className={cn(styles.input)}
+                    style={{
+                      // borderTopRightRadius: 0,
+                      // borderBottomRightRadius: 0,
+                      width: '146px',
+                      fontSize: '12px',
+                      color: '#424240',
+                    }}
+                  >
+                    <option selected disabled value="">
+                      {'Roles'}
                     </option>
-                  ))}
-                </select>
-              </FlexBox.Column>
-            </Box>
+                    {roles.map((option) => (
+                      <option key={option.id} value={option.id}>
+                        {option.name.toUpperCase()}
+                      </option>
+                    ))}
+                  </select>
+                </FlexBox.Column>
+              </Box>
+            )}
 
             {!showTokField && (
               <Box style={{ width: '10%', marginTop: '27px' }} marginLeft="md">

src/ui/layouts/settings/Organization/index.tsx

@@ -23,7 +23,9 @@ type Table = 'members' | 'invites';
 export const Organization: React.FC = () => {
   const dispatch = useDispatch();
   const authToken = useSelector(sessionSelectors.authenticationToken);
-  var decoded: any = jwt_decode(authToken as any);
+  if (authToken) {
+    var decoded: any = jwt_decode(authToken as any);
+  }
   const [fetchingMembers, setFetchingMembers] = useState(true);
 
   const [popupOpen, setPopupOpen] = useState(false);
@@ -39,6 +41,7 @@ export const Organization: React.FC = () => {
   } = useService();
 
   const memberHeaderCols = useMemberHeaderCols({
+    decoded,
     filteredMembers,
     setFilteredMembers: setFilteredMembers,
     activeSorting,

src/ui/layouts/settings/Organization/useHeaderCols.tsx

@@ -75,13 +75,15 @@ export const useInviteHeaderCols = (): HeaderCol[] => {
 const headColStyle = { color: '#000', fontWeight: 700 };
 
 export const useMemberHeaderCols = ({
+  decoded,
   filteredMembers,
   setFilteredMembers,
   activeSorting,
   activeSortingDirection,
   setActiveSortingDirection,
   setActiveSorting,
 }: {
+  decoded: any;
   filteredMembers: TMember[];
   setFilteredMembers: (members: TMember[]) => void;
   activeSorting: Sorting | null;
@@ -221,7 +223,7 @@ export const useMemberHeaderCols = ({
         </FlexBox>
       ),
     },
-    {
+    decoded.permissions.includes('write') && {
       render: () => <Paragraph size="small"></Paragraph>,
       width: '5%',
       renderRow: (member: TInvite) => (

src/ui/layouts/settings/PersonalDetails.tsx

@@ -40,7 +40,10 @@ export const PersonalDetails: React.FC = () => {
   const [confirmPassword, setConfirmPassword] = useState('');
 
   const authToken = useSelector(sessionSelectors.authenticationToken);
-  var decoded: any = jwt_decode(authToken as any);
+  if (authToken) {
+    var decoded: any = jwt_decode(authToken as any);
+  }
+
   if (!user) return null;
 
   const forgotPassword = () => {