wip:fetching data from Api

packages/app/src/components/catalog/EntityPage.tsx

@@ -135,11 +135,11 @@ const OverviewContent = ({ entity }: { entity: Entity }) => (
     <Grid item md={6}>
       <AboutCard entity={entity} />
     </Grid>
-    {isPagerDutyAvailable(entity) && (
-      <Grid item md={4}>
-        <PagerDutyServiceCard entity={entity} />
-      </Grid>
-    )}
+    {/* {isPagerDutyAvailable(entity) && ( */}
+    <Grid item md={6}>
+      <PagerDutyServiceCard entity={entity} />
+    </Grid>
+    {/* )} */}
     <RecentCICDRunsSwitcher entity={entity} />
     {isGitHubAvailable(entity) && (
       <>

plugins/pagerduty/src/api/pagerDutyClient.ts

@@ -14,18 +14,22 @@
  * limitations under the License.
  */
 
+const API_URL = 'https://api.pagerduty.com';
+const EVENTS_API_URL = 'https://events.pagerduty.com/v2';
+
 type Options = {
   method: string;
   headers: {
     'Content-Type': string;
     Accept: string;
+    Authorization?: string;
   };
-  body: string;
+  body?: string;
 };
 
 const request = async (
   url: string,
-  options: Options,
+  options: any, //Options,
 ): Promise<Response | Error> => {
   const response = await fetch(url, options);
 
@@ -40,6 +44,25 @@ const request = async (
   return await response.json();
 };
 
+export const getServices = async (token: string, integrationKey: string) => {
+  const options = {
+    method: 'GET',
+    headers: {
+      Authorization: `Token token=${token}`,
+      Accept: 'application/vnd.pagerduty+json;version=2',
+      'Content-Type': 'application/json',
+    },
+    // query: {
+    //   query: encodeURIComponent(`key:${integrationKey}`),
+    // },
+  };
+
+  return request(
+    `${API_URL}/services/?query=key%253A238b701cc9d048f0bdd828355178eafe`,
+    options,
+  );
+};
+
 export function triggerPagerDutyAlarm(
   integrationKey: string,
   source: string,
@@ -69,5 +92,5 @@ export function triggerPagerDutyAlarm(
     }),
   };
 
-  return request('https://events.pagerduty.com/v2/enqueue', options);
+  return request(`${EVENTS_API_URL}/enqueue`, options);
 }

plugins/pagerduty/src/components/PagerDutyServiceCard.tsx

@@ -14,13 +14,20 @@
  * limitations under the License.
  */
 import React from 'react';
-import { InfoCard, MissingAnnotationEmptyState } from '@backstage/core';
+import {
+  InfoCard,
+  MissingAnnotationEmptyState,
+  useApi,
+  configApiRef,
+} from '@backstage/core';
 import { Entity } from '@backstage/catalog-model';
 import { Grid } from '@material-ui/core';
 import { Incidents } from './Incidents';
 import { EscalationPolicy } from './Escalation';
 import { PagerDutyData } from './types';
 import { TriggerButton } from './TriggerButton';
+import { useAsync } from 'react-use';
+import { getServices } from '../api/pagerDutyClient';
 
 export const PAGERDUTY_INTEGRATION_KEY = 'pagerduty.com/integration-key';
 
@@ -32,6 +39,20 @@ type Props = {
 };
 
 export const PagerDutyServiceCard = ({ entity }: Props) => {
+  const configApi = useApi(configApiRef);
+  const pagerDutyToken =
+    configApi.getOptionalString('pagerduty.api_token') ?? undefined;
+
+  console.log({ pagerDutyToken });
+  const { value, loading, error } = useAsync(async () => {
+    return await getServices(
+      pagerDutyToken!,
+      entity.metadata.annotations![PAGERDUTY_INTEGRATION_KEY],
+    );
+  });
+  if (value) console.log(value);
+  if (error) throw new Error(`Error in getting services, ${error}`);
+
   // TODO: fetch this data
   const mockData: PagerDutyData = {
     pagerDutyServices: [
@@ -85,6 +106,7 @@ export const PagerDutyServiceCard = ({ entity }: Props) => {
       <Grid container item xs={12} justify="flex-end">
         <TriggerButton entity={entity} />
       </Grid>
+      {/* todo show something when we dont have token */}
     </InfoCard>
   );
 };