feat(HMS-1245): UI AWS permission check

RHEnVision · Aug 24, 2023 · d610f0b · d610f0b
1 parent de7afae
commit d610f0b
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 16 deletions.
diff --git a/src/API/index.js b/src/API/index.js
@@ -1,5 +1,5 @@
 import axios from 'axios';
-import { AZURE_PROVIDER } from '../constants';
+import { AWS_PROVIDER, AZURE_PROVIDER } from '../constants';
 import { imageBuilderURL, provisioningUrl } from './helpers';
 
 const typesUrlForProvider = (provider, region) => {
@@ -72,3 +72,12 @@ export const fetchLaunchTemplates = async (sourceID, region) => {
   } = await axios.get(provisioningUrl(`sources/${sourceID}/launch_templates?region=${region}`));
   return data;
 };
+
+export const checkPermissions = async (provider, sourceID, region) => {
+  switch (provider) {
+    case AWS_PROVIDER: {
+      const { data } = await axios.get(provisioningUrl(`sources/${sourceID}/validate_permissions?region=${region}`));
+      return data;
+    }
+  }
+};
diff --git a/src/API/queryKeys.js b/src/API/queryKeys.js
@@ -4,3 +4,4 @@ export const PUBKEYS_QUERY_KEY = 'pubkeys';
 export const instanceTypesQueryKeys = (region) => ['instanceTypes', region];
 export const IMAGE_REGIONS_KEY = 'image_region';
 export const TEMPLATES_KEY = 'templates';
+export const PERMISSION_CHECK_KEY = 'permissions';
diff --git a/src/Components/SourcesSelect/index.js b/src/Components/SourcesSelect/index.js
@@ -1,20 +1,30 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import { Alert, Select, SelectOption, Spinner } from '@patternfly/react-core';
+import { useQuery } from 'react-query';
 
 import { imageProps } from '../ProvisioningWizard/helpers';
 import { useSourcesForImage } from '../Common/Hooks/sources';
 import { useWizardContext } from '../Common/WizardContext';
+import { checkPermissions } from '../../API';
 
 const SourcesSelect = ({ setValidation, image }) => {
-  const [{ chosenSource }, setWizardContext] = useWizardContext();
+  const [{ chosenSource, chosenRegion }, setWizardContext] = useWizardContext();
   const [isOpen, setIsOpen] = React.useState(false);
   const [selected, setSelected] = React.useState(null);
   const selectObject = (id, name) => ({
     id,
     toString: () => name,
     compareTo: (other) => other.id === id,
   });
+  const { data: missingPermissions } = useQuery(
+    [`permissions`, `${chosenRegion}-${chosenSource}`],
+    () => checkPermissions(image.provider, chosenSource, chosenRegion),
+    {
+      select: (perm) => perm.missing_entities,
+      enabled: !!chosenRegion && !!chosenSource,
+    }
+  );
   const { isLoading, error, sources } = useSourcesForImage(image, {
     onSuccess: (sources) => {
       if (chosenSource) {
@@ -65,20 +75,37 @@ const SourcesSelect = ({ setValidation, image }) => {
   }
 
   return (
-    <Select
-      ouiaId="select_account"
-      isOpen={isOpen}
-      onToggle={(openState) => setIsOpen(openState)}
-      selections={selected}
-      maxHeight="180px"
-      // TODO decide if to disable the select
-      // isDisabled={sources?.length === 1}
-      onSelect={onSelect}
-      placeholderText="Select account"
-      aria-label="Select account"
-    >
-      {sources && selectItemsMapper()}
-    </Select>
+    <>
+      {(missingPermissions || []).length != 0 && (
+        <Alert isExpandable isInline variant="warning" title={`Launch might fail due to missing permissions.`}>
+          <>
+            <p>
+              Check if <a href="https://console.aws.amazon.com/iam/">policies</a> to your {image.provider} account are set as recommended by
+              <a href="https://github.com/RHEnVision/provisioning-backend/blob/main/docs/configure-amazon-role.md#service-account-policy">
+                {' '}
+                our docs
+              </a>
+              . Following permissions might be missing:
+            </p>
+            <p>{(missingPermissions || []).join(', ')}</p>
+          </>
+        </Alert>
+      )}
+      <Select
+        ouiaId="select_account"
+        isOpen={isOpen}
+        onToggle={(openState) => setIsOpen(openState)}
+        selections={selected}
+        maxHeight="180px"
+        // TODO decide if to disable the select
+        // isDisabled={sources?.length === 1}
+        onSelect={onSelect}
+        placeholderText="Select account"
+        aria-label="Select account"
+      >
+        {sources && selectItemsMapper()}
+      </Select>
+    </>
   );
 };