PM-1157 Add fallback content for copilot requests when access denied

Author: himaniraghav3

src/apps/copilots/src/pages/copilot-requests/index.tsx

@@ -1,4 +1,4 @@
-import { FC, useCallback, useMemo } from 'react'
+import { FC, useCallback, useContext, useMemo } from 'react'
 import { find } from 'lodash'
 import { NavigateFunction, Params, useNavigate, useParams } from 'react-router-dom'
 
@@ -14,6 +14,7 @@ import {
     TableColumn,
     useConfirmationModal,
 } from '~/libs/ui'
+import { profileContext, ProfileContextData, UserRole } from '~/libs/core'
 
 import { ProjectTypeLabels } from '../../constants'
 import { approveCopilotRequest, CopilotRequestsResponse, useCopilotRequests } from '../../services/copilot-requests'
@@ -121,6 +122,12 @@ const CopilotRequestsPage: FC = () => {
     const navigate: NavigateFunction = useNavigate()
     const routeParams: Params<string> = useParams()
 
+    const { profile }: ProfileContextData = useContext(profileContext)
+    const isAdminOrPM: boolean = useMemo(
+        () => !!profile?.roles?.some(role => role === UserRole.administrator || role === UserRole.projectManager),
+        [profile],
+    )
+
     const { data: requests = [], isValidating: requestsLoading }: CopilotRequestsResponse = useCopilotRequests()
     const projectIds = useMemo(() => (
         (new Set(requests.map(r => r.projectId))
@@ -158,6 +165,15 @@ const CopilotRequestsPage: FC = () => {
         onClick: () => navigate(copilotRoutesMap.CopilotRequestForm),
     }
 
+    if (!isAdminOrPM) {
+        return (
+            <ContentLayout title='Copilot Requests'>
+                <PageTitle>Access Denied</PageTitle>
+                <p>You do not have required permissions to access this page.</p>
+            </ContentLayout>
+        )
+    }
+
     return (
         <ContentLayout
             title='Copilot Requests'