From c911a7cd8115c820e21831f0ff08a3416f2e24df Mon Sep 17 00:00:00 2001
From: Daniel Hougaard <62331820+DanielHougaard@users.noreply.github.com>
Date: Fri, 5 Apr 2024 18:57:59 -0700
Subject: [PATCH] Fix: Don't display requested by when user has no access to
 read workspace members

---
 .../AccessApprovalRequest.tsx                 | 57 ++++++++++---------
 1 file changed, 31 insertions(+), 26 deletions(-)

diff --git a/frontend/src/views/SecretApprovalPage/components/AccessApprovalRequest/AccessApprovalRequest.tsx b/frontend/src/views/SecretApprovalPage/components/AccessApprovalRequest/AccessApprovalRequest.tsx
index 2421a629d..b6d69d0c9 100644
--- a/frontend/src/views/SecretApprovalPage/components/AccessApprovalRequest/AccessApprovalRequest.tsx
+++ b/frontend/src/views/SecretApprovalPage/components/AccessApprovalRequest/AccessApprovalRequest.tsx
@@ -30,6 +30,7 @@ import {
 } from "@app/components/v2";
 import {
   ProjectPermissionActions,
+  ProjectPermissionSub,
   useProjectPermission,
   useSubscription,
   useWorkspace
@@ -272,7 +273,7 @@ export const AccessApprovalRequest = ({
     "reviewRequest",
     "upgradePlan"
   ] as const);
-  const { membership } = useProjectPermission();
+  const { membership, permission } = useProjectPermission();
   const { subscription } = useSubscription();
   const { currentWorkspace } = useWorkspace();
 
@@ -460,33 +461,37 @@ export const AccessApprovalRequest = ({
                   ))}
                 </DropdownMenuContent>
               </DropdownMenu>
-              <DropdownMenu>
-                <DropdownMenuTrigger>
-                  <Button
-                    variant="plain"
-                    colorSchema="secondary"
-                    className={requestedByFilter ? "text-white" : "text-bunker-300"}
-                    rightIcon={<FontAwesomeIcon icon={faChevronDown} size="sm" className="ml-2" />}
-                  >
-                    Requested By
-                  </Button>
-                </DropdownMenuTrigger>
-                <DropdownMenuContent align="end">
-                  <DropdownMenuLabel>Select an author</DropdownMenuLabel>
-                  {members?.map(({ user, id }) => (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        setRequestedByFilter((state) => (state === id ? undefined : id))
+              {!!permission.can(ProjectPermissionActions.Read, ProjectPermissionSub.Member) && (
+                <DropdownMenu>
+                  <DropdownMenuTrigger>
+                    <Button
+                      variant="plain"
+                      colorSchema="secondary"
+                      className={requestedByFilter ? "text-white" : "text-bunker-300"}
+                      rightIcon={
+                        <FontAwesomeIcon icon={faChevronDown} size="sm" className="ml-2" />
                       }
-                      key={`request-filter-member-${id}`}
-                      icon={requestedByFilter === id && <FontAwesomeIcon icon={faCheckCircle} />}
-                      iconPos="right"
                     >
-                      {user.email}
-                    </DropdownMenuItem>
-                  ))}
-                </DropdownMenuContent>
-              </DropdownMenu>
+                      Requested By
+                    </Button>
+                  </DropdownMenuTrigger>
+                  <DropdownMenuContent align="end">
+                    <DropdownMenuLabel>Select an author</DropdownMenuLabel>
+                    {members?.map(({ user, id }) => (
+                      <DropdownMenuItem
+                        onClick={() =>
+                          setRequestedByFilter((state) => (state === id ? undefined : id))
+                        }
+                        key={`request-filter-member-${id}`}
+                        icon={requestedByFilter === id && <FontAwesomeIcon icon={faCheckCircle} />}
+                        iconPos="right"
+                      >
+                        {user.email}
+                      </DropdownMenuItem>
+                    ))}
+                  </DropdownMenuContent>
+                </DropdownMenu>
+              )}
             </div>
           </div>
           <div className="flex flex-col rounded-b-md border-x border-t border-b border-mineshaft-600 bg-mineshaft-800">