Load data in rules tables

web/packages/teleport/src/Integrations/status/AwsOidc/Details/Details.tsx

@@ -26,8 +26,7 @@ import { useAwsOidcStatus } from 'teleport/Integrations/status/AwsOidc/useAwsOid
 import { AwsResource } from 'teleport/Integrations/status/AwsOidc/StatCard';
 import { IntegrationKind } from 'teleport/services/integrations';
 import { Rds } from 'teleport/Integrations/status/AwsOidc/Details/Rds';
-import { Ec2 } from 'teleport/Integrations/status/AwsOidc/Details/Ec2';
-import { Eks } from 'teleport/Integrations/status/AwsOidc/Details/Eks';
+import { Rules } from 'teleport/Integrations/status/AwsOidc/Details/Rules';
 
 export function Details() {
   const { resourceKind } = useParams<{
@@ -43,8 +42,8 @@ export function Details() {
       {integration && (
         <AwsOidcHeader integration={integration} resource={resourceKind} />
       )}
-      {resourceKind == AwsResource.ec2 && <Ec2 />}
-      {resourceKind == AwsResource.eks && <Eks />}
+      {resourceKind == AwsResource.ec2 && <Rules />}
+      {resourceKind == AwsResource.eks && <Rules />}
       {resourceKind == AwsResource.rds && <Rds />}
     </FeatureBox>
   );

web/packages/teleport/src/Integrations/status/AwsOidc/Details/Rules.test.tsx

@@ -0,0 +1,111 @@
+/**
+ * Teleport
+ * Copyright (C) 2024 Gravitational, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import { render, screen, waitFor } from 'design/utils/testing';
+import React from 'react';
+
+import { MemoryRouter } from 'react-router';
+
+import { within } from '@testing-library/react';
+
+import { Rules } from 'teleport/Integrations/status/AwsOidc/Details/Rules';
+import {
+  IntegrationDiscoveryRule,
+  integrationService,
+} from 'teleport/services/integrations';
+
+test('renders region & labels from response', async () => {
+  jest.spyOn(integrationService, 'fetchIntegrationRules').mockResolvedValue({
+    rules: [
+      makeIntegrationDiscoveryRule({
+        region: 'us-west-2',
+        labelMatcher: [
+          { name: 'env', value: 'prod' },
+          { name: 'key', value: '123' },
+        ],
+      }),
+      makeIntegrationDiscoveryRule({
+        region: 'us-east-2',
+        labelMatcher: [{ name: 'env', value: 'stage' }],
+      }),
+      makeIntegrationDiscoveryRule({
+        region: 'us-west-1',
+        labelMatcher: [{ name: 'env', value: 'test' }],
+      }),
+      makeIntegrationDiscoveryRule({
+        region: 'us-east-1',
+        labelMatcher: [{ name: 'env', value: 'dev' }],
+      }),
+    ],
+    nextKey: '',
+  });
+  render(
+    <MemoryRouter
+      initialEntries={[
+        `/web/integrations/status/aws-oidc/some-name/resources/eks`,
+      ]}
+    >
+      <Rules />
+    </MemoryRouter>
+  );
+
+  await waitFor(() => {
+    expect(screen.getByText('env:prod')).toBeInTheDocument();
+  });
+
+  expect(getTableCellContents()).toEqual({
+    header: ['Region', 'Labels'],
+    rows: [
+      ['us-west-1', 'env:test'],
+      ['us-east-1', 'env:dev'],
+      ['us-west-2', 'env:prodkey:123'],
+      ['us-east-2', 'env:stage'],
+    ],
+  });
+
+  jest.clearAllMocks();
+});
+
+function makeIntegrationDiscoveryRule(
+  overrides: Partial<IntegrationDiscoveryRule> = {}
+): IntegrationDiscoveryRule {
+  return Object.assign(
+    {
+      resourceType: '',
+      region: '',
+      labelMatcher: [],
+      discoveryConfig: '',
+      lastSync: 0,
+    },
+    overrides
+  );
+}
+
+function getTableCellContents() {
+  const [header, ...rows] = screen.getAllByRole('row');
+  return {
+    header: within(header)
+      .getAllByRole('columnheader')
+      .map(cell => cell.textContent),
+    rows: rows.map(row =>
+      within(row)
+        .getAllByRole('cell')
+        .map(cell => cell.textContent)
+    ),
+  };
+}

web/packages/teleport/src/Integrations/status/AwsOidc/Details/Rules.tsx

@@ -16,32 +16,65 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React from 'react';
+import React, { useEffect } from 'react';
 
 import Table, { LabelCell } from 'design/DataTable';
 
+import { useParams } from 'react-router';
+
+import { useAsync } from 'shared/hooks/useAsync';
+import { Indicator } from 'design';
+import { Danger } from 'design/Alert';
+
+import {
+  IntegrationKind,
+  integrationService,
+} from 'teleport/services/integrations';
+import { AwsResource } from 'teleport/Integrations/status/AwsOidc/StatCard';
+
 export function Rules() {
+  const { name, resourceKind } = useParams<{
+    type: IntegrationKind;
+    name: string;
+    resourceKind: AwsResource;
+  }>();
+
+  const [attempt, fetchRules] = useAsync(() =>
+    integrationService.fetchIntegrationRules(name, resourceKind)
+  );
+
+  useEffect(() => {
+    fetchRules();
+  }, []);
+
+  if (attempt.status == 'processing') {
+    return <Indicator />;
+  }
+
+  if (attempt.status == 'error') {
+    return <Danger>{attempt.statusText}</Danger>;
+  }
+
+  if (!attempt.data) {
+    return null;
+  }
+
   return (
     <Table
-      data={[]}
+      data={attempt.data.rules}
       columns={[
-        {
-          key: 'name',
-          headerText: 'Integration Name',
-          isSortable: true,
-        },
         {
           key: 'region',
           headerText: 'Region',
           isSortable: true,
         },
         {
-          key: 'tags',
-          headerText: 'Tags',
+          key: 'labelMatcher',
+          headerText: getResourceTerm(resourceKind),
           isSortable: true,
           onSort: (a, b) => {
-            const aStr = a.tags.toString();
-            const bStr = b.tags.toString();
+            const aStr = a.labelMatcher.toString();
+            const bStr = b.labelMatcher.toString();
 
             if (aStr < bStr) {
               return -1;
@@ -52,11 +85,22 @@ export function Rules() {
 
             return 0;
           },
-          render: ({ tags }) => <LabelCell data={tags} />,
+          render: ({ labelMatcher }) => (
+            <LabelCell data={labelMatcher.map(l => `${l.name}:${l.value}`)} />
+          ),
         },
       ]}
-      emptyText="Rules details coming soon"
+      emptyText={`No ${resourceKind} data`}
       isSearchable
     />
   );
 }
+
+function getResourceTerm(resource: AwsResource): string {
+  switch (resource) {
+    case AwsResource.rds:
+      return 'Tags';
+    default:
+      return 'Labels';
+  }
+}

web/packages/teleport/src/config.ts

@@ -327,6 +327,9 @@ const cfg = {
     integrationsPath: '/v1/webapi/sites/:clusterId/integrations/:name?',
     integrationStatsPath:
       '/v1/webapi/sites/:clusterId/integrations/:name/stats',
+    integrationRulesPath:
+      '/v1/webapi/sites/:clusterId/integrations/:name/discoveryrules?resourceType=:resourceType',
+
     thumbprintPath: '/v1/webapi/thumbprint',
     pingAwsOidcIntegrationPath:
       '/v1/webapi/sites/:clusterId/integrations/aws-oidc/:name/ping',
@@ -994,6 +997,15 @@ const cfg = {
     });
   },
 
+  getIntegrationRulesUrl(name: string, resourceType: AwsResource) {
+    const clusterId = cfg.proxyCluster;
+    return generatePath(cfg.api.integrationRulesPath, {
+      clusterId,
+      name,
+      resourceType,
+    });
+  },
+
   getPingAwsOidcIntegrationUrl({
     integrationName,
     clusterId,