diff --git a/.changeset/funny-fireants-shop.md b/.changeset/funny-fireants-shop.md new file mode 100644 index 0000000000..8e6d997aa2 --- /dev/null +++ b/.changeset/funny-fireants-shop.md @@ -0,0 +1,7 @@ +--- +'@backstage/plugin-newrelic-dashboard': minor +--- + +Fix bug where the default time window/snapshot duration was supposed to be 30 days, but ended up being 43 weeks + +**BREAKING**: Add a select input to change the time window of the snapshot displayed. This removes the duration prop from the `DashboardSnapshot` component. diff --git a/plugins/newrelic-dashboard/api-report.md b/plugins/newrelic-dashboard/api-report.md index cff24d90c6..fd0846bc4e 100644 --- a/plugins/newrelic-dashboard/api-report.md +++ b/plugins/newrelic-dashboard/api-report.md @@ -14,12 +14,10 @@ export const DashboardSnapshotComponent: ({ guid, name, permalink, - duration, }: { guid: string; name: string; permalink: string; - duration: number; }) => JSX.Element; // Warning: (ae-missing-release-tag) "EntityNewRelicDashboardCard" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) diff --git a/plugins/newrelic-dashboard/dev/index.tsx b/plugins/newrelic-dashboard/dev/index.tsx index d0db8c4d96..bb5f5b92d7 100644 --- a/plugins/newrelic-dashboard/dev/index.tsx +++ b/plugins/newrelic-dashboard/dev/index.tsx @@ -14,6 +14,6 @@ * limitations under the License. */ import { createDevApp } from '@backstage/dev-utils'; -import { newRelicDashboardPlugin } from './../src/plugin'; +import { newRelicDashboardPlugin } from '../src/plugin'; createDevApp().registerPlugin(newRelicDashboardPlugin).render(); diff --git a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardEntityList.tsx b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardEntityList.tsx index a9e6e39a0d..6c89f3eb80 100644 --- a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardEntityList.tsx +++ b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardEntityList.tsx @@ -28,7 +28,7 @@ import DesktopMac from '@material-ui/icons/DesktopMac'; import { DashboardEntitySummary } from '../../api/NewRelicDashboardApi'; import { ResultEntity } from '../../types/DashboardEntity'; import { useEntity } from '@backstage/plugin-catalog-react'; -import { NEWRELIC_GUID_ANNOTATION } from './../../constants'; +import { NEWRELIC_GUID_ANNOTATION } from '../../constants'; const useStyles = makeStyles({ svgIcon: { diff --git a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshot.tsx b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshot.tsx index 69608833f7..f501fd77bf 100644 --- a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshot.tsx +++ b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshot.tsx @@ -14,8 +14,8 @@ * limitations under the License. */ import React from 'react'; -import { Box, Grid } from '@material-ui/core'; -import { useApi } from '@backstage/core-plugin-api'; +import { Box, Grid, MenuItem, Select } from '@material-ui/core'; +import { useApi, storageApiRef } from '@backstage/core-plugin-api'; import useAsync from 'react-use/lib/useAsync'; import { InfoCard, @@ -24,43 +24,72 @@ import { Link, } from '@backstage/core-components'; import { newRelicDashboardApiRef } from '../../../api'; -import { DashboardSnapshotSummary } from './../../../api/NewRelicDashboardApi'; +import { DashboardSnapshotSummary } from '../../../api/NewRelicDashboardApi'; +import useObservable from 'react-use/lib/useObservable'; type Props = { guid: string; name: string; permalink: string; - duration: number; }; -export const DashboardSnapshot = ({ - guid, - name, - permalink, - duration, -}: Props) => { +export const DashboardSnapshot = ({ guid, name, permalink }: Props) => { const newRelicDashboardAPI = useApi(newRelicDashboardApiRef); + const storageApi = useApi(storageApiRef).forBucket('newrelic-dashboard'); + const setStorageValue = (value: number) => { + storageApi.set(guid, value); + }; + const storageSnapshot = useObservable( + storageApi.observe$(guid), + storageApi.snapshot(guid), + ); + const { value, loading, error } = useAsync(async (): Promise< DashboardSnapshotSummary | undefined > => { const dashboardObject: Promise = - newRelicDashboardAPI.getDashboardSnapshot(guid, duration); + newRelicDashboardAPI.getDashboardSnapshot( + guid, + storageSnapshot.value || 2592000000, + ); return dashboardObject; - }, [guid, duration]); + }, [guid, storageSnapshot.value]); + if (loading) { return ; } if (error) { return ; } + const url = value?.getDashboardSnapshot?.data?.dashboardCreateSnapshotUrl?.replace( /\pdf$/i, 'png', ); return ( - - + + { + setStorageValue(Number(event.target.value)); + }} + > + 1 Hour + 12 Hours + 1 Day + 3 Days + 1 Week + 1 Month + + } + > diff --git a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshotList.tsx b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshotList.tsx index 87f2334bf7..85a73b0a4b 100644 --- a/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshotList.tsx +++ b/plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshotList.tsx @@ -137,7 +137,6 @@ export const DashboardSnapshotList = ({ guid }: Props) => { name={Entity.name} permalink={Entity.permalink} guid={Entity.guid} - duration={26297430000} /> );