Merge pull request RedHatInsights#919 from rvsia/lighthouse

Implement Azure Lighthouse for RHEL bundle

Author: Hyperkid123

src/api/entities.js

@@ -67,6 +67,8 @@ export const getSourcesApi = () => ({
   unpauseApplication: (id) => axiosInstanceInsights.post(`${SOURCES_API_BASE_V3}/applications/${id}/unpause`),
   pauseSource: (id) => axiosInstanceInsights.post(`${SOURCES_API_BASE_V3}/sources/${id}/pause`),
   unpauseSource: (id) => axiosInstanceInsights.post(`${SOURCES_API_BASE_V3}/sources/${id}/unpause`),
+  getLighthouseLink: () =>
+    axiosInstanceInsights.get(`${SOURCES_API_BASE_V3}/app_meta_data?filter[name]=azure_lighthouse_template`),
 });
 
 export const doLoadAppTypes = () => getSourcesApi().doLoadAppTypes();

src/components/FormComponents/SourceWizardSummary.js

@@ -43,7 +43,7 @@ const alertMapper = (appName, sourceType, intl) => {
     );
   }
 
-  if (appName === CLOUD_METER_APP_NAME && ['azure', 'google'].includes(sourceType)) {
+  if (appName === CLOUD_METER_APP_NAME && ['google'].includes(sourceType)) {
     return (
       <Alert
         variant="info"

src/components/addSourceWizard/hardcodedComponents/azure/subscriptionWatch.js

@@ -1,59 +1,75 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { useIntl } from 'react-intl';
 
-import { Text, TextVariants, TextContent, TextList, TextListVariants, TextListItem, ClipboardCopy } from '@patternfly/react-core';
+import { Text, TextContent, Button } from '@patternfly/react-core';
+import { getSourcesApi } from '../../../../api/entities';
+import useFormApi from '@data-driven-forms/react-form-renderer/use-form-api';
 
-const API_LINK = 'https://access.redhat.com/management/api';
-
-export const OfflineToken = () => {
+export const LightHouseDescription = () => {
   const intl = useIntl();
+  const [link, setLink] = useState();
+  const [error, setError] = useState(null);
+
+  const formOptions = useFormApi();
+
+  useEffect(() => {
+    getSourcesApi()
+      .getLighthouseLink()
+      .then(({ data }) => setLink(data?.[0]?.payload))
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+        setError(
+          intl.formatMessage({
+            id: 'subwatch.iampolicy.subWatchConfigError',
+            defaultMessage: 'There is an error with loading of the configuration. Please go back and return to this step.',
+          })
+        );
+      });
+  }, []);
 
   return (
     <TextContent>
       <Text>
         {intl.formatMessage({
-          id: 'subwatch.azure.tokenDesc',
-          defaultMessage: 'Generate a token to authenticate the calls to APIs for Red Hat services.',
+          id: 'subwatch.lighthouse.desc',
+          defaultMessage:
+            "Complete configuration steps in Azure Lighthouse according to Microsoft instructions. When you're finished, return to this wizard to finish creating this Azure source.",
         })}
       </Text>
-      <TextList component={TextListVariants.ol} className="pf-u-ml-0">
-        <TextListItem>
-          {intl.formatMessage(
-            {
-              id: 'subwatch.azure.tokenLink',
-              defaultMessage: 'To obtain an offline token, follow the steps at {link}.',
-            },
-            {
-              link: (
-                <Text key="link" rel="noopener noreferrer" target="_blank" component={TextVariants.a} href={API_LINK}>
-                  {API_LINK}
-                </Text>
-              ),
-            }
-          )}
-        </TextListItem>
-      </TextList>
+      <Button
+        component="a"
+        target="_blank"
+        rel="noopener noreferrer"
+        href={link}
+        isLoading={!link}
+        isDisabled={!link}
+        onClick={() => {
+          formOptions.change('lighthouse-clicked', true);
+        }}
+      >
+        {intl.formatMessage({
+          id: 'subwatch.lighthouse.button',
+          defaultMessage: 'Take me to Lighthouse',
+        })}
+      </Button>
+      {error}
     </TextContent>
   );
 };
 
-export const AnsiblePlaybook = () => {
+export const SubscriptionID = () => {
   const intl = useIntl();
 
   return (
     <TextContent>
-      <Text component={TextVariants.p}>
+      <Text>
         {intl.formatMessage({
-          id: 'subwatch.azure.ansiblePlaybookDesc',
-          defaultMessage: 'Download and run the following commands against a running Azure VM.',
+          id: 'subwatch.subscriptionId.desc',
+          defaultMessage:
+            'Log in to your Azure account and navigate to your subscriptions. Copy the subscription ID you wish to use and paste it into the field below.',
         })}
       </Text>
-      <ClipboardCopy className="pf-u-mb-lg">ansible-galaxy collection install redhatinsights.subscriptions</ClipboardCopy>
-      <ClipboardCopy>
-        {
-          'ansible-playbook -i <AZURE_VM_HOSTNAME>, -b ~/.ansible/collections/ansible_collections/redhatinsights/subscriptions/playbooks/verify_account.yml -e rh_api_refresh_token=<OFFLINE_AUTH_TOKEN>'
-        }
-      </ClipboardCopy>
     </TextContent>
   );
 };

src/components/addSourceWizard/hardcodedSchemas.js

@@ -332,43 +332,52 @@ const hardcodedSchemas = {
           },
         },
       },
-      [emptyAuthType.type]: {
+      lighthouse_subscription_id: {
         [CLOUD_METER_APP_NAME]: {
           skipSelection: true,
           useApplicationAuth: true,
           customSteps: true,
           additionalSteps: [
             {
-              title: <FormattedMessage id="subwatch.azure.tokenTitle" defaultMessage="Obtain offline token" />,
-              nextStep: 'cost-azure-playbook',
-              substepOf: {
-                name: 'eaa',
-                title: <FormattedMessage id="subwatch.azure.substepTitle" defaultMessage="Enable account access" />,
-              },
+              title: <FormattedMessage id="subwatch.lighthouse.title" defaultMessage="Configure Azure Lighthouse" />,
+              nextStep: 'subwatch-lighthouse-sub-id',
               fields: [
                 {
                   name: 'azure-1',
                   component: 'description',
-                  Content: SWAzure.OfflineToken,
+                  Content: SWAzure.LightHouseDescription,
                 },
                 {
                   component: componentTypes.TEXT_FIELD,
                   name: 'authentication.authtype',
                   hideField: true,
-                  initialValue: emptyAuthType.type,
+                  initialValue: 'lighthouse_subscription_id',
                   initializeOnMount: true,
                 },
+                {
+                  component: componentTypes.TEXT_FIELD,
+                  name: 'lighthouse-clicked',
+                  hideField: true,
+                  validate: [{ type: 'required' }],
+                },
               ],
             },
             {
-              title: <FormattedMessage id="subwatch.azure.playbookTitle" defaultMessage="Run Ansible playbook" />,
-              name: 'cost-azure-playbook',
-              substepOf: 'eaa',
+              title: <FormattedMessage id="subwatch.lighthouse.subscriptionId" defaultMessage="Set subscription ID" />,
+              name: 'subwatch-lighthouse-sub-id',
               fields: [
                 {
                   name: 'azure-2',
                   component: 'description',
-                  Content: SWAzure.AnsiblePlaybook,
+                  Content: SWAzure.SubscriptionID,
+                },
+                {
+                  component: 'text-field',
+                  name: 'authentication.username',
+                  label: 'Subscription ID',
+                  isRequired: true,
+                  placeholder: '291bba3f-e0a5-47bc-a099-3bdcb2a50a05',
+                  validate: [{ type: 'required' }],
                 },
               ],
             },

src/test/__mocks__/applicationTypes.js

@@ -50,7 +50,7 @@ export const SUB_WATCH_APP = {
   display_name: 'RHEL management',
   id: '5',
   name: '/insights/platform/cloud-meter',
-  supported_authentication_types: { amazon: ['cloud-meter-arn'] },
+  supported_authentication_types: { amazon: ['cloud-meter-arn'], azure: ['lighthouse_subscription_id'] },
   supported_source_types: ['amazon', 'azure', 'google'],
   updated_at: '2020-02-18T19:38:52Z',
 };

src/test/__mocks__/sourceTypes.js

@@ -315,6 +315,26 @@ export const AZURE_TYPE = {
   icon_url: '/apps/chrome/assets/images/partners-icons/microsoft-azure.svg',
   schema: {
     authentication: [
+      {
+        type: 'lighthouse_subscription_id',
+        name: 'Subscription ID',
+        fields: [
+          {
+            component: 'text-field',
+            name: 'authentication.authtype',
+            hideField: true,
+            initializeOnMount: true,
+            initialValue: 'lighthouse_subscription_id',
+          },
+          {
+            component: 'text-field',
+            name: 'authentication.username',
+            label: 'Subscription ID',
+            isRequired: true,
+            validate: [{ type: 'required' }],
+          },
+        ],
+      },
       {
         type: 'tenant_id_client_id_client_secret',
         name: 'Tenant ID, Client ID, Client Secret',

src/test/addSourceWizard/addSourceWizard/hardCodedComponents/azure_subwatch.test.js

@@ -1,28 +1,87 @@
 import React from 'react';
-import { screen } from '@testing-library/react';
+import { screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 
 import render from '../../__mocks__/render';
 
 import * as SubAzure from '../../../../components/addSourceWizard/hardcodedComponents/azure/subscriptionWatch';
+import * as api from '../../../../api/entities';
+import * as useFormApi from '@data-driven-forms/react-form-renderer/use-form-api/use-form-api';
 
 describe('Azure-Subwatch hardcoded schemas', () => {
-  it('OfflineToken is rendered correctly', () => {
-    render(<SubAzure.OfflineToken />);
+  describe('LightHouseDescription', () => {
+    it('is rendered correctly', async () => {
+      const getLighthouseLink = mockApi();
 
-    expect(screen.getByText('Generate a token to authenticate the calls to APIs for Red Hat services.')).toBeInTheDocument();
-    expect(screen.getByText('To obtain an offline token, follow the steps at', { exact: false })).toBeInTheDocument();
-    expect(screen.getByText('https://access.redhat.com/management/api', { selector: 'a' })).toBeInTheDocument();
+      api.getSourcesApi = () => ({
+        getLighthouseLink,
+      });
+
+      render(<SubAzure.LightHouseDescription />);
+
+      expect(
+        screen.getByText(
+          "Complete configuration steps in Azure Lighthouse according to Microsoft instructions. When you're finished, return to this wizard to finish creating this Azure source."
+        )
+      ).toBeInTheDocument();
+      expect(screen.getByText('Take me to Lighthouse')).toHaveAttribute('aria-disabled', 'true');
+
+      getLighthouseLink.resolve({ data: [{ payload: 'href123' }] });
+
+      await waitFor(() => expect(screen.getByText('Take me to Lighthouse')).not.toHaveAttribute('aria-disabled', 'true'));
+      expect(screen.getByText('Take me to Lighthouse')).toHaveAttribute('href', 'href123');
+    });
+
+    it('is rendered with error', async () => {
+      const _cons = console.error;
+      console.error = jest.fn();
+
+      const getLighthouseLink = mockApi();
+
+      api.getSourcesApi = () => ({
+        getLighthouseLink,
+      });
+
+      render(<SubAzure.LightHouseDescription />);
+
+      getLighthouseLink.reject();
+
+      await waitFor(() => expect(screen.getByText('Take me to Lighthouse')).toHaveAttribute('aria-disabled', 'true'));
+      expect(
+        screen.getByText('There is an error with loading of the configuration. Please go back and return to this step.')
+      ).toBeInTheDocument();
+
+      console.error = _cons;
+    });
+
+    it('button changes the value', async () => {
+      const change = jest.fn();
+
+      const mock = jest.spyOn(useFormApi, 'default').mockImplementation(() => ({ change }));
+
+      api.getSourcesApi = () => ({
+        getLighthouseLink: jest.fn().mockResolvedValue({ data: [{ payload: 'href123' }] }),
+      });
+
+      render(<SubAzure.LightHouseDescription />);
+
+      const user = userEvent.setup();
+
+      await user.click(screen.getByText('Take me to Lighthouse'));
+
+      expect(change).toHaveBeenCalledWith('lighthouse-clicked', true);
+
+      mock.mockRestore();
+    });
   });
 
-  it('AnsiblePlaybook is rendered correctly', () => {
-    render(<SubAzure.AnsiblePlaybook />);
+  it('SubscriptionID is rendered correctly', () => {
+    render(<SubAzure.SubscriptionID />);
 
-    expect(screen.getByText('Download and run the following commands against a running Azure VM.')).toBeInTheDocument();
-    expect(screen.getAllByLabelText('Copyable input')[0]).toHaveValue(
-      'ansible-galaxy collection install redhatinsights.subscriptions'
-    );
-    expect(screen.getAllByLabelText('Copyable input')[1]).toHaveValue(
-      'ansible-playbook -i <AZURE_VM_HOSTNAME>, -b ~/.ansible/collections/ansible_collections/redhatinsights/subscriptions/playbooks/verify_account.yml -e rh_api_refresh_token=<OFFLINE_AUTH_TOKEN>'
-    );
+    expect(
+      screen.getByText(
+        'Log in to your Azure account and navigate to your subscriptions. Copy the subscription ID you wish to use and paste it into the field below.'
+      )
+    ).toBeInTheDocument();
   });
 });

src/test/addSourceWizard/addSourceWizard/schemaBuilder.test.js

@@ -316,7 +316,7 @@ describe('schema builder', () => {
 
     describe('createAuthTypeSelection', () => {
       it('generate single selection', () => {
-        const fields = AZURE_TYPE.schema.authentication[0].fields.filter(({ stepKey }) => !stepKey);
+        const fields = AZURE_TYPE.schema.authentication[1].fields.filter(({ stepKey }) => !stepKey);
         const expectedName = `${AZURE_TYPE.name}-${TOPOLOGY_INV_APP.id}`;
 
         expectedSchema = expect.objectContaining({
@@ -342,7 +342,7 @@ describe('schema builder', () => {
       });
 
       it('generate single selection with endpoints', () => {
-        const fields = AZURE_TYPE.schema.authentication[0].fields.filter(({ stepKey }) => !stepKey);
+        const fields = AZURE_TYPE.schema.authentication[1].fields.filter(({ stepKey }) => !stepKey);
         const expectedName = `${AZURE_TYPE.name}-${TOPOLOGY_INV_APP.id}`;
 
         expectedSchema = expect.objectContaining({
@@ -417,12 +417,12 @@ describe('schema builder', () => {
         'azure-2',
         'azure-3',
         'azure-5',
+        'azure-lighthouse_subscription_id-/insights/platform/cloud-meter-additional-step',
+        'subwatch-lighthouse-sub-id',
         'azure-tenant_id_client_id_client_secret-/insights/platform/cost-management-additional-step',
         'azure-sub-id',
         'configure-roles',
         'export-schedule',
-        'azure-empty-/insights/platform/cloud-meter-additional-step',
-        'cost-azure-playbook',
         'google-generic',
         'google-2',
         'google-5',

src/test/api/entities.test.js

@@ -264,6 +264,15 @@ describe('entities spec', () => {
 
         expect(result).toEqual(OK_RESPONSE);
       });
+
+      it('getLighthouseLink', async () => {
+        const method = 'Get';
+        mock[`on${method}`](`/api/sources/v3.1/app_meta_data?filter[name]=azure_lighthouse_template`).reply(200, OK_RESPONSE);
+
+        const result = await api.getSourcesApi().getLighthouseLink();
+
+        expect(result).toEqual(OK_RESPONSE);
+      });
     });
 
     it('doRemoveSource fails', async () => {