fix: issue #112

src/constants/index.js

@@ -201,6 +201,11 @@ export const ACTION_TYPE = {
   AUTH_LOAD_TEAM_MEMBERS_ERROR: "AUTH_LOAD_TEAM_MEMBERS_ERROR",
   AUTH_CLEAR_TEAM_MEMBERS: "AUTH_CLEAR_TEAM_MEMBERS",
 
+  AUTH_LOAD_V5_USER_PROFILE: "AUTH_LOAD_V5_USER_PROFILE",
+  AUTH_LOAD_V5_USER_PROFILE_PENDING: "AUTH_LOAD_V5_USER_PROFILE_PENDING",
+  AUTH_LOAD_V5_USER_PROFILE_SUCCESS: "AUTH_LOAD_V5_USER_PROFILE_SUCCESS",
+  AUTH_LOAD_V5_USER_PROFILE_ERROR: "AUTH_LOAD_V5_USER_PROFILE_ERROR",
+
   /*
     Email Popup
    */

src/hoc/withAuthentication/actions/index.js

@@ -2,7 +2,7 @@
  * Auth User actions
  */
 import { ACTION_TYPE } from "constants";
-import { getTeamMembers } from "services/teams";
+import { getTeamMembers, getV5UserProfile } from "services/teams";
 
 /**
  * Action to set auth user data
@@ -40,6 +40,19 @@ export const authLoadTeamMembers = (teamId) => ({
   },
 });
 
+/**
+ * Loads v5 user profile for authentication/permission purposes
+ *
+ * @returns {Promise} loaded user profile
+ */
+export const authLoadV5UserProfile = () => ({
+  type: ACTION_TYPE.AUTH_LOAD_V5_USER_PROFILE,
+  payload: async () => {
+    const res = await getV5UserProfile();
+    return res.data;
+  },
+});
+
 /**
  * Clear team members for authentication/permission purposes
  *

src/hoc/withAuthentication/index.js

@@ -19,6 +19,7 @@ import {
   authUserSuccess,
   authUserError,
   authLoadTeamMembers,
+  authLoadV5UserProfile,
   authClearTeamMembers,
 } from "./actions";
 import { decodeToken } from "tc-auth-lib";
@@ -34,6 +35,9 @@ export default function withAuthentication(Component) {
       teamId,
       teamMembersLoaded,
       teamMembersLoadingError,
+      v5UserProfile,
+      v5UserProfileLoading,
+      v5UserProfileLoadingError,
     } = useSelector((state) => state.authUser);
     const params = useParams();
 
@@ -86,18 +90,27 @@ export default function withAuthentication(Component) {
       }
     }, [params.teamId, teamId, dispatch, isLoggedIn]);
 
+    useEffect(() => {
+      if (isLoggedIn) {
+        dispatch(authLoadV5UserProfile());
+      }
+    }, [dispatch, isLoggedIn]);
+
     return (
       <>
         {/* Show loading indicator until we know if user is logged-in or no.
             Also, show loading indicator if we need to know team members but haven't loaded them yet.
+            or load v5 user profile but haven't loaded them yet.
             In we got error during this process, show error */}
         {isLoggedIn === null ||
-          (params.teamId && !teamMembersLoaded && (
-            <LoadingIndicator error={authError || teamMembersLoadingError} />
+          ((params.teamId && !teamMembersLoaded || v5UserProfileLoading || v5UserProfileLoadingError)&& (
+            <LoadingIndicator error={authError || teamMembersLoadingError || v5UserProfileLoadingError} />
           ))}
 
         {/* Show component only if user is logged-in and if we don't need team members or we already loaded them */}
-        {isLoggedIn === true && (!params.teamId || teamMembersLoaded) ? (
+        {isLoggedIn === true &&
+        v5UserProfile &&
+        (!params.teamId || teamMembersLoaded) ? (
           <Component {...props} />
         ) : null}
       </>

src/hoc/withAuthentication/reducers/index.js

@@ -16,6 +16,9 @@ const initialState = {
   teamMembersLoading: undefined,
   teamMembersLoadingError: undefined,
   teamMembersLoaded: false,
+  v5UserProfile: undefined,
+  v5UserProfileLoading: false,
+  v5UserProfileLoadingError: false,
 };
 
 const authInitialState = _.pick(initialState, [
@@ -95,6 +98,28 @@ const reducer = (state = initialState, action) => {
       };
     }
 
+    case ACTION_TYPE.AUTH_LOAD_V5_USER_PROFILE_PENDING: {
+      return {
+        ...state,
+        v5UserProfileLoading: true,
+      };
+    }
+    case ACTION_TYPE.AUTH_LOAD_V5_USER_PROFILE_SUCCESS: {
+      return {
+        ...state,
+        v5UserProfile: action.payload,
+        v5UserProfileLoading: false,
+        v5UserProfileLoadingError: false,
+      };
+    }
+    case ACTION_TYPE.AUTH_LOAD_V5_USER_PROFILE_ERROR: {
+      return {
+        ...state,
+        v5UserProfileLoadingError: action.payload,
+        v5UserProfileLoading: false,
+      };
+    }
+
     default:
       return state;
   }

src/routes/JobDetails/index.jsx

@@ -5,6 +5,7 @@
  * It gets `teamId` and `jobId` from the router.
  */
 import React, { useEffect, useState } from "react";
+import { useSelector } from "react-redux";
 import PT from "prop-types";
 import _ from "lodash";
 import Page from "../../components/Page";
@@ -32,6 +33,7 @@ const JobDetails = ({ teamId, jobId }) => {
   const [job, loadingError] = useData(getJobById, jobId);
   const [skills] = useData(getSkills);
   const [skillSet, setSkillSet] = useState(null);
+  const { id: userId } = useSelector((state) => state.authUser.v5UserProfile);
 
   useEffect(() => {
     if (!!skills && !!job) {
@@ -106,7 +108,8 @@ const JobDetails = ({ teamId, jobId }) => {
                 {job.status}
               </DataItem>
             </div>
-            {hasPermission(PERMISSIONS.UPDATE_JOB_NOT_OWN) && (
+            {(hasPermission(PERMISSIONS.UPDATE_JOB_NOT_OWN) ||
+              userId === job.createdBy) && (
               <div styleName="actions">
                 <Button
                   target="_blank"

src/services/teams.js

@@ -22,6 +22,15 @@ export const getMyTeams = (name, page = 1, perPage) => {
   return axios.get(`${config.API.V5}/taas-teams?${query}`);
 };
 
+/**
+ * Get v5 user profile.
+ *
+ * @returns {Promise<{}>} user profile object
+ */
+export const getV5UserProfile = () => {
+  return axios.get(`${config.API.V5}/taas-teams/me`);
+};
+
 /**
  * Get team by id.
  *