diff --git a/.changeset/gold-yaks-join.md b/.changeset/gold-yaks-join.md new file mode 100644 index 0000000000..29996d1f74 --- /dev/null +++ b/.changeset/gold-yaks-join.md @@ -0,0 +1,6 @@ +--- +'@backstage/test-utils': patch +--- + +The test utility for the plugin context called `MockPluginProvider` has been created. It will be handy in the cases when you use +`__experimentalConfigure` in your plugin. It is experimental and exported through `@backstage/test-utils/alpha`. diff --git a/.changeset/yellow-forks-knock.md b/.changeset/yellow-forks-knock.md new file mode 100644 index 0000000000..98c4b5b675 --- /dev/null +++ b/.changeset/yellow-forks-knock.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-cost-insights': patch +--- + +Making a possibility to hide a trending line in a cost insights plugin diff --git a/packages/test-utils/api-report.md b/packages/test-utils/api-report.md index 38d6a85f5f..1b0aa44fc6 100644 --- a/packages/test-utils/api-report.md +++ b/packages/test-utils/api-report.md @@ -25,6 +25,7 @@ import { JsonObject } from '@backstage/types'; import { JsonValue } from '@backstage/types'; import { Observable } from '@backstage/types'; import { PermissionApi } from '@backstage/plugin-permission-react'; +import { PropsWithChildren } from 'react'; import { ReactElement } from 'react'; import { ReactNode } from 'react'; import { RenderOptions } from '@testing-library/react'; @@ -165,6 +166,11 @@ export class MockPermissionApi implements PermissionApi { ): Promise; } +// @alpha +export const MockPluginProvider: ({ + children, +}: PropsWithChildren<{}>) => JSX.Element; + // @public export class MockStorageApi implements StorageApi { // (undocumented) diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json index 30e1d90c18..d2e7f38e60 100644 --- a/packages/test-utils/package.json +++ b/packages/test-utils/package.json @@ -5,7 +5,8 @@ "publishConfig": { "access": "public", "main": "dist/index.esm.js", - "types": "dist/index.d.ts" + "types": "dist/index.d.ts", + "alphaTypes": "dist/index.alpha.d.ts" }, "backstage": { "role": "web-library" @@ -23,7 +24,7 @@ "main": "src/index.ts", "types": "src/index.ts", "scripts": { - "build": "backstage-cli package build", + "build": "backstage-cli package build --experimental-type-build", "lint": "backstage-cli package lint", "test": "backstage-cli package test", "prepack": "backstage-cli package prepack", @@ -60,6 +61,7 @@ "msw": "^0.49.0" }, "files": [ - "dist" + "dist", + "alpha" ] } diff --git a/packages/test-utils/src/testUtils/index.tsx b/packages/test-utils/src/testUtils/index.tsx index bfd870e2ad..1df236d92c 100644 --- a/packages/test-utils/src/testUtils/index.tsx +++ b/packages/test-utils/src/testUtils/index.tsx @@ -24,6 +24,7 @@ export { export type { TestAppOptions } from './appWrappers'; export * from './msw'; export * from './logCollector'; +export * from './providers'; export * from './testingLibrary'; export { TestApiProvider, TestApiRegistry } from './TestApiProvider'; export type { TestApiProviderProps } from './TestApiProvider'; diff --git a/packages/test-utils/src/testUtils/providers.tsx b/packages/test-utils/src/testUtils/providers.tsx new file mode 100644 index 0000000000..8bc4b5122d --- /dev/null +++ b/packages/test-utils/src/testUtils/providers.tsx @@ -0,0 +1,35 @@ +/* + * Copyright 2020 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import React, { PropsWithChildren } from 'react'; +import { createPlugin, PluginProvider } from '@backstage/core-plugin-api'; + +/** + * Mock for PluginProvider to use in unit tests + * @alpha + */ +export const MockPluginProvider = ({ children }: PropsWithChildren<{}>) => { + type TestInputPluginOptions = {}; + type TestPluginOptions = {}; + const plugin = createPlugin({ + id: 'my-plugin', + __experimentalConfigure(_: TestInputPluginOptions): TestPluginOptions { + return {}; + }, + }); + + return {children}; +}; diff --git a/plugins/catalog/src/components/CatalogPage/DefaultCatalogPage.test.tsx b/plugins/catalog/src/components/CatalogPage/DefaultCatalogPage.test.tsx index 969992bd4e..a2b26b87e1 100644 --- a/plugins/catalog/src/components/CatalogPage/DefaultCatalogPage.test.tsx +++ b/plugins/catalog/src/components/CatalogPage/DefaultCatalogPage.test.tsx @@ -23,21 +23,20 @@ import { } from '@backstage/catalog-model'; import { TableColumn, TableProps } from '@backstage/core-components'; import { - createPlugin, IdentityApi, identityApiRef, - PluginProvider, ProfileInfo, storageApiRef, } from '@backstage/core-plugin-api'; import { catalogApiRef, entityRouteRef, - starredEntitiesApiRef, MockStarredEntitiesApi, + starredEntitiesApiRef, } from '@backstage/plugin-catalog-react'; import { mockBreakpoint, + MockPluginProvider, MockStorageApi, renderWithEffects, TestApiProvider, @@ -135,22 +134,6 @@ describe('DefaultCatalogPage', () => { }; const storageApi = MockStorageApi.create(); - type TestInputPluginOptions = { - 'key-1': string; - }; - - type TestPluginOptions = { - 'key-1': string; - 'key-2': string; - }; - - const plugin = createPlugin({ - id: 'my-plugin', - __experimentalConfigure(_: TestInputPluginOptions): TestPluginOptions { - return { 'key-1': 'value-1', 'key-2': 'value-2' }; - }, - }); - const renderWrapped = (children: React.ReactNode) => renderWithEffects( wrapInTestApp( @@ -162,7 +145,7 @@ describe('DefaultCatalogPage', () => { [starredEntitiesApiRef, new MockStarredEntitiesApi()], ]} > - {children} + {children} , { mountedRoutes: { diff --git a/plugins/cost-insights/api-report.md b/plugins/cost-insights/api-report.md index f8349913d1..8ae49dcedc 100644 --- a/plugins/cost-insights/api-report.md +++ b/plugins/cost-insights/api-report.md @@ -322,7 +322,7 @@ const costInsightsPlugin: BackstagePlugin< unlabeledDataflowAlerts: RouteRef; }, {}, - {} + CostInsightsInputPluginOptions >; export { costInsightsPlugin }; export { costInsightsPlugin as plugin }; diff --git a/plugins/cost-insights/package.json b/plugins/cost-insights/package.json index db6227e17b..2e6b2d33f0 100644 --- a/plugins/cost-insights/package.json +++ b/plugins/cost-insights/package.json @@ -38,6 +38,7 @@ "@backstage/core-plugin-api": "workspace:^", "@backstage/plugin-catalog-react": "workspace:^", "@backstage/plugin-cost-insights-common": "workspace:^", + "@backstage/test-utils": "workspace:^", "@backstage/theme": "workspace:^", "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.test.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.test.tsx index 91c599e407..0a9451c794 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.test.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; import { fireEvent } from '@testing-library/react'; -import { renderInTestApp } from '@backstage/test-utils'; +import { MockPluginProvider, renderInTestApp } from '@backstage/test-utils'; import { CostOverviewCard } from './CostOverviewCard'; import { Cost } from '@backstage/plugin-cost-insights-common'; import { @@ -23,11 +23,11 @@ import { getGroupedProducts, getGroupedProjects, MockAggregatedDailyCosts, - trendlineOf, MockBillingDateProvider, MockConfigProvider, MockFilterProvider, MockScrollProvider, + trendlineOf, } from '../../testUtils'; import { CostInsightsThemeProvider } from '../CostInsightsPage/CostInsightsThemeProvider'; @@ -44,7 +44,9 @@ function renderInContext(children: JSX.Element) { - {children} + + {children} + diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx index 1e05a7ac0d..c46f2b0b82 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx @@ -47,6 +47,7 @@ import { groupByDate, toDataMax, trendFrom } from '../../utils/charts'; import { aggregationSort } from '../../utils/sort'; import { CostOverviewLegend } from './CostOverviewLegend'; import { TooltipRenderer } from '../../types'; +import { useCostInsightsOptions } from '../../options'; import { useConfig } from '../../hooks'; type CostOverviewChartProps = { @@ -133,6 +134,8 @@ export const CostOverviewChart = ({ ); }; + const { hideTrendLine } = useCostInsightsOptions(); + return ( - + {!hideTrendLine && ( + + )} {metric && ( - {children} + + + {children} + + diff --git a/plugins/cost-insights/src/options.ts b/plugins/cost-insights/src/options.ts new file mode 100644 index 0000000000..287935d703 --- /dev/null +++ b/plugins/cost-insights/src/options.ts @@ -0,0 +1,29 @@ +/* + * Copyright 2020 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { usePluginOptions } from '@backstage/core-plugin-api'; + +export type CostInsightsPluginOptions = { + hideTrendLine?: boolean; +}; + +/** @ignore */ +export type CostInsightsInputPluginOptions = { + hideTrendLine?: boolean; +}; + +export const useCostInsightsOptions = () => + usePluginOptions(); diff --git a/plugins/cost-insights/src/plugin.ts b/plugins/cost-insights/src/plugin.ts index 04d58d1877..c863c9e03a 100644 --- a/plugins/cost-insights/src/plugin.ts +++ b/plugins/cost-insights/src/plugin.ts @@ -19,6 +19,10 @@ import { createRouteRef, createRoutableExtension, } from '@backstage/core-plugin-api'; +import { + CostInsightsInputPluginOptions, + CostInsightsPluginOptions, +} from './options'; export const rootRouteRef = createRouteRef({ id: 'cost-insights', @@ -41,6 +45,14 @@ export const costInsightsPlugin = createPlugin({ growthAlerts: projectGrowthAlertRef, unlabeledDataflowAlerts: unlabeledDataflowAlertRef, }, + __experimentalConfigure( + options?: CostInsightsInputPluginOptions, + ): CostInsightsPluginOptions { + const defaultOptions = { + hideTrendLine: false, + }; + return { ...defaultOptions, ...options }; + }, }); /** @public */ diff --git a/plugins/cost-insights/src/testUtils/providers.tsx b/plugins/cost-insights/src/testUtils/providers.tsx index bdba7c26fb..46eab60163 100644 --- a/plugins/cost-insights/src/testUtils/providers.tsx +++ b/plugins/cost-insights/src/testUtils/providers.tsx @@ -15,13 +15,22 @@ */ import React, { PropsWithChildren } from 'react'; -import { LoadingContext, LoadingContextProps } from '../hooks'; -import { GroupsContext, GroupsContextProps } from '../hooks'; -import { FilterContext, FilterContextProps } from '../hooks'; -import { ConfigContext, ConfigContextProps } from '../hooks'; -import { CurrencyContext, CurrencyContextProps } from '../hooks'; -import { BillingDateContext, BillingDateContextProps } from '../hooks'; -import { ScrollContext, ScrollContextProps } from '../hooks'; +import { + LoadingContext, + LoadingContextProps, + GroupsContext, + GroupsContextProps, + FilterContext, + FilterContextProps, + ConfigContext, + ConfigContextProps, + CurrencyContext, + CurrencyContextProps, + BillingDateContext, + BillingDateContextProps, + ScrollContext, + ScrollContextProps, +} from '../hooks'; import { Duration } from '../types'; import { createCurrencyFormat } from '../utils/currency';