Add custom time window annotation to newrelic-dashboard plugin and minor bug fix

Signed-off-by: Jake Crews <jake.crews@daveramsey.com>

.changeset/funny-fireants-shop.md

@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-newrelic-dashboard': patch
+---
+
+- Fix bug where the default time window/snapshot duration was supposed to be 30 days, but ended up being 43 weeks
+- Add the optional entity metadata annotation to change the time window of the data shown in the snapshot

plugins/newrelic-dashboard/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @backstage/plugin-newrelic-dashboard
 
+## 0.1.16
+
+### Patch Changes
+
+- Fix bug where the default time window/snapshot duration was supposed to be 30 days, but ended up being 43 weeks
+- Add the optional entity metadata annotation to change the time window of the data shown in the snapshot
+
 ## 0.1.15-next.1
 
 ### Patch Changes

plugins/newrelic-dashboard/README.md

@@ -60,20 +60,24 @@ const overviewContent = (
     </EntitySwitch>
 ```
 
-4. Add `newrelic.com/dashboard-guid` annotation in catalog descriptor file
+4. Add annotations in catalog descriptor file
 
-To Obtain the dashboard's GUID: Click the info icon by the dashboard's name to access the See metadata and manage tags modal and see the dashboard's GUID.
+   1. `newrelic.com/dashboard-guid`
+      - To obtain the dashboard's GUID: Click the info icon by the dashboard's name to access the See metadata and manage tags modal and see the dashboard's GUID.
+   1. `newrelic.com/dashboard-time-window` (optional)
+      - The time window of information of the data to show in the snapshot in milliseconds. If not included the time window will default to 30 days
 
-```
-// catalog-info.yaml
-apiVersion: backstage.io/v1alpha1
-kind: Component
-metadata:
-  # ...
-  annotations:
-    newrelic.com/dashboard-guid: <dashboard_guid>
-spec:
-  type: service
-```
+   ```
+   // catalog-info.yaml
+   apiVersion: backstage.io/v1alpha1
+   kind: Component
+   metadata:
+     # ...
+     annotations:
+       newrelic.com/dashboard-guid: <dashboard_guid>
+       newrelic.com/dashboard-time-window: <dashboard_guid> # optional
+   spec:
+     type: service
+   ```
 
 All set , you will be able to see the plugin in action!

plugins/newrelic-dashboard/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-newrelic-dashboard",
-  "version": "0.1.15-next.1",
+  "version": "0.1.16",
   "main": "src/index.ts",
   "types": "src/index.ts",
   "license": "Apache-2.0",

plugins/newrelic-dashboard/src/components/NewRelicDashboard/DashboardSnapshotList/DashboardSnapshotList.tsx

@@ -52,6 +52,7 @@ function a11yProps(index: number) {
 }
 type Props = {
   guid: string;
+  duration: number;
 };
 const useStyles = makeStyles(
   theme => ({
@@ -79,7 +80,7 @@ const useStyles = makeStyles(
   }),
   { name: 'DashboardHeaderTabs' },
 );
-export const DashboardSnapshotList = ({ guid }: Props) => {
+export const DashboardSnapshotList = ({ duration, guid }: Props) => {
   const styles = useStyles();
   const newRelicDashboardAPI = useApi(newRelicDashboardApiRef);
   const { value, loading, error } = useAsync(async (): Promise<
@@ -137,7 +138,7 @@ export const DashboardSnapshotList = ({ guid }: Props) => {
                 name={Entity.name}
                 permalink={Entity.permalink}
                 guid={Entity.guid}
-                duration={26297430000}
+                duration={duration ? duration : 2592000000}
               />
             </TabPanel>
           );

plugins/newrelic-dashboard/src/components/NewRelicDashboard/NewRelicDashboard.tsx

@@ -19,7 +19,10 @@ import { Page, Content } from '@backstage/core-components';
 import { DashboardEntityList } from './DashboardEntityList';
 import { DashboardSnapshotList } from './DashboardSnapshotList';
 import { useEntity } from '@backstage/plugin-catalog-react';
-import { NEWRELIC_GUID_ANNOTATION } from '../../constants';
+import {
+  NEWRELIC_TIME_WINDOW_ANNOTATION,
+  NEWRELIC_GUID_ANNOTATION,
+} from '../../constants';
 
 export const NewRelicDashboard = () => {
   const { entity } = useEntity();
@@ -35,6 +38,9 @@ export const NewRelicDashboard = () => {
               guid={String(
                 entity.metadata.annotations?.[NEWRELIC_GUID_ANNOTATION],
               )}
+              duration={Number(
+                entity.metadata.annotations?.[NEWRELIC_TIME_WINDOW_ANNOTATION],
+              )}
             />
           </Grid>
         </Grid>

plugins/newrelic-dashboard/src/constants.ts

@@ -14,3 +14,5 @@
  * limitations under the License.
  */
 export const NEWRELIC_GUID_ANNOTATION = 'newrelic.com/dashboard-guid';
+export const NEWRELIC_TIME_WINDOW_ANNOTATION =
+  'newrelic.com/dashboard-time-window';