feat: [M3-8704] - Disable Create Firewall button with tooltip text on…

… Landing Page for restricted users

packages/manager/src/features/Firewalls/FirewallLanding/FirewallLanding.tsx

@@ -19,8 +19,10 @@ import { useFlags } from 'src/hooks/useFlags';
 import { useOrder } from 'src/hooks/useOrder';
 import { usePagination } from 'src/hooks/usePagination';
 import { useSecureVMNoticesEnabled } from 'src/hooks/useSecureVMNoticesEnabled';
+import { useRestrictedGlobalGrantCheck } from 'src/hooks/useRestrictedGlobalGrantCheck';
 import { useFirewallsQuery } from 'src/queries/firewalls';
 import { getAPIErrorOrDefault } from 'src/utilities/errorUtils';
+import { getRestrictedResourceText } from 'src/features/Account/utils';
 
 import { CreateFirewallDrawer } from './CreateFirewallDrawer';
 import { FirewallDialog } from './FirewallDialog';
@@ -73,6 +75,10 @@ const FirewallLanding = () => {
     (firewall) => firewall.id === selectedFirewallId
   );
 
+  const isFirewallsCreationRestricted = useRestrictedGlobalGrantCheck({
+    globalGrantType: 'add_firewalls',
+  });
+
   const openModal = (mode: Mode, id: number) => {
     setSelectedFirewallId(id);
     setDialogMode(mode);
@@ -148,8 +154,16 @@ const FirewallLanding = () => {
         breadcrumbProps={{ pathname: '/firewalls' }}
         docsLink="https://techdocs.akamai.com/cloud-computing/docs/getting-started-with-cloud-firewalls"
         entity="Firewall"
+        disabledCreateButton={isFirewallsCreationRestricted}
         onButtonClick={onOpenCreateDrawer}
         title="Firewalls"
+        buttonDataAttrs={{
+          tooltipText: getRestrictedResourceText({
+            action: 'create',
+            isSingular: false,
+            resourceType: 'Firewalls',
+          }),
+        }}
       />
       <Table aria-label="List of services attached to each firewall">
         <TableHead>