From ee02c68c6c16a4c1c5d0f64fa5161541c8eece75 Mon Sep 17 00:00:00 2001 From: skgandikota Date: Mon, 11 Apr 2022 15:26:45 +0530 Subject: [PATCH 1/5] Append myHeaders const with Authorization Token Signed-off-by: skgandikota --- .../newrelic-dashboard/src/api/NewRelicDashboardClient.ts | 8 +++++++- plugins/newrelic-dashboard/src/plugin.ts | 6 ++++-- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts index 2411102712..7a6e05506a 100644 --- a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts +++ b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts @@ -18,7 +18,7 @@ import { DashboardSnapshotSummary, NewRelicDashboardApi, } from './NewRelicDashboardApi'; -import { DiscoveryApi } from '@backstage/core-plugin-api'; +import { DiscoveryApi, IdentityApi } from '@backstage/core-plugin-api'; import { DashboardEntity } from '../types/DashboardEntity'; import { DashboardSnapshot } from '../types/DashboardSnapshot'; import { getDashboardParentGuidQuery } from '../queries/getDashboardParentGuidQuery'; @@ -27,21 +27,27 @@ import { ResponseError } from '@backstage/errors'; export class NewRelicDashboardClient implements NewRelicDashboardApi { private readonly discoveryApi: DiscoveryApi; + private readonly identityApi: IdentityApi; constructor({ discoveryApi, + identityApi, }: { discoveryApi: DiscoveryApi; + identityApi: IdentityApi; baseUrl?: string; }) { this.discoveryApi = discoveryApi; + this.identityApi = identityApi; } private async callApi( query: string, variables: { [key in string]: string | number }, ): Promise { + const { token } = await this.identityApi.getCredentials(); const myHeaders = new Headers(); myHeaders.append('Content-Type', 'application/json'); + myHeaders.append('Authorization', `Bearer ${token}`); const graphql = JSON.stringify({ query: query, variables: variables, diff --git a/plugins/newrelic-dashboard/src/plugin.ts b/plugins/newrelic-dashboard/src/plugin.ts index 9bfecff18f..42c239c2cf 100644 --- a/plugins/newrelic-dashboard/src/plugin.ts +++ b/plugins/newrelic-dashboard/src/plugin.ts @@ -19,6 +19,7 @@ import { createApiFactory, discoveryApiRef, createComponentExtension, + identityApiRef, } from '@backstage/core-plugin-api'; import { newRelicDashboardApiRef, NewRelicDashboardClient } from './api'; import { rootRouteRef } from './routes'; @@ -31,10 +32,11 @@ export const newRelicDashboardPlugin = createPlugin({ apis: [ createApiFactory({ api: newRelicDashboardApiRef, - deps: { configApi: configApiRef, discoveryApi: discoveryApiRef }, - factory: ({ configApi, discoveryApi }) => + deps: { configApi: configApiRef, discoveryApi: discoveryApiRef, identityApi: identityApiRef }, + factory: ({ configApi, discoveryApi, identityApi }) => new NewRelicDashboardClient({ discoveryApi, + identityApi, baseUrl: configApi.getOptionalString('newrelicdashboard.baseUrl'), }), }), From 5fa2fb25537b025a37e3b8fe86248facf7b1d6f2 Mon Sep 17 00:00:00 2001 From: skgandikota Date: Mon, 11 Apr 2022 15:43:04 +0530 Subject: [PATCH 2/5] Incl. changeset for newrelic dashboard plugin Signed-off-by: skgandikota --- .changeset/pink-mayflies-rhyme.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/pink-mayflies-rhyme.md diff --git a/.changeset/pink-mayflies-rhyme.md b/.changeset/pink-mayflies-rhyme.md new file mode 100644 index 0000000000..8162679b62 --- /dev/null +++ b/.changeset/pink-mayflies-rhyme.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-newrelic-dashboard': minor +--- + +Included the Authorization Token to New Relic Dashboard Plugin, so that frontend can send an authenticated call to backend From 7eee3434aacd2a72d1ac5823b3f23a44db92f76a Mon Sep 17 00:00:00 2001 From: skgandikota Date: Wed, 13 Apr 2022 16:32:10 +0530 Subject: [PATCH 3/5] Added `FetchApi` and related `fetchApiRef` which implement fetch Signed-off-by: skgandikota --- .changeset/pink-mayflies-rhyme.md | 4 ++-- .../src/api/NewRelicDashboardClient.ts | 22 ++++++------------- plugins/newrelic-dashboard/src/plugin.ts | 12 ++++++---- 3 files changed, 17 insertions(+), 21 deletions(-) diff --git a/.changeset/pink-mayflies-rhyme.md b/.changeset/pink-mayflies-rhyme.md index 8162679b62..fff17b28b3 100644 --- a/.changeset/pink-mayflies-rhyme.md +++ b/.changeset/pink-mayflies-rhyme.md @@ -1,5 +1,5 @@ --- -'@backstage/plugin-newrelic-dashboard': minor +'@backstage/plugin-newrelic-dashboard': patch --- -Included the Authorization Token to New Relic Dashboard Plugin, so that frontend can send an authenticated call to backend +Add `FetchApi` and related `fetchApiRef` which implement fetch. in order to included the Authorization Token to New Relic Dashboard Plugin, so that frontend can send an authenticated proxy call to backend diff --git a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts index 7a6e05506a..ab838a14d8 100644 --- a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts +++ b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts @@ -18,7 +18,7 @@ import { DashboardSnapshotSummary, NewRelicDashboardApi, } from './NewRelicDashboardApi'; -import { DiscoveryApi, IdentityApi } from '@backstage/core-plugin-api'; +import { DiscoveryApi, FetchApi } from '@backstage/core-plugin-api'; import { DashboardEntity } from '../types/DashboardEntity'; import { DashboardSnapshot } from '../types/DashboardSnapshot'; import { getDashboardParentGuidQuery } from '../queries/getDashboardParentGuidQuery'; @@ -27,27 +27,19 @@ import { ResponseError } from '@backstage/errors'; export class NewRelicDashboardClient implements NewRelicDashboardApi { private readonly discoveryApi: DiscoveryApi; - private readonly identityApi: IdentityApi; - constructor({ - discoveryApi, - identityApi, - }: { - discoveryApi: DiscoveryApi; - identityApi: IdentityApi; - baseUrl?: string; - }) { - this.discoveryApi = discoveryApi; - this.identityApi = identityApi; + private readonly fetchApi: FetchApi; + + constructor(options: { discoveryApi: DiscoveryApi; fetchApi: FetchApi }) { + this.discoveryApi = options.discoveryApi; + this.fetchApi = options.fetchApi; } private async callApi( query: string, variables: { [key in string]: string | number }, ): Promise { - const { token } = await this.identityApi.getCredentials(); const myHeaders = new Headers(); myHeaders.append('Content-Type', 'application/json'); - myHeaders.append('Authorization', `Bearer ${token}`); const graphql = JSON.stringify({ query: query, variables: variables, @@ -62,7 +54,7 @@ export class NewRelicDashboardClient implements NewRelicDashboardApi { const apiUrl = `${await this.discoveryApi.getBaseUrl( 'proxy', )}/newrelic/api/graphql`; - const response = await fetch(apiUrl, requestOptions); + const response = await this.fetchApi.fetch(apiUrl, requestOptions); if (response.status === 200) { return (await response.json()) as T; } diff --git a/plugins/newrelic-dashboard/src/plugin.ts b/plugins/newrelic-dashboard/src/plugin.ts index 42c239c2cf..d4ed11573f 100644 --- a/plugins/newrelic-dashboard/src/plugin.ts +++ b/plugins/newrelic-dashboard/src/plugin.ts @@ -19,7 +19,7 @@ import { createApiFactory, discoveryApiRef, createComponentExtension, - identityApiRef, + fetchApiRef, } from '@backstage/core-plugin-api'; import { newRelicDashboardApiRef, NewRelicDashboardClient } from './api'; import { rootRouteRef } from './routes'; @@ -32,11 +32,15 @@ export const newRelicDashboardPlugin = createPlugin({ apis: [ createApiFactory({ api: newRelicDashboardApiRef, - deps: { configApi: configApiRef, discoveryApi: discoveryApiRef, identityApi: identityApiRef }, - factory: ({ configApi, discoveryApi, identityApi }) => + deps: { + configApi: configApiRef, + discoveryApi: discoveryApiRef, + fetchApi: fetchApiRef, + }, + factory: ({ configApi, discoveryApi, fetchApi }) => new NewRelicDashboardClient({ discoveryApi, - identityApi, + fetchApi, baseUrl: configApi.getOptionalString('newrelicdashboard.baseUrl'), }), }), From 3fca8763d741a4e059762f3a9e0099753bbe096b Mon Sep 17 00:00:00 2001 From: skgandikota Date: Wed, 13 Apr 2022 17:21:22 +0530 Subject: [PATCH 4/5] FIX: E2E , add baseurl string to constructor Signed-off-by: skgandikota --- .../src/api/NewRelicDashboardClient.ts | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts index ab838a14d8..1c48050b50 100644 --- a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts +++ b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts @@ -29,10 +29,18 @@ export class NewRelicDashboardClient implements NewRelicDashboardApi { private readonly discoveryApi: DiscoveryApi; private readonly fetchApi: FetchApi; - constructor(options: { discoveryApi: DiscoveryApi; fetchApi: FetchApi }) { - this.discoveryApi = options.discoveryApi; - this.fetchApi = options.fetchApi; + constructor({ + discoveryApi, + fetchApi, + }: { + discoveryApi: DiscoveryApi; + fetchApi: FetchApi; + baseUrl?: string; + }) { + this.discoveryApi = discoveryApi; + this.fetchApi = fetchApi; } + private async callApi( query: string, From fde84235852755c27511a6713681fce05aa80caf Mon Sep 17 00:00:00 2001 From: skgandikota Date: Thu, 14 Apr 2022 06:39:32 +0530 Subject: [PATCH 5/5] FIX: Prettier:Check in newrelicdashboardclient.ts Signed-off-by: skgandikota --- plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts index 1c48050b50..63b33056e1 100644 --- a/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts +++ b/plugins/newrelic-dashboard/src/api/NewRelicDashboardClient.ts @@ -40,7 +40,6 @@ export class NewRelicDashboardClient implements NewRelicDashboardApi { this.discoveryApi = discoveryApi; this.fetchApi = fetchApi; } - private async callApi( query: string,