Add RBAC check for new 'Create Rule' button on Rule Group page

machadoum · Aug 17, 2023 · e1b8690 · e1b8690
1 parent a67f7f5
commit e1b8690
Showing 1 changed file with 25 additions and 12 deletions.
diff --git a/x-pack/plugins/security_solution/public/rules/landing.tsx b/x-pack/plugins/security_solution/public/rules/landing.tsx
@@ -18,6 +18,10 @@ import { SecuritySolutionLinkButton } from '../common/components/links';
 import { useRootNavLink } from '../common/links/nav_links';
 import { useGlobalQueryString } from '../common/utils/global_query_string';
 import { trackLandingLinkClick } from '../common/lib/telemetry/trackers';
+import { useReadonlyHeader } from '../use_readonly_header';
+import { useUserData } from '../detections/components/user_info';
+import { READ_ONLY_BADGE_TOOLTIP } from './translations';
+import { hasUserCRUDPermission } from '../common/utils/privileges';
 
 const RULES_PAGE_TITLE = i18n.translate('xpack.securitySolution.rules.landing.pageTitle', {
   defaultMessage: 'Rules',
@@ -27,18 +31,27 @@ const CREATE_RULE_BUTTON = i18n.translate('xpack.securitySolution.rules.landing.
   defaultMessage: 'Create rule',
 });
 
-const RulesLandingHeader: React.FC = () => (
-  <EuiFlexGroup gutterSize="none" direction="row">
-    <EuiFlexItem>
-      <Title title={RULES_PAGE_TITLE} />
-    </EuiFlexItem>
-    <EuiFlexItem grow={false}>
-      <SecuritySolutionLinkButton deepLinkId={SecurityPageName.rulesCreate} iconType="plusInCircle">
-        {CREATE_RULE_BUTTON}
-      </SecuritySolutionLinkButton>
-    </EuiFlexItem>
-  </EuiFlexGroup>
-);
+const RulesLandingHeader: React.FC = () => {
+  const [{ canUserCRUD }] = useUserData();
+  useReadonlyHeader(READ_ONLY_BADGE_TOOLTIP);
+
+  return (
+    <EuiFlexGroup gutterSize="none" direction="row">
+      <EuiFlexItem>
+        <Title title={RULES_PAGE_TITLE} />
+      </EuiFlexItem>
+      <EuiFlexItem grow={false}>
+        <SecuritySolutionLinkButton
+          deepLinkId={SecurityPageName.rulesCreate}
+          iconType="plusInCircle"
+          isDisabled={!hasUserCRUDPermission(canUserCRUD)}
+        >
+          {CREATE_RULE_BUTTON}
+        </SecuritySolutionLinkButton>
+      </EuiFlexItem>
+    </EuiFlexGroup>
+  );
+};
 
 export const RulesLandingPage = () => {
   const { links = [], categories = [] } = useRootNavLink(SecurityPageName.rulesLanding) ?? {};