Merge pull request #4182 from nirga/multi-cluster

Kafka Plugin: Multi-cluster and multi-consumer per component

plugins/kafka/README.md

@@ -65,8 +65,10 @@ import { Router as KafkaRouter } from '@backstage/plugin-kafka';
 ```yaml
 kafka:
   clientId: backstage
-  brokers:
-    - localhost:9092
+  clusters:
+    - name: cluster-name
+      brokers:
+        - localhost:9092
 ```
 
 6. Add `kafka.apache.org/consumer-groups` annotation to your services:
@@ -77,7 +79,7 @@ kind: Component
 metadata:
   # ...
   annotations:
-    kafka.apache.org/consumer-groups: consumer-group-name
+    kafka.apache.org/consumer-groups: cluster-name/consumer-group-name
 spec:
   type: service
 ```

plugins/kafka/src/api/KafkaBackendClient.ts

@@ -43,8 +43,11 @@ export class KafkaBackendClient implements KafkaApi {
   }
 
   async getConsumerGroupOffsets(
+    clusterId: string,
     consumerGroup: string,
   ): Promise<ConsumerGroupOffsetsResponse> {
-    return await this.internalGet(`/consumer/${consumerGroup}/offsets`);
+    return await this.internalGet(
+      `/consumers/${clusterId}/${consumerGroup}/offsets`,
+    );
   }
 }

plugins/kafka/src/api/types.ts

@@ -34,6 +34,7 @@ export type ConsumerGroupOffsetsResponse = {
 
 export interface KafkaApi {
   getConsumerGroupOffsets(
+    clusterId: string,
     consumerGroup: string,
   ): Promise<ConsumerGroupOffsetsResponse>;
 }

plugins/kafka/src/components/ConsumerGroupOffsets/ConsumerGroupOffsets.test.tsx

@@ -27,6 +27,7 @@ describe('ConsumerGroupOffsets', () => {
     const rendered = await renderInTestApp(
       <ConsumerGroupOffsets
         consumerGroup={consumerGroupOffsets.consumerId}
+        clusterId="prod"
         topics={consumerGroupOffsets.offsets}
         loading={false}
         retry={() => {}}

plugins/kafka/src/components/ConsumerGroupOffsets/ConsumerGroupOffsets.tsx

@@ -15,7 +15,7 @@
  */
 
 import { Table, TableColumn } from '@backstage/core';
-import { Box, Typography } from '@material-ui/core';
+import { Box, Grid, Typography } from '@material-ui/core';
 import RetryIcon from '@material-ui/icons/Replay';
 import React from 'react';
 import { useConsumerGroupsOffsetsForEntity } from './useConsumerGroupsOffsetsForEntity';
@@ -62,6 +62,7 @@ const generatedColumns: TableColumn[] = [
 type Props = {
   loading: boolean;
   retry: () => void;
+  clusterId: string;
   consumerGroup: string;
   topics?: TopicPartitionInfo[];
 };
@@ -69,6 +70,7 @@ type Props = {
 export const ConsumerGroupOffsets = ({
   loading,
   topics,
+  clusterId,
   consumerGroup,
   retry,
 }: Props) => {
@@ -87,7 +89,7 @@ export const ConsumerGroupOffsets = ({
       title={
         <Box display="flex" alignItems="center">
           <Typography variant="h6">
-            Consumed Topics for {consumerGroup}
+            Consumed Topics for {consumerGroup} ({clusterId})
           </Typography>
         </Box>
       }
@@ -98,6 +100,15 @@ export const ConsumerGroupOffsets = ({
 
 export const KafkaTopicsForConsumer = () => {
   const [tableProps, { retry }] = useConsumerGroupsOffsetsForEntity();
-
-  return <ConsumerGroupOffsets {...tableProps} retry={retry} />;
+  return (
+    <Grid>
+      {tableProps.consumerGroupsTopics?.map(consumerGroup => (
+        <ConsumerGroupOffsets
+          {...consumerGroup}
+          loading={tableProps.loading}
+          retry={retry}
+        />
+      ))}
+    </Grid>
+  );
 };

plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsForEntity.test.tsx

@@ -20,21 +20,7 @@ import { EntityContext } from '@backstage/plugin-catalog';
 import { Entity } from '@backstage/catalog-model';
 
 describe('useConsumerGroupOffsets', () => {
-  const entity: Entity = {
-    apiVersion: 'v1',
-    kind: 'Component',
-    metadata: {
-      name: 'test',
-      annotations: {
-        'kafka.apache.org/consumer-groups': 'consumer',
-      },
-    },
-    spec: {
-      owner: 'guest',
-      type: 'Website',
-      lifecycle: 'development',
-    },
-  };
+  let entity: Entity;
 
   const wrapper = ({ children }: PropsWithChildren<{}>) => {
     return (
@@ -46,8 +32,107 @@ describe('useConsumerGroupOffsets', () => {
 
   const subject = () => renderHook(useConsumerGroupsForEntity, { wrapper });
 
-  it('returns correct consumer group for annotation', async () => {
+  it('returns correct cluster and consumer group for annotation', async () => {
+    entity = {
+      apiVersion: 'v1',
+      kind: 'Component',
+      metadata: {
+        name: 'test',
+        annotations: {
+          'kafka.apache.org/consumer-groups': 'prod/consumer',
+        },
+      },
+      spec: {
+        owner: 'guest',
+        type: 'Website',
+        lifecycle: 'development',
+      },
+    };
     const { result } = subject();
-    expect(result.current).toBe('consumer');
+    expect(result.current).toStrictEqual([
+      {
+        clusterId: 'prod',
+        consumerGroup: 'consumer',
+      },
+    ]);
+  });
+
+  it('returns correct cluster and consumer group for multiple consumers', async () => {
+    entity = {
+      apiVersion: 'v1',
+      kind: 'Component',
+      metadata: {
+        name: 'test',
+        annotations: {
+          'kafka.apache.org/consumer-groups':
+            'prod/consumer,dev/another-consumer',
+        },
+      },
+      spec: {
+        owner: 'guest',
+        type: 'Website',
+        lifecycle: 'development',
+      },
+    };
+    const { result } = subject();
+    expect(result.current).toStrictEqual([
+      { clusterId: 'prod', consumerGroup: 'consumer' },
+      {
+        clusterId: 'dev',
+        consumerGroup: 'another-consumer',
+      },
+    ]);
+  });
+
+  it('returns correct cluster and consumer group for annotation with extra spaces', async () => {
+    entity = {
+      apiVersion: 'v1',
+      kind: 'Component',
+      metadata: {
+        name: 'test',
+        annotations: {
+          'kafka.apache.org/consumer-groups':
+            '   prod/consumer   ,   dev/another-consumer   ',
+        },
+      },
+      spec: {
+        owner: 'guest',
+        type: 'Website',
+        lifecycle: 'development',
+      },
+    };
+    const { result } = subject();
+    expect(result.current).toStrictEqual([
+      { clusterId: 'prod', consumerGroup: 'consumer' },
+      {
+        clusterId: 'dev',
+        consumerGroup: 'another-consumer',
+      },
+    ]);
+  });
+
+  it('fails on missing cluster', async () => {
+    entity = {
+      apiVersion: 'v1',
+      kind: 'Component',
+      metadata: {
+        name: 'test',
+        annotations: {
+          'kafka.apache.org/consumer-groups': 'dev/another,consumer',
+        },
+      },
+      spec: {
+        owner: 'guest',
+        type: 'Website',
+        lifecycle: 'development',
+      },
+    };
+    const { result } = subject();
+    expect(() => result.current).toThrowError();
+    expect(result.error).toStrictEqual(
+      new Error(
+        `Failed to parse kafka consumer group annotation: got "dev/another,consumer"`,
+      ),
+    );
   });
 });

plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsForEntity.ts

@@ -15,10 +15,29 @@
  */
 
 import { useEntity } from '@backstage/plugin-catalog';
+import { useMemo } from 'react';
 import { KAFKA_CONSUMER_GROUP_ANNOTATION } from '../../constants';
 
 export const useConsumerGroupsForEntity = () => {
   const { entity } = useEntity();
+  const annotation =
+    entity.metadata.annotations?.[KAFKA_CONSUMER_GROUP_ANNOTATION] ?? '';
 
-  return entity.metadata.annotations?.[KAFKA_CONSUMER_GROUP_ANNOTATION] ?? '';
+  const consumerList = useMemo(() => {
+    return annotation.split(',').map(consumer => {
+      const [clusterId, consumerGroup] = consumer.split('/');
+
+      if (!clusterId || !consumerGroup) {
+        throw new Error(
+          `Failed to parse kafka consumer group annotation: got "${annotation}"`,
+        );
+      }
+      return {
+        clusterId: clusterId.trim(),
+        consumerGroup: consumerGroup.trim(),
+      };
+    });
+  }, [annotation]);
+
+  return consumerList;
 };

plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.test.tsx

@@ -45,7 +45,7 @@ describe('useConsumerGroupOffsets', () => {
     metadata: {
       name: 'test',
       annotations: {
-        'kafka.apache.org/consumer-groups': consumerGroupOffsets.consumerId,
+        'kafka.apache.org/consumer-groups': `prod/${consumerGroupOffsets.consumerId}`,
       },
     },
     spec: {
@@ -74,16 +74,24 @@ describe('useConsumerGroupOffsets', () => {
     renderHook(useConsumerGroupsOffsetsForEntity, { wrapper });
 
   it('returns correct consumer group for annotation', async () => {
+    mockKafkaApi.getConsumerGroupOffsets.mockResolvedValue(
+      consumerGroupOffsets,
+    );
     when(mockKafkaApi.getConsumerGroupOffsets)
-      .calledWith(consumerGroupOffsets.consumerId)
+      .calledWith('prod', consumerGroupOffsets.consumerId)
       .mockResolvedValue(consumerGroupOffsets);
 
     const { result, waitForNextUpdate } = subject();
     await waitForNextUpdate();
     const [tableProps] = result.current;
 
-    expect(tableProps.consumerGroup).toBe(consumerGroupOffsets.consumerId);
-    expect(tableProps.topics).toBe(consumerGroupOffsets.offsets);
+    expect(tableProps.consumerGroupsTopics).toStrictEqual([
+      {
+        clusterId: 'prod',
+        consumerGroup: consumerGroupOffsets.consumerId,
+        topics: consumerGroupOffsets.offsets,
+      },
+    ]);
   });
 
   it('posts an error to the error api', async () => {

plugins/kafka/src/components/ConsumerGroupOffsets/useConsumerGroupsOffsetsForEntity.ts

@@ -20,25 +20,35 @@ import { kafkaApiRef } from '../../api/types';
 import { useConsumerGroupsForEntity } from './useConsumerGroupsForEntity';
 
 export const useConsumerGroupsOffsetsForEntity = () => {
-  const consumerGroup = useConsumerGroupsForEntity();
+  const consumers = useConsumerGroupsForEntity();
   const api = useApi(kafkaApiRef);
   const errorApi = useApi(errorApiRef);
 
-  const { loading, value: topics, retry } = useAsyncRetry(async () => {
+  const {
+    loading,
+    value: consumerGroupsTopics,
+    retry,
+  } = useAsyncRetry(async () => {
     try {
-      const response = await api.getConsumerGroupOffsets(consumerGroup);
-      return response.offsets;
+      return await Promise.all(
+        consumers.map(async ({ clusterId, consumerGroup }) => {
+          const response = await api.getConsumerGroupOffsets(
+            clusterId,
+            consumerGroup,
+          );
+          return { clusterId, consumerGroup, topics: response.offsets };
+        }),
+      );
     } catch (e) {
       errorApi.post(e);
       throw e;
     }
-  }, [api, errorApi, consumerGroup]);
+  }, [consumers, api, errorApi]);
 
   return [
     {
       loading,
-      consumerGroup,
-      topics,
+      consumerGroupsTopics,
     },
     {
       retry,