[Security Solution] Disable installation button for users with Securi…

…ty:Read privileges (#176598)

Fixes: #161543

## Summary

Original bug issue reported an infinite loading state in the **Add
Elastic rules** page when user doesn't have write privileges, i.e. has
`Security: Read`.

However, that seems to have been fixed already, as the list of rules to
install is shown, but no individual "Install button" for each row is
showed. **This is expected behaviour**.

![image](https://github.com/elastic/kibana/assets/5354282/f57adc2b-9073-4019-a15e-8c05e48f1b9d)

However, when displaying the Rule Details flyout, the button for
Installation in the flyout is still enabled due to missing checks. This
PR fixes that and now displays a disabled button for users with no
privileges.

![image](https://github.com/elastic/kibana/assets/5354282/70a6b209-59bb-4199-99f9-f2222fb78d68)

### For maintainers

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

(cherry picked from commit c3c1b66)

x-pack/plugins/security_solution/public/detection_engine/rule_management_ui/components/rules_table/add_prebuilt_rules_table/add_prebuilt_rules_table_context.tsx

@@ -8,6 +8,7 @@
 import type { Dispatch, SetStateAction } from 'react';
 import React, { createContext, useCallback, useContext, useMemo, useState } from 'react';
 import { EuiButton } from '@elastic/eui';
+import { useUserData } from '../../../../../detections/components/user_info';
 import { useFetchPrebuiltRulesStatusQuery } from '../../../../rule_management/api/hooks/prebuilt_rules/use_fetch_prebuilt_rules_status_query';
 import { useIsUpgradingSecurityPackages } from '../../../../rule_management/logic/use_upgrade_security_packages';
 import type { RuleSignatureId } from '../../../../../../common/api/detection_engine';
@@ -99,6 +100,8 @@ export const AddPrebuiltRulesTableContextProvider = ({
   const [loadingRules, setLoadingRules] = useState<RuleSignatureId[]>([]);
   const [selectedRules, setSelectedRules] = useState<RuleResponse[]>([]);
 
+  const [{ loading: userInfoLoading, canUserCRUD }] = useUserData();
+
   const [filterOptions, setFilterOptions] = useState<AddPrebuiltRulesTableFilterOptions>({
     filter: '',
     tags: [],
@@ -135,11 +138,13 @@ export const AddPrebuiltRulesTableContextProvider = ({
   const filteredRules = useFilterPrebuiltRulesToInstall({ filterOptions, rules });
 
   const { openRulePreview, closeRulePreview, previewedRule } = useRuleDetailsFlyout(filteredRules);
-  const canPreviewedRuleBeInstalled = Boolean(
-    (previewedRule?.rule_id && loadingRules.includes(previewedRule.rule_id)) ||
-      isRefetching ||
-      isUpgradingSecurityPackages
-  );
+
+  const isPreviewRuleLoading =
+    previewedRule?.rule_id && loadingRules.includes(previewedRule.rule_id);
+  const canPreviewedRuleBeInstalled =
+    !userInfoLoading &&
+    canUserCRUD &&
+    !(isPreviewRuleLoading || isRefetching || isUpgradingSecurityPackages);
 
   const installOneRule = useCallback(
     async (ruleId: RuleSignatureId) => {
@@ -237,7 +242,7 @@ export const AddPrebuiltRulesTableContextProvider = ({
             closeFlyout={closeRulePreview}
             ruleActions={
               <EuiButton
-                disabled={canPreviewedRuleBeInstalled}
+                disabled={!canPreviewedRuleBeInstalled}
                 onClick={() => {
                   installOneRule(previewedRule.rule_id ?? '');
                   closeRulePreview();