fix: project intake viewer permission validation (#5408)

web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/inbox/header.tsx

@@ -9,8 +9,10 @@ import { Breadcrumbs, Button, Intake } from "@plane/ui";
 // components
 import { BreadcrumbLink, Logo } from "@/components/common";
 import { InboxIssueCreateEditModalRoot } from "@/components/inbox";
+// constants
+import { EUserProjectRoles } from "@/constants/project";
 // hooks
-import { useProject, useProjectInbox } from "@/hooks/store";
+import { useProject, useProjectInbox, useUser } from "@/hooks/store";
 
 export const ProjectInboxHeader: FC = observer(() => {
   // states
@@ -18,9 +20,15 @@ export const ProjectInboxHeader: FC = observer(() => {
   // router
   const { workspaceSlug, projectId } = useParams();
   // store hooks
+  const {
+    membership: { currentProjectRole },
+  } = useUser();
   const { currentProjectDetails, loader: currentProjectDetailsLoader } = useProject();
   const { loader } = useProjectInbox();
 
+  // derived value
+  const isViewer = currentProjectRole === EUserProjectRoles.VIEWER;
+
   return (
     <div className="relative z-10 flex h-[3.75rem] w-full flex-shrink-0 flex-row items-center justify-between gap-x-2 gap-y-4 bg-custom-sidebar-background-100 p-4">
       <div className="flex w-full flex-grow items-center gap-2 overflow-ellipsis whitespace-nowrap">
@@ -58,7 +66,7 @@ export const ProjectInboxHeader: FC = observer(() => {
         </div>
       </div>
 
-      {currentProjectDetails?.inbox_view && workspaceSlug && projectId && (
+      {currentProjectDetails?.inbox_view && workspaceSlug && projectId && !isViewer && (
         <div className="flex items-center gap-2">
           <InboxIssueCreateEditModalRoot
             workspaceSlug={workspaceSlug.toString()}