From 1f862ecf020ca8dbdc8cf531b6cf23fb5d1ccb17 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Mon, 26 Oct 2020 17:18:26 -0400 Subject: [PATCH 1/6] prefer named exports --- .../AlertActionCard.test.tsx | 2 +- .../AlertActionCardList/AlertActionCard.tsx | 4 +- .../AlertActionCardList.tsx | 6 +-- .../components/AlertActionCardList/index.ts | 2 +- .../AlertInsights/AlertInsights.tsx | 8 ++-- .../AlertInsights/AlertInsightsHeader.tsx | 4 +- .../AlertInsights/AlertInsightsSection.tsx | 6 +-- .../AlertInsightsSectionHeader.tsx | 4 +- .../src/components/AlertInsights/index.ts | 2 +- .../AlertInstructionsLayout.tsx | 4 +- .../AlertInstructionsLayout/index.ts | 2 +- .../src/components/BarChart/BarChart.test.tsx | 2 +- .../src/components/BarChart/BarChart.tsx | 8 ++-- .../src/components/BarChart/BarChartLabel.tsx | 4 +- .../components/BarChart/BarChartStepper.tsx | 8 ++-- .../BarChart/BarChartStepperButton.tsx | 4 +- .../src/components/BarChart/BarChartSteps.tsx | 9 ++-- .../src/components/BarChart/BarChartTick.tsx | 4 +- .../src/components/BarChart/index.ts | 2 +- .../CopyUrlToClipboard/CopyUrlToClipboard.tsx | 4 +- .../components/CopyUrlToClipboard/index.ts | 2 +- .../components/CostGrowth/CostGrowth.test.tsx | 10 ++--- .../src/components/CostGrowth/CostGrowth.tsx | 4 +- .../src/components/CostGrowth/index.ts | 2 +- .../CostInsightsHeader.test.tsx | 2 +- .../CostInsightsHeader/CostInsightsHeader.tsx | 4 +- .../components/CostInsightsHeader/index.ts | 2 +- .../CostInsightsLayout/CostInsightsLayout.tsx | 6 +-- .../components/CostInsightsLayout/index.ts | 2 +- .../CostInsightsNavigation.test.tsx | 2 +- .../CostInsightsNavigation.tsx | 12 +++-- .../CostInsightsNavigation/index.ts | 2 +- .../CostInsightsPage/CostInsightsPage.tsx | 29 ++++++------ .../CostInsightsPage/CostInsightsPageRoot.tsx | 6 +-- .../src/components/CostInsightsPage/index.ts | 3 +- .../CostInsightsSupportButton.tsx | 4 +- .../CostInsightsSupportButton/index.ts | 2 +- .../CostInsightsTabs.test.tsx | 2 +- .../CostInsightsTabs/CostInsightsTabs.tsx | 4 +- .../src/components/CostInsightsTabs/index.ts | 2 +- .../CostOverviewCard/CostOverviewCard.tsx | 16 +++---- .../CostOverviewCard/CostOverviewChart.tsx | 6 +-- .../CostOverviewCard/CostOverviewHeader.tsx | 44 +++++++++---------- .../CostOverviewCard/CostOverviewTooltip.tsx | 4 +- .../src/components/CostOverviewCard/index.ts | 2 +- .../CurrencySelect/CurrencySelect.tsx | 4 +- .../src/components/CurrencySelect/index.ts | 2 +- .../LabelDataflowInstructionsPage.tsx | 6 +-- .../LabelDataflowInstructionsPage/index.ts | 2 +- .../src/components/LegendItem/LegendItem.tsx | 4 +- .../src/components/LegendItem/index.ts | 2 +- .../MetricSelect/MetricSelect.test.tsx | 2 +- .../components/MetricSelect/MetricSelect.tsx | 4 +- .../src/components/MetricSelect/index.ts | 2 +- .../PeriodSelect/PeriodSelect.test.tsx | 2 +- .../components/PeriodSelect/PeriodSelect.tsx | 4 +- .../src/components/PeriodSelect/index.ts | 2 +- .../ProductInsights/ProductInsights.tsx | 11 ++--- .../src/components/ProductInsights/index.ts | 2 +- .../ProductInsightsCard.test.tsx | 2 +- .../ProductInsightsCard.tsx | 10 ++--- .../components/ProductInsightsCard/index.ts | 2 +- .../ProjectGrowthAlertCard.test.tsx | 2 +- .../ProjectGrowthAlertCard.tsx | 13 +++--- .../ProjectGrowthAlertCard/index.ts | 2 +- .../ProjectGrowthInstructionsPage.tsx | 10 ++--- .../ProjectGrowthInstructionsPage/index.ts | 2 +- .../ProjectSelect/ProjectSelect.test.tsx | 2 +- .../ProjectSelect/ProjectSelect.tsx | 4 +- .../src/components/ProjectSelect/index.ts | 2 +- .../ResourceGrowthBarChart.test.tsx | 2 +- .../ResourceGrowthBarChart.tsx | 6 +-- .../ResourceGrowthBarChart/index.ts | 2 +- .../ResourceGrowthBarChartLegend.test.tsx | 2 +- .../ResourceGrowthBarChartLegend.tsx | 8 ++-- .../ResourceGrowthBarChartLegend/index.ts | 2 +- .../src/components/Tooltip/Tooltip.test.tsx | 2 +- .../src/components/Tooltip/Tooltip.tsx | 6 +-- .../src/components/Tooltip/TooltipItem.tsx | 4 +- .../src/components/Tooltip/index.ts | 4 +- .../UnlabeledDataflowAlertCard.test.tsx | 4 +- .../UnlabeledDataflowAlertCard.tsx | 8 ++-- .../UnlabeledDataflowBarChart.tsx | 4 +- .../UnlabeledDataflowBarChartLegend.test.tsx | 2 +- .../UnlabeledDataflowBarChartLegend.tsx | 6 +-- .../UnlabeledDataflowAlertCard/index.ts | 2 +- .../UnlabeledDataflowBarChart/index.ts | 17 ------- .../UnlabeledDataflowBarChartLegend/index.ts | 17 ------- .../WhyCostsMatter/WhyCostsMatter.tsx | 4 +- .../src/components/WhyCostsMatter/index.ts | 2 +- plugins/cost-insights/src/components/index.ts | 6 +-- plugins/cost-insights/src/plugin.ts | 6 +-- plugins/cost-insights/src/types/Alert.tsx | 4 +- 93 files changed, 180 insertions(+), 303 deletions(-) rename plugins/cost-insights/src/components/{UnlabeledDataflowBarChart => UnlabeledDataflowAlertCard}/UnlabeledDataflowBarChart.tsx (96%) rename plugins/cost-insights/src/components/{UnlabeledDataflowBarChartLegend => UnlabeledDataflowAlertCard}/UnlabeledDataflowBarChartLegend.test.tsx (93%) rename plugins/cost-insights/src/components/{UnlabeledDataflowBarChartLegend => UnlabeledDataflowAlertCard}/UnlabeledDataflowBarChartLegend.tsx (92%) delete mode 100644 plugins/cost-insights/src/components/UnlabeledDataflowBarChart/index.ts delete mode 100644 plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/index.ts diff --git a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.test.tsx b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.test.tsx index 0600f89c60..3e2ca4f8c8 100644 --- a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.test.tsx +++ b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import AlertActionCard from './AlertActionCard'; +import { AlertActionCard } from './AlertActionCard'; import { ProjectGrowthAlert, ProjectGrowthData } from '../../types'; import { MockScrollProvider } from '../../utils/tests'; diff --git a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.tsx b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.tsx index a83c7bc7ce..78feade952 100644 --- a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.tsx +++ b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCard.tsx @@ -27,7 +27,7 @@ type AlertActionCardProps = { number: number; }; -const AlertActionCard = ({ alert, number }: AlertActionCardProps) => { +export const AlertActionCard = ({ alert, number }: AlertActionCardProps) => { const { scrollIntoView } = useScroll(`alert-${number}`); const headerClasses = useHeaderStyles(); const classes = useStyles(); @@ -43,5 +43,3 @@ const AlertActionCard = ({ alert, number }: AlertActionCardProps) => { ); }; - -export default AlertActionCard; diff --git a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCardList.tsx b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCardList.tsx index 1ea1fb6a96..f28989d745 100644 --- a/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCardList.tsx +++ b/plugins/cost-insights/src/components/AlertActionCardList/AlertActionCardList.tsx @@ -15,14 +15,14 @@ */ import React, { FC, Fragment } from 'react'; import { Paper, Divider } from '@material-ui/core'; -import AlertActionCard from './AlertActionCard'; +import { AlertActionCard } from './AlertActionCard'; import { Alert } from '../../types'; type AlertActionCardList = { alerts: Array; }; -const AlertActionCardList: FC = ({ alerts }) => ( +export const AlertActionCardList: FC = ({ alerts }) => ( {alerts.map((alert, index) => ( @@ -32,5 +32,3 @@ const AlertActionCardList: FC = ({ alerts }) => ( ))} ); - -export default AlertActionCardList; diff --git a/plugins/cost-insights/src/components/AlertActionCardList/index.ts b/plugins/cost-insights/src/components/AlertActionCardList/index.ts index cccffd2985..a0ce118482 100644 --- a/plugins/cost-insights/src/components/AlertActionCardList/index.ts +++ b/plugins/cost-insights/src/components/AlertActionCardList/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './AlertActionCardList'; +export { AlertActionCardList } from './AlertActionCardList'; diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsights.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsights.tsx index e0aa0f02d9..4606906f04 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsights.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsights.tsx @@ -16,8 +16,8 @@ import React from 'react'; import { Grid } from '@material-ui/core'; -import AlertInsightsSection from './AlertInsightsSection'; -import AlertInsightsHeader from './AlertInsightsHeader'; +import { AlertInsightsSection } from './AlertInsightsSection'; +import { AlertInsightsHeader } from './AlertInsightsHeader'; import { Alert } from '../../types'; const title = "Your team's action items"; @@ -28,7 +28,7 @@ type AlertInsightsProps = { alerts: Array; }; -const AlertInsights = ({ alerts }: AlertInsightsProps) => ( +export const AlertInsights = ({ alerts }: AlertInsightsProps) => ( @@ -42,5 +42,3 @@ const AlertInsights = ({ alerts }: AlertInsightsProps) => ( ); - -export default AlertInsights; diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx index b08ea01730..7a65010abf 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx @@ -25,7 +25,7 @@ type AlertInsightsHeaderProps = { subtitle: string; }; -const AlertInsightsHeader = ({ title, subtitle }: AlertInsightsHeaderProps) => { +export const AlertInsightsHeader = ({ title, subtitle }: AlertInsightsHeaderProps) => { const classes = useStyles(); const { ScrollAnchor } = useScroll(DefaultNavigation.AlertInsightsHeader); return ( @@ -43,5 +43,3 @@ const AlertInsightsHeader = ({ title, subtitle }: AlertInsightsHeaderProps) => { ); }; - -export default AlertInsightsHeader; diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx index d2305e390d..fe5425a937 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; import { Box, Button } from '@material-ui/core'; -import AlertInsightsSectionHeader from './AlertInsightsSectionHeader'; +import { AlertInsightsSectionHeader } from './AlertInsightsSectionHeader'; import { Alert } from '../../types'; type AlertInsightsSectionProps = { @@ -23,7 +23,7 @@ type AlertInsightsSectionProps = { number: number; }; -const AlertInsightsSection = ({ alert, number }: AlertInsightsSectionProps) => { +export const AlertInsightsSection = ({ alert, number }: AlertInsightsSectionProps) => { return ( { ); }; - -export default AlertInsightsSection; diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSectionHeader.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSectionHeader.tsx index a561735d58..3613e3adc8 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSectionHeader.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSectionHeader.tsx @@ -25,7 +25,7 @@ type AlertInsightsSectionHeaderProps = { subtitle: string; }; -const AlertInsightsSectionHeader = ({ +export const AlertInsightsSectionHeader = ({ number, title, subtitle, @@ -47,5 +47,3 @@ const AlertInsightsSectionHeader = ({ ); }; - -export default AlertInsightsSectionHeader; diff --git a/plugins/cost-insights/src/components/AlertInsights/index.ts b/plugins/cost-insights/src/components/AlertInsights/index.ts index 5ed33f4e39..a0684fdf26 100644 --- a/plugins/cost-insights/src/components/AlertInsights/index.ts +++ b/plugins/cost-insights/src/components/AlertInsights/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './AlertInsights'; +export { AlertInsights } from './AlertInsights'; diff --git a/plugins/cost-insights/src/components/AlertInstructionsLayout/AlertInstructionsLayout.tsx b/plugins/cost-insights/src/components/AlertInstructionsLayout/AlertInstructionsLayout.tsx index e230e94130..e46b718060 100644 --- a/plugins/cost-insights/src/components/AlertInstructionsLayout/AlertInstructionsLayout.tsx +++ b/plugins/cost-insights/src/components/AlertInstructionsLayout/AlertInstructionsLayout.tsx @@ -32,7 +32,7 @@ type AlertInstructionsLayoutProps = { title: string; }; -const AlertInstructionsLayout = ({ +export const AlertInstructionsLayout = ({ title, children, }: PropsWithChildren) => { @@ -65,5 +65,3 @@ const AlertInstructionsLayout = ({ ); }; - -export default AlertInstructionsLayout; diff --git a/plugins/cost-insights/src/components/AlertInstructionsLayout/index.ts b/plugins/cost-insights/src/components/AlertInstructionsLayout/index.ts index 4063fe06d9..22165e74c3 100644 --- a/plugins/cost-insights/src/components/AlertInstructionsLayout/index.ts +++ b/plugins/cost-insights/src/components/AlertInstructionsLayout/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './AlertInstructionsLayout'; +export { AlertInstructionsLayout } from './AlertInstructionsLayout'; diff --git a/plugins/cost-insights/src/components/BarChart/BarChart.test.tsx b/plugins/cost-insights/src/components/BarChart/BarChart.test.tsx index 737b86018c..a095324e6e 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChart.test.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChart.test.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { TooltipPayload } from 'recharts'; import { fireEvent } from '@testing-library/react'; -import BarChart, { BarChartProps } from './BarChart'; +import { BarChart, BarChartProps } from './BarChart'; import { BarChartData, ResourceData } from '../../types'; import { createMockEntity } from '../../utils/mockData'; import { resourceSort } from '../../utils/sort'; diff --git a/plugins/cost-insights/src/components/BarChart/BarChart.tsx b/plugins/cost-insights/src/components/BarChart/BarChart.tsx index 6b2bbc1490..65e7e39c64 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChart.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChart.tsx @@ -28,8 +28,8 @@ import { TooltipPayload, } from 'recharts'; import { Box, useTheme } from '@material-ui/core'; -import BarChartTick from './BarChartTick'; -import BarChartStepper from './BarChartStepper'; +import { BarChartTick } from './BarChartTick'; +import { BarChartStepper } from './BarChartStepper'; import { Tooltip, TooltipItemProps } from '../Tooltip'; import { currencyFormatter } from '../../utils/formatters'; @@ -52,7 +52,7 @@ export type BarChartProps = { resources: ResourceData[]; }; -const BarChart = ({ +export const BarChart = ({ responsive = true, displayAmount = 6, barChartData, @@ -171,5 +171,3 @@ const BarChart = ({ ); }; - -export default BarChart; diff --git a/plugins/cost-insights/src/components/BarChart/BarChartLabel.tsx b/plugins/cost-insights/src/components/BarChart/BarChartLabel.tsx index 9e49cb14dd..0a21f1ed46 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChartLabel.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChartLabel.tsx @@ -25,7 +25,7 @@ type BarChartLabel = { width: number; }; -const BarChartLabel = ({ +export const BarChartLabel = ({ x, y, height, @@ -52,5 +52,3 @@ const BarChartLabel = ({ ); }; - -export default BarChartLabel; diff --git a/plugins/cost-insights/src/components/BarChart/BarChartStepper.tsx b/plugins/cost-insights/src/components/BarChart/BarChartStepper.tsx index 27f7a589f3..e2e432fe04 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChartStepper.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChartStepper.tsx @@ -18,8 +18,8 @@ import React, { useEffect, useState } from 'react'; import { Paper, Slide } from '@material-ui/core'; import ChevronLeftIcon from '@material-ui/icons/ChevronLeft'; import ChevronRightIcon from '@material-ui/icons/ChevronRight'; -import BarChartStepperButton from './BarChartStepperButton'; -import BarChartSteps from './BarChartSteps'; +import { BarChartStepperButton } from './BarChartStepperButton'; +import { BarChartSteps } from './BarChartSteps'; import { useBarChartStepperStyles } from '../../utils/styles'; type BarChartStepperProps = { @@ -28,7 +28,7 @@ type BarChartStepperProps = { onChange: (activeStep: number) => void; }; -const BarChartStepper = ({ +export const BarChartStepper = ({ steps, disableScroll, onChange, @@ -111,5 +111,3 @@ const BarChartStepper = ({ ); }; - -export default BarChartStepper; diff --git a/plugins/cost-insights/src/components/BarChart/BarChartStepperButton.tsx b/plugins/cost-insights/src/components/BarChart/BarChartStepperButton.tsx index 66d1424576..0f36cfac77 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChartStepperButton.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChartStepperButton.tsx @@ -22,7 +22,7 @@ interface BarChartStepperButtonProps extends ButtonBaseProps { name: string; } -const BarChartStepperButton = forwardRef( +export const BarChartStepperButton = forwardRef( ( { name, @@ -45,5 +45,3 @@ const BarChartStepperButton = forwardRef( ); }, ); - -export default BarChartStepperButton; diff --git a/plugins/cost-insights/src/components/BarChart/BarChartSteps.tsx b/plugins/cost-insights/src/components/BarChart/BarChartSteps.tsx index 1ca0c7082a..7e3d40b476 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChartSteps.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChartSteps.tsx @@ -24,7 +24,7 @@ export type BarChartSteps = { onClick: (index: number) => void; }; -const BarChartSteps = ({ steps, activeStep, onClick }: BarChartSteps) => { +export const BarChartSteps = ({ steps, activeStep, onClick }: BarChartSteps) => { const classes = useStyles(); const handleOnClick = (index: number) => ( event: React.MouseEvent, @@ -39,14 +39,11 @@ const BarChartSteps = ({ steps, activeStep, onClick }: BarChartSteps) => {
))}
); }; - -export default BarChartSteps; diff --git a/plugins/cost-insights/src/components/BarChart/BarChartTick.tsx b/plugins/cost-insights/src/components/BarChart/BarChartTick.tsx index 99158c4573..005753fce6 100644 --- a/plugins/cost-insights/src/components/BarChart/BarChartTick.tsx +++ b/plugins/cost-insights/src/components/BarChart/BarChartTick.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import BarChartLabel from './BarChartLabel'; +import { BarChartLabel } from './BarChartLabel'; type BarChartTickProps = { x: number; @@ -44,5 +44,3 @@ export const BarChartTick = ({ ); }; - -export default BarChartTick; diff --git a/plugins/cost-insights/src/components/BarChart/index.ts b/plugins/cost-insights/src/components/BarChart/index.ts index 255bd2b3d8..b2c6390388 100644 --- a/plugins/cost-insights/src/components/BarChart/index.ts +++ b/plugins/cost-insights/src/components/BarChart/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './BarChart'; +export { BarChart } from './BarChart'; diff --git a/plugins/cost-insights/src/components/CopyUrlToClipboard/CopyUrlToClipboard.tsx b/plugins/cost-insights/src/components/CopyUrlToClipboard/CopyUrlToClipboard.tsx index c801eb86a5..0b5e7f9613 100644 --- a/plugins/cost-insights/src/components/CopyUrlToClipboard/CopyUrlToClipboard.tsx +++ b/plugins/cost-insights/src/components/CopyUrlToClipboard/CopyUrlToClipboard.tsx @@ -28,7 +28,7 @@ const ClipboardMessage = { error: "Couldn't copy to clipboard", }; -const CopyUrlToClipboard = () => { +export const CopyUrlToClipboard = () => { const location = useLocation(); const [state, copyToClipboard] = useCopyToClipboard(); const [copied, setCopied] = useState(false); @@ -66,5 +66,3 @@ const CopyUrlToClipboard = () => { ); }; - -export default CopyUrlToClipboard; diff --git a/plugins/cost-insights/src/components/CopyUrlToClipboard/index.ts b/plugins/cost-insights/src/components/CopyUrlToClipboard/index.ts index 15e2318c56..c7d6d4bf1f 100644 --- a/plugins/cost-insights/src/components/CopyUrlToClipboard/index.ts +++ b/plugins/cost-insights/src/components/CopyUrlToClipboard/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CopyUrlToClipboard'; +export { CopyUrlToClipboard } from './CopyUrlToClipboard'; diff --git a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx index 026b16c74a..3a49ba4626 100644 --- a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx +++ b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx @@ -16,7 +16,7 @@ import React, { PropsWithChildren } from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import CostGrowth from './CostGrowth'; +import { CostGrowth } from './CostGrowth'; import { defaultCurrencies, Currency, @@ -41,10 +41,10 @@ const MockContext = ({ currency: Currency; engineerCost: number; }>) => ( - - {children} - -); + + {children} + + ); describe.each` engineerCost | ratio | amount | expected diff --git a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.tsx b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.tsx index 0c0db2d62c..a43cae9720 100644 --- a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.tsx +++ b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.tsx @@ -35,7 +35,7 @@ export type CostGrowthProps = { duration: Duration; }; -const CostGrowth = ({ change, duration }: CostGrowthProps) => { +export const CostGrowth = ({ change, duration }: CostGrowthProps) => { const styles = useStyles(); const { engineerCost } = useConfig(); const [currency] = useCurrency(); @@ -70,5 +70,3 @@ const CostGrowth = ({ change, duration }: CostGrowthProps) => { return {cost}; }; - -export default CostGrowth; diff --git a/plugins/cost-insights/src/components/CostGrowth/index.ts b/plugins/cost-insights/src/components/CostGrowth/index.ts index 3cd809ee49..d4b1396586 100644 --- a/plugins/cost-insights/src/components/CostGrowth/index.ts +++ b/plugins/cost-insights/src/components/CostGrowth/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostGrowth'; +export { CostGrowth } from './CostGrowth'; diff --git a/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.test.tsx b/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.test.tsx index 8af5091188..8f299b0a3b 100644 --- a/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.test.tsx +++ b/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.test.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import CostInsightsHeader from './CostInsightsHeader'; +import { CostInsightsHeader } from './CostInsightsHeader'; import { renderInTestApp } from '@backstage/test-utils'; import { ApiProvider, diff --git a/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.tsx b/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.tsx index 57fa26b5fc..5e6de017d1 100644 --- a/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.tsx +++ b/plugins/cost-insights/src/components/CostInsightsHeader/CostInsightsHeader.tsx @@ -31,7 +31,7 @@ type CostInsightsHeaderProps = { alerts: number; }; -const CostInsightsHeader = (props: CostInsightsHeaderProps) => { +export const CostInsightsHeader = (props: CostInsightsHeaderProps) => { if (!props.hasCostData) { return ; } @@ -132,5 +132,3 @@ export const CostInsightsHeaderNoGroups = () => { ); }; - -export default CostInsightsHeader; diff --git a/plugins/cost-insights/src/components/CostInsightsHeader/index.ts b/plugins/cost-insights/src/components/CostInsightsHeader/index.ts index 8e7ddcc9c8..f5099aa19d 100644 --- a/plugins/cost-insights/src/components/CostInsightsHeader/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsHeader/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default, CostInsightsHeaderNoGroups } from './CostInsightsHeader'; +export { CostInsightsHeader, CostInsightsHeaderNoGroups } from './CostInsightsHeader'; diff --git a/plugins/cost-insights/src/components/CostInsightsLayout/CostInsightsLayout.tsx b/plugins/cost-insights/src/components/CostInsightsLayout/CostInsightsLayout.tsx index 1e5a56f1ff..2fc43957df 100644 --- a/plugins/cost-insights/src/components/CostInsightsLayout/CostInsightsLayout.tsx +++ b/plugins/cost-insights/src/components/CostInsightsLayout/CostInsightsLayout.tsx @@ -17,7 +17,7 @@ import React, { PropsWithChildren } from 'react'; import { makeStyles } from '@material-ui/core'; import { Header, Page } from '@backstage/core'; import { Group } from '../../types'; -import CostInsightsTabs from '../CostInsightsTabs'; +import { CostInsightsTabs } from '../CostInsightsTabs'; const useStyles = makeStyles(theme => ({ root: { @@ -36,7 +36,7 @@ type CostInsightsLayoutProps = { groups: Group[]; }; -const CostInsightsLayout = ({ +export const CostInsightsLayout = ({ groups, children, }: PropsWithChildren) => { @@ -56,5 +56,3 @@ const CostInsightsLayout = ({ ); }; - -export default CostInsightsLayout; diff --git a/plugins/cost-insights/src/components/CostInsightsLayout/index.ts b/plugins/cost-insights/src/components/CostInsightsLayout/index.ts index dd35eb2855..aa1c27bc93 100644 --- a/plugins/cost-insights/src/components/CostInsightsLayout/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsLayout/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostInsightsLayout'; +export { CostInsightsLayout } from './CostInsightsLayout'; diff --git a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.test.tsx b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.test.tsx index ac8561aa91..e2a0dd08b1 100644 --- a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.test.tsx +++ b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.test.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { default as HappyFace } from '@material-ui/icons/SentimentSatisfiedAlt'; import { renderInTestApp } from '@backstage/test-utils'; -import CostInsightsNavigation from './CostInsightsNavigation'; +import { CostInsightsNavigation } from './CostInsightsNavigation'; import { Product, Icon } from '../../types'; import { MockConfigProvider, MockScrollProvider } from '../../utils/tests'; import { getDefaultNavigationItems } from '../../utils/navigation'; diff --git a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx index fdbabe0402..62482c3323 100644 --- a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx +++ b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx @@ -36,7 +36,7 @@ type CostInsightsNavigationProps = { alerts: number; }; -const CostInsightsNavigation = ({ alerts }: CostInsightsNavigationProps) => { +export const CostInsightsNavigation = ({ alerts }: CostInsightsNavigationProps) => { const classes = useNavigationStyles(); const { products, icons } = useConfig(); @@ -64,10 +64,10 @@ const CostInsightsNavigation = ({ alerts }: CostInsightsNavigationProps) => { })} ) : ( - React.cloneElement(item.icon, { - className: classes.navigationIcon, - }) - ) + React.cloneElement(item.icon, { + className: classes.navigationIcon, + }) + ) } title={item.title} /> @@ -93,5 +93,3 @@ const NavigationMenuItem = ({ navigation, icon, title }: NavigationItem) => { ); }; - -export default CostInsightsNavigation; diff --git a/plugins/cost-insights/src/components/CostInsightsNavigation/index.ts b/plugins/cost-insights/src/components/CostInsightsNavigation/index.ts index 6c32ba7677..946ad157bb 100644 --- a/plugins/cost-insights/src/components/CostInsightsNavigation/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsNavigation/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostInsightsNavigation'; +export { CostInsightsNavigation } from './CostInsightsNavigation'; diff --git a/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPage.tsx b/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPage.tsx index 8e96a6f5a4..638f6fef00 100644 --- a/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPage.tsx +++ b/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPage.tsx @@ -19,19 +19,20 @@ import { Box, Container, Divider, Grid, Typography } from '@material-ui/core'; import { featureFlagsApiRef, Progress, useApi } from '@backstage/core'; import { default as MaterialAlert } from '@material-ui/lab/Alert'; import { costInsightsApiRef } from '../../api'; -import AlertActionCardList from '../AlertActionCardList'; -import AlertInsights from '../AlertInsights'; -import CostInsightsLayout from '../CostInsightsLayout'; -import CopyUrlToClipboard from '../CopyUrlToClipboard'; -import CurrencySelect from '../CurrencySelect'; -import WhyCostsMatter from '../WhyCostsMatter'; -import CostInsightsHeader, { +import { AlertActionCardList } from '../AlertActionCardList'; +import { AlertInsights } from '../AlertInsights'; +import { CostInsightsLayout } from '../CostInsightsLayout'; +import { CopyUrlToClipboard } from '../CopyUrlToClipboard'; +import { CurrencySelect } from '../CurrencySelect'; +import { WhyCostsMatter } from '../WhyCostsMatter'; +import { + CostInsightsHeader, CostInsightsHeaderNoGroups, } from '../CostInsightsHeader'; -import CostInsightsNavigation from '../CostInsightsNavigation'; -import CostOverviewCard from '../CostOverviewCard'; -import ProductInsights from '../ProductInsights'; -import CostInsightsSupportButton from '../CostInsightsSupportButton'; +import { CostInsightsNavigation } from '../CostInsightsNavigation'; +import { CostOverviewCard } from '../CostOverviewCard'; +import { ProductInsights } from '../ProductInsights'; +import { CostInsightsSupportButton } from '../CostInsightsSupportButton'; import { useConfig, useCurrency, @@ -49,10 +50,10 @@ import { Project, } from '../../types'; import { mapLoadingToProps } from './selector'; -import ProjectSelect from '../ProjectSelect'; +import { ProjectSelect } from '../ProjectSelect'; import { useSubtleTypographyStyles } from '../../utils/styles'; -const CostInsightsPage = () => { +export const CostInsightsPage = () => { const classes = useSubtleTypographyStyles(); const flags = useApi(featureFlagsApiRef).getFlags(); // There is not currently a UI to set feature flags @@ -300,5 +301,3 @@ const CostInsightsPage = () => { ); }; - -export default CostInsightsPage; diff --git a/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPageRoot.tsx b/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPageRoot.tsx index 6dca7982db..4f506b4076 100644 --- a/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPageRoot.tsx +++ b/plugins/cost-insights/src/components/CostInsightsPage/CostInsightsPageRoot.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import CostInsightsPage from './CostInsightsPage'; +import { CostInsightsPage } from './CostInsightsPage'; import { FilterProvider } from '../../hooks/useFilters'; import { LoadingProvider } from '../../hooks/useLoading'; import { GroupsProvider } from '../../hooks/useGroups'; @@ -25,7 +25,7 @@ import { ConfigProvider } from '../../hooks/useConfig'; import { BillingDateProvider } from '../../hooks/useLastCompleteBillingDate'; import { CostInsightsThemeProvider } from './CostInsightsThemeProvider'; -const CostInsightsPageRoot = () => ( +export const CostInsightsPageRoot = () => ( @@ -44,5 +44,3 @@ const CostInsightsPageRoot = () => ( ); - -export default CostInsightsPageRoot; diff --git a/plugins/cost-insights/src/components/CostInsightsPage/index.ts b/plugins/cost-insights/src/components/CostInsightsPage/index.ts index 67d5eb5daa..07d7b76233 100644 --- a/plugins/cost-insights/src/components/CostInsightsPage/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsPage/index.ts @@ -14,4 +14,5 @@ * limitations under the License. */ -export { default } from './CostInsightsPageRoot'; +export { CostInsightsPage } from './CostInsightsPage'; +export { CostInsightsPageRoot } from './CostInsightsPageRoot'; diff --git a/plugins/cost-insights/src/components/CostInsightsSupportButton/CostInsightsSupportButton.tsx b/plugins/cost-insights/src/components/CostInsightsSupportButton/CostInsightsSupportButton.tsx index c8e7fdac97..4dde49b3ef 100644 --- a/plugins/cost-insights/src/components/CostInsightsSupportButton/CostInsightsSupportButton.tsx +++ b/plugins/cost-insights/src/components/CostInsightsSupportButton/CostInsightsSupportButton.tsx @@ -17,12 +17,10 @@ import React from 'react'; import { SupportButton } from '@backstage/core'; -const CostInsightsSupportButton = () => { +export const CostInsightsSupportButton = () => { return ( Insights into cloud costs for your organization ); }; - -export default CostInsightsSupportButton; diff --git a/plugins/cost-insights/src/components/CostInsightsSupportButton/index.ts b/plugins/cost-insights/src/components/CostInsightsSupportButton/index.ts index eab947c1be..2049bd11e5 100644 --- a/plugins/cost-insights/src/components/CostInsightsSupportButton/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsSupportButton/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostInsightsSupportButton'; +export { CostInsightsSupportButton } from './CostInsightsSupportButton'; diff --git a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx index b75e0ab0d9..a910d43c22 100644 --- a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx +++ b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import CostInsightsTabs from './CostInsightsTabs'; +import { CostInsightsTabs } from './CostInsightsTabs'; import UserEvent from '@testing-library/user-event'; import { Group } from '../../types'; import { MockFilterProvider, MockLoadingProvider } from '../../utils/tests'; diff --git a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx index 3b86aa79ef..9e2f9598dc 100644 --- a/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx +++ b/plugins/cost-insights/src/components/CostInsightsTabs/CostInsightsTabs.tsx @@ -26,7 +26,7 @@ export type CostInsightsTabsProps = { groups: Group[]; }; -const CostInsightsTabs = ({ groups }: CostInsightsTabsProps) => { +export const CostInsightsTabs = ({ groups }: CostInsightsTabsProps) => { const classes = useStyles(); const [index] = useState(0); // index is fixed for now until other tabs are added const [groupMenuEl, setGroupMenuEl] = useState(null); @@ -107,5 +107,3 @@ const CostInsightsTabs = ({ groups }: CostInsightsTabsProps) => { ); }; - -export default CostInsightsTabs; diff --git a/plugins/cost-insights/src/components/CostInsightsTabs/index.ts b/plugins/cost-insights/src/components/CostInsightsTabs/index.ts index 7055334c2d..76472bb631 100644 --- a/plugins/cost-insights/src/components/CostInsightsTabs/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsTabs/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostInsightsTabs'; +export { CostInsightsTabs } from './CostInsightsTabs'; diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.tsx index a08e7fc789..c6269f7dc6 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewCard.tsx @@ -16,12 +16,12 @@ import React from 'react'; import { Box, Card, CardContent, Divider, useTheme } from '@material-ui/core'; -import CostGrowth from '../CostGrowth'; -import CostOverviewChart from './CostOverviewChart'; -import CostOverviewHeader from './CostOverviewHeader'; -import LegendItem from '../LegendItem'; -import MetricSelect from '../MetricSelect'; -import PeriodSelect from '../PeriodSelect'; +import { CostGrowth } from '../CostGrowth'; +import { CostOverviewChart } from './CostOverviewChart'; +import { CostOverviewHeader } from './CostOverviewHeader'; +import { LegendItem } from '../LegendItem'; +import { MetricSelect } from '../MetricSelect'; +import { PeriodSelect } from '../PeriodSelect'; import { useScroll, useFilters, useConfig } from '../../hooks'; import { mapFiltersToProps } from './selector'; import { DefaultNavigation } from '../../utils/navigation'; @@ -39,7 +39,7 @@ export type CostOverviewCardProps = { metricData: MetricData | null; }; -const CostOverviewCard = ({ +export const CostOverviewCard = ({ dailyCostData, metricData, }: CostOverviewCardProps) => { @@ -114,5 +114,3 @@ const CostOverviewCard = ({ ); }; - -export default CostOverviewCard; diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx index 9612589542..e442b9a64a 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewChart.tsx @@ -38,7 +38,7 @@ import { overviewGraphTickFormatter, formatGraphValue, } from '../../utils/graphs'; -import CostOverviewTooltip from './CostOverviewTooltip'; +import { CostOverviewTooltip } from './CostOverviewTooltip'; import { TooltipItemProps } from '../Tooltip'; import { useCostOverviewStyles as useStyles } from '../../utils/styles'; import { groupByDate, toDataMax, trendFrom } from '../../utils/charts'; @@ -51,7 +51,7 @@ type CostOverviewChartProps = { responsive?: boolean; }; -const CostOverviewChart = ({ +export const CostOverviewChart = ({ dailyCostData, metric, metricData, @@ -181,5 +181,3 @@ const CostOverviewChart = ({ ); }; - -export default CostOverviewChart; diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx index 76a0d944de..c01eabfa53 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx @@ -21,32 +21,30 @@ type CostOverviewHeaderProps = { subtitle?: string; }; -const CostOverviewHeader = ({ +export const CostOverviewHeader = ({ title, subtitle, children, }: PropsWithChildren) => ( - - - - {title} - - {!!subtitle && ( - - {subtitle} + + + + {title} - )} + {!!subtitle && ( + + {subtitle} + + )} + + + {children} + - - {children} - - -); - -export default CostOverviewHeader; + ); diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewTooltip.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewTooltip.tsx index c8a7b8533c..e0a9b9a9ea 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewTooltip.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewTooltip.tsx @@ -24,7 +24,7 @@ export type CostOverviewTooltipProps = TooltipProps & { format: (payload: TooltipPayload) => TooltipItemProps; }; -const CostOverviewTooltip = ({ +export const CostOverviewTooltip = ({ label, payload, dataKeys, @@ -36,5 +36,3 @@ const CostOverviewTooltip = ({ .map(p => format(p)); return ; }; - -export default CostOverviewTooltip; diff --git a/plugins/cost-insights/src/components/CostOverviewCard/index.ts b/plugins/cost-insights/src/components/CostOverviewCard/index.ts index c59fb5cc5b..370dab8d01 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/index.ts +++ b/plugins/cost-insights/src/components/CostOverviewCard/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CostOverviewCard'; +export { CostOverviewCard } from './CostOverviewCard'; diff --git a/plugins/cost-insights/src/components/CurrencySelect/CurrencySelect.tsx b/plugins/cost-insights/src/components/CurrencySelect/CurrencySelect.tsx index 24063a664e..413426e9af 100644 --- a/plugins/cost-insights/src/components/CurrencySelect/CurrencySelect.tsx +++ b/plugins/cost-insights/src/components/CurrencySelect/CurrencySelect.tsx @@ -27,7 +27,7 @@ type CurrencySelectProps = { onSelect: (currency: Currency) => void; }; -const CurrencySelect = ({ +export const CurrencySelect = ({ currency, currencies, onSelect, @@ -71,5 +71,3 @@ const CurrencySelect = ({ ); }; - -export default CurrencySelect; diff --git a/plugins/cost-insights/src/components/CurrencySelect/index.ts b/plugins/cost-insights/src/components/CurrencySelect/index.ts index 322b67d4ce..5e42217fe1 100644 --- a/plugins/cost-insights/src/components/CurrencySelect/index.ts +++ b/plugins/cost-insights/src/components/CurrencySelect/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './CurrencySelect'; +export { CurrencySelect } from './CurrencySelect'; diff --git a/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/LabelDataflowInstructionsPage.tsx b/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/LabelDataflowInstructionsPage.tsx index 9783fadcb2..3442de49fc 100644 --- a/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/LabelDataflowInstructionsPage.tsx +++ b/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/LabelDataflowInstructionsPage.tsx @@ -17,9 +17,9 @@ import React from 'react'; import { Box, Typography } from '@material-ui/core'; import { CodeSnippet } from '@backstage/core'; -import AlertInstructionsLayout from '../AlertInstructionsLayout'; +import { AlertInstructionsLayout } from '../AlertInstructionsLayout'; -const LabelDataflowInstructionsPage = () => { +export const LabelDataflowInstructionsPage = () => { return ( Labeling Dataflow Jobs @@ -92,5 +92,3 @@ sc.optionsAs[DataflowPipelineOptions].setLabels(Map("job-id" -> "my-dataflow-job ); }; - -export default LabelDataflowInstructionsPage; diff --git a/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/index.ts b/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/index.ts index 052ed379ec..de2136f033 100644 --- a/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/index.ts +++ b/plugins/cost-insights/src/components/LabelDataflowInstructionsPage/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './LabelDataflowInstructionsPage'; +export { LabelDataflowInstructionsPage } from './LabelDataflowInstructionsPage'; diff --git a/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx b/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx index ffde830312..cabc5f9c59 100644 --- a/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx +++ b/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx @@ -26,7 +26,7 @@ type LegendItemProps = { markerColor?: string; }; -const LegendItem = ({ +export const LegendItem = ({ title, tooltipText, markerColor, @@ -73,5 +73,3 @@ const LegendItem = ({ ); }; - -export default LegendItem; diff --git a/plugins/cost-insights/src/components/LegendItem/index.ts b/plugins/cost-insights/src/components/LegendItem/index.ts index 763b8fc4f4..e97af0c97f 100644 --- a/plugins/cost-insights/src/components/LegendItem/index.ts +++ b/plugins/cost-insights/src/components/LegendItem/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './LegendItem'; +export { LegendItem } from './LegendItem'; diff --git a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.test.tsx b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.test.tsx index e78fd77b1a..bfb6daedd6 100644 --- a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.test.tsx +++ b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { waitFor } from '@testing-library/react'; import UserEvent from '@testing-library/user-event'; -import MetricSelect, { MetricSelectProps } from './MetricSelect'; +import { MetricSelect, MetricSelectProps } from './MetricSelect'; import { renderInTestApp } from '@backstage/test-utils'; describe('', () => { diff --git a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx index 474d8622ea..f91070271f 100644 --- a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx +++ b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx @@ -25,7 +25,7 @@ export type MetricSelectProps = { onSelect: (metric: Maybe) => void; }; -const MetricSelect = ({ metric, metrics, onSelect }: MetricSelectProps) => { +export const MetricSelect = ({ metric, metrics, onSelect }: MetricSelectProps) => { const classes = useStyles(); function onChange(e: React.ChangeEvent<{ value: unknown }>) { @@ -61,5 +61,3 @@ const MetricSelect = ({ metric, metrics, onSelect }: MetricSelectProps) => { ); }; - -export default MetricSelect; diff --git a/plugins/cost-insights/src/components/MetricSelect/index.ts b/plugins/cost-insights/src/components/MetricSelect/index.ts index f68e5031c1..4be7e97e90 100644 --- a/plugins/cost-insights/src/components/MetricSelect/index.ts +++ b/plugins/cost-insights/src/components/MetricSelect/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './MetricSelect'; +export { MetricSelect } from './MetricSelect'; diff --git a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.test.tsx b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.test.tsx index 3c55285908..e2cf1b7480 100644 --- a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.test.tsx +++ b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.test.tsx @@ -18,7 +18,7 @@ import React from 'react'; import { getByRole, waitFor } from '@testing-library/react'; import { renderInTestApp } from '@backstage/test-utils'; import UserEvent from '@testing-library/user-event'; -import PeriodSelect, { getDefaultOptions } from './PeriodSelect'; +import { PeriodSelect, getDefaultOptions } from './PeriodSelect'; import { Duration, getDefaultPageFilters, Group } from '../../types'; import { MockBillingDateProvider } from '../../utils/tests'; diff --git a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx index 08cf8a73f9..0088830471 100644 --- a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx +++ b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx @@ -58,7 +58,7 @@ type PeriodSelectProps = { options?: PeriodOption[]; }; -const PeriodSelect = ({ duration, onSelect, options }: PeriodSelectProps) => { +export const PeriodSelect = ({ duration, onSelect, options }: PeriodSelectProps) => { const classes = useStyles(); const lastCompleteBillingDate = useLastCompleteBillingDate(); const optionsOrDefault = @@ -95,5 +95,3 @@ const PeriodSelect = ({ duration, onSelect, options }: PeriodSelectProps) => { ); }; - -export default PeriodSelect; diff --git a/plugins/cost-insights/src/components/PeriodSelect/index.ts b/plugins/cost-insights/src/components/PeriodSelect/index.ts index 7bd70b3358..31ca2a649c 100644 --- a/plugins/cost-insights/src/components/PeriodSelect/index.ts +++ b/plugins/cost-insights/src/components/PeriodSelect/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './PeriodSelect'; +export { PeriodSelect } from './PeriodSelect'; diff --git a/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx b/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx index cc52012543..7420c8d82c 100644 --- a/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx +++ b/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx @@ -16,12 +16,11 @@ import React from 'react'; import { Box, Typography, Grid } from '@material-ui/core'; -import ProductInsightsCard from '../ProductInsightsCard'; +import { ProductInsightsCard } from '../ProductInsightsCard'; import { useConfig } from '../../hooks'; -const ProductInsights = ({}) => { - const { products } = useConfig(); - +export const ProductInsights = ({ }) => { + const config = useConfig(); return ( <> @@ -30,7 +29,7 @@ const ProductInsights = ({}) => { - {products.map(product => ( + {config.products.map(product => ( @@ -39,5 +38,3 @@ const ProductInsights = ({}) => { ); }; - -export default ProductInsights; diff --git a/plugins/cost-insights/src/components/ProductInsights/index.ts b/plugins/cost-insights/src/components/ProductInsights/index.ts index 0a20d3c322..84c2d410b0 100644 --- a/plugins/cost-insights/src/components/ProductInsights/index.ts +++ b/plugins/cost-insights/src/components/ProductInsights/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ProductInsights'; +export { ProductInsights } from './ProductInsights'; diff --git a/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.test.tsx b/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.test.tsx index bae4eef591..9d1610e298 100644 --- a/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.test.tsx +++ b/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import ProductInsightsCard from './ProductInsightsCard'; +import { ProductInsightsCard } from './ProductInsightsCard'; import { CostInsightsApi } from '../../api'; import { createMockEntity, diff --git a/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.tsx b/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.tsx index bf56eb23e8..840c99522a 100644 --- a/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.tsx +++ b/plugins/cost-insights/src/components/ProductInsightsCard/ProductInsightsCard.tsx @@ -19,9 +19,9 @@ import { InfoCard, useApi } from '@backstage/core'; import { Box } from '@material-ui/core'; import Alert from '@material-ui/lab/Alert'; import { costInsightsApiRef } from '../../api'; -import PeriodSelect from '../PeriodSelect'; -import ResourceGrowthBarChart from '../ResourceGrowthBarChart'; -import ResourceGrowthBarChartLegend from '../ResourceGrowthBarChartLegend'; +import { PeriodSelect } from '../PeriodSelect'; +import { ResourceGrowthBarChart } from '../ResourceGrowthBarChart'; +import { ResourceGrowthBarChartLegend } from '../ResourceGrowthBarChartLegend'; import { useFilters, useLastCompleteBillingDate, @@ -38,7 +38,7 @@ type ProductInsightsCardProps = { product: Product; }; -const ProductInsightsCard = ({ product }: ProductInsightsCardProps) => { +export const ProductInsightsCard = ({ product }: ProductInsightsCardProps) => { const client = useApi(costInsightsApiRef); const classes = useStyles(); const { ScrollAnchor } = useScroll(product.kind); @@ -166,5 +166,3 @@ const ProductInsightsCard = ({ product }: ProductInsightsCardProps) => { ); }; - -export default ProductInsightsCard; diff --git a/plugins/cost-insights/src/components/ProductInsightsCard/index.ts b/plugins/cost-insights/src/components/ProductInsightsCard/index.ts index ef378004f0..61222f9466 100644 --- a/plugins/cost-insights/src/components/ProductInsightsCard/index.ts +++ b/plugins/cost-insights/src/components/ProductInsightsCard/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ProductInsightsCard'; +export { ProductInsightsCard } from './ProductInsightsCard'; diff --git a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.test.tsx b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.test.tsx index 97775258c9..4b5da409a4 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.test.tsx +++ b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import ProjectGrowthAlertCard from './ProjectGrowthAlertCard'; +import { ProjectGrowthAlertCard } from './ProjectGrowthAlertCard'; import { createMockProjectGrowthData } from '../../utils/mockData'; import { MockCurrencyProvider, diff --git a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx index 1b37a5a131..18f7fa151d 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx +++ b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx @@ -18,8 +18,8 @@ import React from 'react'; import moment from 'moment'; import { Box } from '@material-ui/core'; import { InfoCard } from '@backstage/core'; -import ResourceGrowthBarChart from '../ResourceGrowthBarChart'; -import ResourceGrowthBarChartLegend from '../ResourceGrowthBarChartLegend'; +import { ResourceGrowthBarChart } from '../ResourceGrowthBarChart'; +import { ResourceGrowthBarChartLegend } from '../ResourceGrowthBarChartLegend'; import { Duration, ProjectGrowthData } from '../../types'; import { pluralOf } from '../../utils/grammar'; @@ -27,13 +27,12 @@ type ProjectGrowthAlertProps = { alert: ProjectGrowthData; }; -const ProjectGrowthAlertCard = ({ alert }: ProjectGrowthAlertProps) => { +export const ProjectGrowthAlertCard = ({ alert }: ProjectGrowthAlertProps) => { const [costStart, costEnd] = alert.aggregation; const subheader = ` - ${alert.products.length} ${pluralOf(alert.products.length, 'product')}${ - alert.products.length > 1 ? ', sorted by cost' : '' - }`; + ${alert.products.length} ${pluralOf(alert.products.length, 'product')}${alert.products.length > 1 ? ', sorted by cost' : '' + }`; const previousName = moment(alert.periodStart, 'YYYY-[Q]Q').format( '[Q]Q YYYY', ); @@ -64,5 +63,3 @@ const ProjectGrowthAlertCard = ({ alert }: ProjectGrowthAlertProps) => { ); }; - -export default ProjectGrowthAlertCard; diff --git a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/index.ts b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/index.ts index ab608f5f4c..75656f105c 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/index.ts +++ b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ProjectGrowthAlertCard'; +export { ProjectGrowthAlertCard } from './ProjectGrowthAlertCard'; diff --git a/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/ProjectGrowthInstructionsPage.tsx b/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/ProjectGrowthInstructionsPage.tsx index 634514c1df..3c2d241222 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/ProjectGrowthInstructionsPage.tsx +++ b/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/ProjectGrowthInstructionsPage.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { Box, Typography } from '@material-ui/core'; import { InfoCard } from '@backstage/core'; -import AlertInstructionsLayout from '../AlertInstructionsLayout'; +import { AlertInstructionsLayout } from '../AlertInstructionsLayout'; import { Alert, Duration, @@ -26,10 +26,10 @@ import { ProjectGrowthAlert, ProjectGrowthData, } from '../../types'; -import ResourceGrowthBarChartLegend from '../ResourceGrowthBarChartLegend'; -import ResourceGrowthBarChart from '../ResourceGrowthBarChart'; +import { ResourceGrowthBarChartLegend } from '../ResourceGrowthBarChartLegend'; +import { ResourceGrowthBarChart } from '../ResourceGrowthBarChart'; -const ProjectGrowthInstructionsPage = () => { +export const ProjectGrowthInstructionsPage = () => { const alertData: ProjectGrowthData = { project: 'example-project', periodStart: 'Q1 2020', @@ -211,5 +211,3 @@ const ProjectGrowthInstructionsPage = () => { ); }; - -export default ProjectGrowthInstructionsPage; diff --git a/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/index.ts b/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/index.ts index c75240405c..053289b2e2 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/index.ts +++ b/plugins/cost-insights/src/components/ProjectGrowthInstructionsPage/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ProjectGrowthInstructionsPage'; +export { ProjectGrowthInstructionsPage } from './ProjectGrowthInstructionsPage'; diff --git a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.test.tsx b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.test.tsx index 848fd9ea7c..16270429e8 100644 --- a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.test.tsx +++ b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.test.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { getByRole, waitFor } from '@testing-library/react'; import UserEvent from '@testing-library/user-event'; -import ProjectSelect from './ProjectSelect'; +import { ProjectSelect } from './ProjectSelect'; import { MockFilterProvider } from '../../utils/tests'; import { renderInTestApp } from '@backstage/test-utils'; diff --git a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx index 934ad99f63..29169d1f5f 100644 --- a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx +++ b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx @@ -24,7 +24,7 @@ type ProjectSelectProps = { onSelect: (project: Maybe) => void; }; -const ProjectSelect = ({ project, projects, onSelect }: ProjectSelectProps) => { +export const ProjectSelect = ({ project, projects, onSelect }: ProjectSelectProps) => { const classes = useStyles(); const projectOptions = [{ id: 'all' } as Project, ...projects] @@ -66,5 +66,3 @@ const ProjectSelect = ({ project, projects, onSelect }: ProjectSelectProps) => { ); }; - -export default ProjectSelect; diff --git a/plugins/cost-insights/src/components/ProjectSelect/index.ts b/plugins/cost-insights/src/components/ProjectSelect/index.ts index 47a2b9e22c..06a553444d 100644 --- a/plugins/cost-insights/src/components/ProjectSelect/index.ts +++ b/plugins/cost-insights/src/components/ProjectSelect/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ProjectSelect'; +export { ProjectSelect } from './ProjectSelect'; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.test.tsx b/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.test.tsx index 9a3899f2ff..e3d9d61d1b 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.test.tsx +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import ResourceGrowthBarChart from './ResourceGrowthBarChart'; +import { ResourceGrowthBarChart } from './ResourceGrowthBarChart'; import { renderInTestApp } from '@backstage/test-utils'; import { createMockEntity } from '../../utils/mockData'; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.tsx b/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.tsx index daa6d88683..b4014bf00f 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.tsx +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChart/ResourceGrowthBarChart.tsx @@ -26,7 +26,7 @@ import { Maybe, ResourceData, } from '../../types'; -import BarChart from '../BarChart'; +import { BarChart } from '../BarChart'; import { TooltipItemProps } from '../Tooltip'; import { useTheme } from '@material-ui/core'; @@ -36,7 +36,7 @@ export type ResourceGrowthBarChartProps = { currentName: string; }; -const ResourceGrowthBarChart = ({ +export const ResourceGrowthBarChart = ({ resources, previousName, currentName, @@ -85,5 +85,3 @@ const ResourceGrowthBarChart = ({ /> ); }; - -export default ResourceGrowthBarChart; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChart/index.ts b/plugins/cost-insights/src/components/ResourceGrowthBarChart/index.ts index b1388143e4..ef649a17af 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChart/index.ts +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChart/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ResourceGrowthBarChart'; +export { ResourceGrowthBarChart } from './ResourceGrowthBarChart'; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.test.tsx b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.test.tsx index e3c2506296..2bc998d9df 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.test.tsx +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.test.tsx @@ -16,7 +16,7 @@ import React, { PropsWithChildren } from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import ResourceGrowthBarChartLegend from './ResourceGrowthBarChartLegend'; +import { ResourceGrowthBarChartLegend } from './ResourceGrowthBarChartLegend'; import { defaultCurrencies, Duration, findAlways } from '../../types'; import { MockConfigProvider, MockCurrencyProvider } from '../../utils/tests'; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.tsx b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.tsx index 9b0f77ceda..6b5ce17c95 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.tsx +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/ResourceGrowthBarChartLegend.tsx @@ -16,8 +16,8 @@ import React from 'react'; import { Box, useTheme } from '@material-ui/core'; -import LegendItem from '../LegendItem'; -import CostGrowth from '../CostGrowth'; +import { LegendItem } from '../LegendItem'; +import { CostGrowth } from '../CostGrowth'; import { currencyFormatter } from '../../utils/formatters'; import { ChangeStatistic, CostInsightsTheme, Duration } from '../../types'; @@ -30,7 +30,7 @@ export type ResourceGrowthBarChartLegendProps = { costEnd: number; }; -const ResourceGrowthBarChartLegend = ({ +export const ResourceGrowthBarChartLegend = ({ change, duration, previousName, @@ -58,5 +58,3 @@ const ResourceGrowthBarChartLegend = ({ ); }; - -export default ResourceGrowthBarChartLegend; diff --git a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/index.ts b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/index.ts index 7071799805..ee77a483e6 100644 --- a/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/index.ts +++ b/plugins/cost-insights/src/components/ResourceGrowthBarChartLegend/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './ResourceGrowthBarChartLegend'; +export { ResourceGrowthBarChartLegend } from './ResourceGrowthBarChartLegend'; diff --git a/plugins/cost-insights/src/components/Tooltip/Tooltip.test.tsx b/plugins/cost-insights/src/components/Tooltip/Tooltip.test.tsx index 8c12b34ffb..2f1f8fe7e1 100644 --- a/plugins/cost-insights/src/components/Tooltip/Tooltip.test.tsx +++ b/plugins/cost-insights/src/components/Tooltip/Tooltip.test.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { renderInTestApp } from '@backstage/test-utils'; -import Tooltip from './Tooltip'; +import { Tooltip } from './Tooltip'; import { CostInsightsThemeProvider } from '../CostInsightsPage/CostInsightsThemeProvider'; const mockTooltipItems = [ diff --git a/plugins/cost-insights/src/components/Tooltip/Tooltip.tsx b/plugins/cost-insights/src/components/Tooltip/Tooltip.tsx index 727b2476c8..e0ee93c669 100644 --- a/plugins/cost-insights/src/components/Tooltip/Tooltip.tsx +++ b/plugins/cost-insights/src/components/Tooltip/Tooltip.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { Box, Typography } from '@material-ui/core'; -import TooltipItem, { TooltipItemProps } from './TooltipItem'; +import { TooltipItem, TooltipItemProps } from './TooltipItem'; import { useTooltipStyles } from '../../utils/styles'; export type TooltipProps = { @@ -24,7 +24,7 @@ export type TooltipProps = { items?: Array; }; -const Tooltip = ({ label, items }: TooltipProps) => { +export const Tooltip = ({ label, items }: TooltipProps) => { const classes = useTooltipStyles(); return ( { ); }; - -export default Tooltip; diff --git a/plugins/cost-insights/src/components/Tooltip/TooltipItem.tsx b/plugins/cost-insights/src/components/Tooltip/TooltipItem.tsx index 67d4eac15f..a084a0fd1d 100644 --- a/plugins/cost-insights/src/components/Tooltip/TooltipItem.tsx +++ b/plugins/cost-insights/src/components/Tooltip/TooltipItem.tsx @@ -25,7 +25,7 @@ export type TooltipItemProps = { fill: string; }; -const TooltipItem = ({ fill, label, value }: TooltipItemProps) => { +export const TooltipItem = ({ fill, label, value }: TooltipItemProps) => { const classes = useStyles(); const style = { fill: fill }; return ( @@ -45,5 +45,3 @@ const TooltipItem = ({ fill, label, value }: TooltipItemProps) => { ); }; - -export default TooltipItem; diff --git a/plugins/cost-insights/src/components/Tooltip/index.ts b/plugins/cost-insights/src/components/Tooltip/index.ts index d56352d324..b26409480e 100644 --- a/plugins/cost-insights/src/components/Tooltip/index.ts +++ b/plugins/cost-insights/src/components/Tooltip/index.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -export { default as Tooltip } from './Tooltip'; +export { Tooltip } from './Tooltip'; export type { TooltipProps } from './Tooltip'; -export { default as TooltipItem } from './TooltipItem'; +export { TooltipItem } from './TooltipItem'; export type { TooltipItemProps } from './TooltipItem'; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx index edc4152e3c..6edd4ed637 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import UnlabeledDataflowAlertCard from './UnlabeledDataflowAlertCard'; +import { UnlabeledDataflowAlertCard } from './UnlabeledDataflowAlertCard'; import { createMockUnlabeledDataflowData, createMockUnlabeledDataflowAlertProject, @@ -44,7 +44,7 @@ describe('', () => { it('renders the correct subheader for multiple projects', async () => { const subheader = new RegExp( `Showing costs from ${MockUnlabeledDataflowAlertMultipleProjects.projects.length} ` + - 'projects with unlabeled Dataflow jobs in the last 30 days.', + 'projects with unlabeled Dataflow jobs in the last 30 days.', ); const rendered = await renderInTestApp( { +export const UnlabeledDataflowAlertCard = ({ alert }: UnlabeledDataflowAlertProps) => { const projects = pluralOf(alert.projects.length, 'project'); const subheader = ` Showing costs from ${alert.projects.length} ${projects} with unlabeled Dataflow jobs in the last 30 days. @@ -47,5 +47,3 @@ const UnlabeledDataflowAlertCard = ({ alert }: UnlabeledDataflowAlertProps) => { ); }; - -export default UnlabeledDataflowAlertCard; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowBarChart/UnlabeledDataflowBarChart.tsx b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChart.tsx similarity index 96% rename from plugins/cost-insights/src/components/UnlabeledDataflowBarChart/UnlabeledDataflowBarChart.tsx rename to plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChart.tsx index 7b1f4e31ec..faf27ba04f 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowBarChart/UnlabeledDataflowBarChart.tsx +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChart.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { TooltipPayload } from 'recharts'; -import BarChart from '../BarChart'; +import { BarChart } from '../BarChart'; import { TooltipItemProps } from '../Tooltip'; import { BarChartData, @@ -69,5 +69,3 @@ export const UnlabeledDataflowBarChart = ({ /> ); }; - -export default UnlabeledDataflowBarChart; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.test.tsx b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.test.tsx similarity index 93% rename from plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.test.tsx rename to plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.test.tsx index 9ab4e90001..ab38ba8d44 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.test.tsx +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.test.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import UnlabeledDataflowBarChartLegend from './UnlabeledDataflowBarChartLegend'; +import { UnlabeledDataflowBarChartLegend } from './UnlabeledDataflowBarChartLegend'; import { renderInTestApp } from '@backstage/test-utils'; describe('', () => { diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.tsx b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.tsx similarity index 92% rename from plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.tsx rename to plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.tsx index 68caaed6d0..aac37c799d 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/UnlabeledDataflowBarChartLegend.tsx +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowBarChartLegend.tsx @@ -16,7 +16,7 @@ import React from 'react'; import { Box, useTheme } from '@material-ui/core'; -import LegendItem from '../LegendItem'; +import { LegendItem } from '../LegendItem'; import { currencyFormatter } from '../../utils/formatters'; import { CostInsightsTheme } from '../../types'; @@ -25,7 +25,7 @@ type UnlabeledDataflowBarChartLegendProps = { unlabeledCost: number; }; -const UnlabeledDataflowBarChartLegend = ({ +export const UnlabeledDataflowBarChartLegend = ({ unlabeledCost, labeledCost, }: UnlabeledDataflowBarChartLegendProps) => { @@ -55,5 +55,3 @@ const UnlabeledDataflowBarChartLegend = ({ ); }; - -export default UnlabeledDataflowBarChartLegend; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/index.ts b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/index.ts index 6f22abc062..11f7a6b6dd 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/index.ts +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './UnlabeledDataflowAlertCard'; +export { UnlabeledDataflowAlertCard } from './UnlabeledDataflowAlertCard'; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowBarChart/index.ts b/plugins/cost-insights/src/components/UnlabeledDataflowBarChart/index.ts deleted file mode 100644 index 6f475d5a80..0000000000 --- a/plugins/cost-insights/src/components/UnlabeledDataflowBarChart/index.ts +++ /dev/null @@ -1,17 +0,0 @@ -/* - * Copyright 2020 Spotify AB - * - * 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. - */ - -export { default } from './UnlabeledDataflowBarChart'; diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/index.ts b/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/index.ts deleted file mode 100644 index 470722e60a..0000000000 --- a/plugins/cost-insights/src/components/UnlabeledDataflowBarChartLegend/index.ts +++ /dev/null @@ -1,17 +0,0 @@ -/* - * Copyright 2020 Spotify AB - * - * 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. - */ - -export { default } from './UnlabeledDataflowBarChartLegend'; diff --git a/plugins/cost-insights/src/components/WhyCostsMatter/WhyCostsMatter.tsx b/plugins/cost-insights/src/components/WhyCostsMatter/WhyCostsMatter.tsx index 69de854b00..18b5307d86 100644 --- a/plugins/cost-insights/src/components/WhyCostsMatter/WhyCostsMatter.tsx +++ b/plugins/cost-insights/src/components/WhyCostsMatter/WhyCostsMatter.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { Typography, Box, Grid, Container, Divider } from '@material-ui/core'; -const WhyCostsMatter = () => { +export const WhyCostsMatter = () => { return ( @@ -73,5 +73,3 @@ const WhyCostsMatter = () => { ); }; - -export default WhyCostsMatter; diff --git a/plugins/cost-insights/src/components/WhyCostsMatter/index.ts b/plugins/cost-insights/src/components/WhyCostsMatter/index.ts index ed60207fde..ef847d20aa 100644 --- a/plugins/cost-insights/src/components/WhyCostsMatter/index.ts +++ b/plugins/cost-insights/src/components/WhyCostsMatter/index.ts @@ -14,4 +14,4 @@ * limitations under the License. */ -export { default } from './WhyCostsMatter'; +export { WhyCostsMatter } from './WhyCostsMatter'; diff --git a/plugins/cost-insights/src/components/index.ts b/plugins/cost-insights/src/components/index.ts index ba04830218..d28c256a0b 100644 --- a/plugins/cost-insights/src/components/index.ts +++ b/plugins/cost-insights/src/components/index.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -export { default as BarChart } from './BarChart'; -export { default as CostGrowth } from './CostGrowth'; -export { default as LegendItem } from './LegendItem'; +export { BarChart } from './BarChart'; +export { CostGrowth } from './CostGrowth'; +export { LegendItem } from './LegendItem'; export * from './Tooltip'; diff --git a/plugins/cost-insights/src/plugin.ts b/plugins/cost-insights/src/plugin.ts index d8d54ae71b..7006d5bf5d 100644 --- a/plugins/cost-insights/src/plugin.ts +++ b/plugins/cost-insights/src/plugin.ts @@ -15,9 +15,9 @@ */ import { createPlugin, createRouteRef } from '@backstage/core'; -import CostInsightsPage from './components/CostInsightsPage'; -import ProjectGrowthInstructionsPage from './components/ProjectGrowthInstructionsPage'; -import LabelDataflowInstructionsPage from './components/LabelDataflowInstructionsPage'; +import { CostInsightsPage } from './components/CostInsightsPage'; +import { ProjectGrowthInstructionsPage } from './components/ProjectGrowthInstructionsPage'; +import { LabelDataflowInstructionsPage } from './components/LabelDataflowInstructionsPage'; export const rootRouteRef = createRouteRef({ path: '/cost-insights', diff --git a/plugins/cost-insights/src/types/Alert.tsx b/plugins/cost-insights/src/types/Alert.tsx index 98214bed8f..4ed55a844c 100644 --- a/plugins/cost-insights/src/types/Alert.tsx +++ b/plugins/cost-insights/src/types/Alert.tsx @@ -17,8 +17,8 @@ import React from 'react'; import { ChangeStatistic } from './ChangeStatistic'; import { Maybe } from './Maybe'; -import UnlabeledDataflowAlertCard from '../components/UnlabeledDataflowAlertCard'; -import ProjectGrowthAlertCard from '../components/ProjectGrowthAlertCard'; +import { UnlabeledDataflowAlertCard } from '../components/UnlabeledDataflowAlertCard'; +import { ProjectGrowthAlertCard } from '../components/ProjectGrowthAlertCard'; /** * Generic alert type with required fields for display. The `element` field will be rendered in From ff0dc1be98984e642b49b4255764c25c09f1cd0d Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Mon, 26 Oct 2020 17:46:18 -0400 Subject: [PATCH 2/6] export root as page --- plugins/cost-insights/src/components/CostInsightsPage/index.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/plugins/cost-insights/src/components/CostInsightsPage/index.ts b/plugins/cost-insights/src/components/CostInsightsPage/index.ts index 07d7b76233..bf34a7dbe7 100644 --- a/plugins/cost-insights/src/components/CostInsightsPage/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsPage/index.ts @@ -14,5 +14,4 @@ * limitations under the License. */ -export { CostInsightsPage } from './CostInsightsPage'; -export { CostInsightsPageRoot } from './CostInsightsPageRoot'; +export { CostInsightsPageRoot as CostInsightsPage } from './CostInsightsPageRoot'; From 157063409b24d9fa44c78ee66ce9e35236e3f76a Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Mon, 26 Oct 2020 17:58:42 -0400 Subject: [PATCH 3/6] use wildcard form for re-exports --- plugins/cost-insights/src/components/BarChart/index.ts | 1 + plugins/cost-insights/src/components/CostGrowth/index.ts | 1 + .../cost-insights/src/components/LegendItem/LegendItem.tsx | 2 +- plugins/cost-insights/src/components/index.ts | 6 +++--- 4 files changed, 6 insertions(+), 4 deletions(-) diff --git a/plugins/cost-insights/src/components/BarChart/index.ts b/plugins/cost-insights/src/components/BarChart/index.ts index b2c6390388..4525bd24f3 100644 --- a/plugins/cost-insights/src/components/BarChart/index.ts +++ b/plugins/cost-insights/src/components/BarChart/index.ts @@ -15,3 +15,4 @@ */ export { BarChart } from './BarChart'; +export type { BarChartProps } from './BarChart'; diff --git a/plugins/cost-insights/src/components/CostGrowth/index.ts b/plugins/cost-insights/src/components/CostGrowth/index.ts index d4b1396586..da17ae8709 100644 --- a/plugins/cost-insights/src/components/CostGrowth/index.ts +++ b/plugins/cost-insights/src/components/CostGrowth/index.ts @@ -15,3 +15,4 @@ */ export { CostGrowth } from './CostGrowth'; +export type { CostGrowthProps } from './CostGrowth'; diff --git a/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx b/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx index cabc5f9c59..9424c50bf7 100644 --- a/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx +++ b/plugins/cost-insights/src/components/LegendItem/LegendItem.tsx @@ -20,7 +20,7 @@ import LensIcon from '@material-ui/icons/Lens'; import HelpOutlineOutlinedIcon from '@material-ui/icons/HelpOutlineOutlined'; import { useCostGrowthLegendStyles } from '../../utils/styles'; -type LegendItemProps = { +export type LegendItemProps = { title: string; tooltipText?: string; markerColor?: string; diff --git a/plugins/cost-insights/src/components/index.ts b/plugins/cost-insights/src/components/index.ts index d28c256a0b..5b918144d9 100644 --- a/plugins/cost-insights/src/components/index.ts +++ b/plugins/cost-insights/src/components/index.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -export { BarChart } from './BarChart'; -export { CostGrowth } from './CostGrowth'; -export { LegendItem } from './LegendItem'; +export * from './BarChart'; +export * from './CostGrowth'; +export * from './LegendItem'; export * from './Tooltip'; From 023d514206b00c163746b321c1d019db0ffda707 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Mon, 26 Oct 2020 18:04:11 -0400 Subject: [PATCH 4/6] changeset --- .changeset/swift-carrots-bake.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/swift-carrots-bake.md diff --git a/.changeset/swift-carrots-bake.md b/.changeset/swift-carrots-bake.md new file mode 100644 index 0000000000..bc378ad247 --- /dev/null +++ b/.changeset/swift-carrots-bake.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-cost-insights': patch +--- + +prefer named exports From 60693368306d182536cf17e1d16d3364b8df3cb4 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Mon, 26 Oct 2020 18:10:47 -0400 Subject: [PATCH 5/6] formatting --- .../AlertInsights/AlertInsightsHeader.tsx | 5 ++- .../AlertInsights/AlertInsightsSection.tsx | 5 ++- .../src/components/BarChart/BarChartSteps.tsx | 11 +++-- .../components/CostGrowth/CostGrowth.test.tsx | 8 ++-- .../components/CostInsightsHeader/index.ts | 5 ++- .../CostInsightsNavigation.tsx | 12 +++--- .../CostOverviewCard/CostOverviewHeader.tsx | 40 +++++++++---------- .../components/MetricSelect/MetricSelect.tsx | 6 ++- .../components/PeriodSelect/PeriodSelect.tsx | 6 ++- .../ProductInsights/ProductInsights.tsx | 2 +- .../ProjectGrowthAlertCard.tsx | 5 ++- .../ProjectSelect/ProjectSelect.tsx | 6 ++- .../UnlabeledDataflowAlertCard.test.tsx | 2 +- .../UnlabeledDataflowAlertCard.tsx | 4 +- 14 files changed, 74 insertions(+), 43 deletions(-) diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx index 7a65010abf..b58f6973ae 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsHeader.tsx @@ -25,7 +25,10 @@ type AlertInsightsHeaderProps = { subtitle: string; }; -export const AlertInsightsHeader = ({ title, subtitle }: AlertInsightsHeaderProps) => { +export const AlertInsightsHeader = ({ + title, + subtitle, +}: AlertInsightsHeaderProps) => { const classes = useStyles(); const { ScrollAnchor } = useScroll(DefaultNavigation.AlertInsightsHeader); return ( diff --git a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx index fe5425a937..426e943092 100644 --- a/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx +++ b/plugins/cost-insights/src/components/AlertInsights/AlertInsightsSection.tsx @@ -23,7 +23,10 @@ type AlertInsightsSectionProps = { number: number; }; -export const AlertInsightsSection = ({ alert, number }: AlertInsightsSectionProps) => { +export const AlertInsightsSection = ({ + alert, + number, +}: AlertInsightsSectionProps) => { return ( void; }; -export const BarChartSteps = ({ steps, activeStep, onClick }: BarChartSteps) => { +export const BarChartSteps = ({ + steps, + activeStep, + onClick, +}: BarChartSteps) => { const classes = useStyles(); const handleOnClick = (index: number) => ( event: React.MouseEvent, @@ -39,8 +43,9 @@ export const BarChartSteps = ({ steps, activeStep, onClick }: BarChartSteps) =>
))} diff --git a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx index 3a49ba4626..ed81f657c5 100644 --- a/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx +++ b/plugins/cost-insights/src/components/CostGrowth/CostGrowth.test.tsx @@ -41,10 +41,10 @@ const MockContext = ({ currency: Currency; engineerCost: number; }>) => ( - - {children} - - ); + + {children} + +); describe.each` engineerCost | ratio | amount | expected diff --git a/plugins/cost-insights/src/components/CostInsightsHeader/index.ts b/plugins/cost-insights/src/components/CostInsightsHeader/index.ts index f5099aa19d..f6eebef604 100644 --- a/plugins/cost-insights/src/components/CostInsightsHeader/index.ts +++ b/plugins/cost-insights/src/components/CostInsightsHeader/index.ts @@ -14,4 +14,7 @@ * limitations under the License. */ -export { CostInsightsHeader, CostInsightsHeaderNoGroups } from './CostInsightsHeader'; +export { + CostInsightsHeader, + CostInsightsHeaderNoGroups, +} from './CostInsightsHeader'; diff --git a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx index 62482c3323..f190fa88bb 100644 --- a/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx +++ b/plugins/cost-insights/src/components/CostInsightsNavigation/CostInsightsNavigation.tsx @@ -36,7 +36,9 @@ type CostInsightsNavigationProps = { alerts: number; }; -export const CostInsightsNavigation = ({ alerts }: CostInsightsNavigationProps) => { +export const CostInsightsNavigation = ({ + alerts, +}: CostInsightsNavigationProps) => { const classes = useNavigationStyles(); const { products, icons } = useConfig(); @@ -64,10 +66,10 @@ export const CostInsightsNavigation = ({ alerts }: CostInsightsNavigationProps) })} ) : ( - React.cloneElement(item.icon, { - className: classes.navigationIcon, - }) - ) + React.cloneElement(item.icon, { + className: classes.navigationIcon, + }) + ) } title={item.title} /> diff --git a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx index c01eabfa53..e46b0c3a78 100644 --- a/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx +++ b/plugins/cost-insights/src/components/CostOverviewCard/CostOverviewHeader.tsx @@ -26,25 +26,25 @@ export const CostOverviewHeader = ({ subtitle, children, }: PropsWithChildren) => ( - - - - {title} + + + + {title} + + {!!subtitle && ( + + {subtitle} - {!!subtitle && ( - - {subtitle} - - )} - - - {children} - + )} - ); + + {children} + + +); diff --git a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx index f91070271f..a8197fd7e9 100644 --- a/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx +++ b/plugins/cost-insights/src/components/MetricSelect/MetricSelect.tsx @@ -25,7 +25,11 @@ export type MetricSelectProps = { onSelect: (metric: Maybe) => void; }; -export const MetricSelect = ({ metric, metrics, onSelect }: MetricSelectProps) => { +export const MetricSelect = ({ + metric, + metrics, + onSelect, +}: MetricSelectProps) => { const classes = useStyles(); function onChange(e: React.ChangeEvent<{ value: unknown }>) { diff --git a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx index 0088830471..07365c32eb 100644 --- a/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx +++ b/plugins/cost-insights/src/components/PeriodSelect/PeriodSelect.tsx @@ -58,7 +58,11 @@ type PeriodSelectProps = { options?: PeriodOption[]; }; -export const PeriodSelect = ({ duration, onSelect, options }: PeriodSelectProps) => { +export const PeriodSelect = ({ + duration, + onSelect, + options, +}: PeriodSelectProps) => { const classes = useStyles(); const lastCompleteBillingDate = useLastCompleteBillingDate(); const optionsOrDefault = diff --git a/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx b/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx index 7420c8d82c..16146cb045 100644 --- a/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx +++ b/plugins/cost-insights/src/components/ProductInsights/ProductInsights.tsx @@ -19,7 +19,7 @@ import { Box, Typography, Grid } from '@material-ui/core'; import { ProductInsightsCard } from '../ProductInsightsCard'; import { useConfig } from '../../hooks'; -export const ProductInsights = ({ }) => { +export const ProductInsights = ({}) => { const config = useConfig(); return ( <> diff --git a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx index 18f7fa151d..4311bcc1bf 100644 --- a/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx +++ b/plugins/cost-insights/src/components/ProjectGrowthAlertCard/ProjectGrowthAlertCard.tsx @@ -31,8 +31,9 @@ export const ProjectGrowthAlertCard = ({ alert }: ProjectGrowthAlertProps) => { const [costStart, costEnd] = alert.aggregation; const subheader = ` - ${alert.products.length} ${pluralOf(alert.products.length, 'product')}${alert.products.length > 1 ? ', sorted by cost' : '' - }`; + ${alert.products.length} ${pluralOf(alert.products.length, 'product')}${ + alert.products.length > 1 ? ', sorted by cost' : '' + }`; const previousName = moment(alert.periodStart, 'YYYY-[Q]Q').format( '[Q]Q YYYY', ); diff --git a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx index 29169d1f5f..ee4641a4eb 100644 --- a/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx +++ b/plugins/cost-insights/src/components/ProjectSelect/ProjectSelect.tsx @@ -24,7 +24,11 @@ type ProjectSelectProps = { onSelect: (project: Maybe) => void; }; -export const ProjectSelect = ({ project, projects, onSelect }: ProjectSelectProps) => { +export const ProjectSelect = ({ + project, + projects, + onSelect, +}: ProjectSelectProps) => { const classes = useStyles(); const projectOptions = [{ id: 'all' } as Project, ...projects] diff --git a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx index 6edd4ed637..df38c78a03 100644 --- a/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx +++ b/plugins/cost-insights/src/components/UnlabeledDataflowAlertCard/UnlabeledDataflowAlertCard.test.tsx @@ -44,7 +44,7 @@ describe('', () => { it('renders the correct subheader for multiple projects', async () => { const subheader = new RegExp( `Showing costs from ${MockUnlabeledDataflowAlertMultipleProjects.projects.length} ` + - 'projects with unlabeled Dataflow jobs in the last 30 days.', + 'projects with unlabeled Dataflow jobs in the last 30 days.', ); const rendered = await renderInTestApp( { +export const UnlabeledDataflowAlertCard = ({ + alert, +}: UnlabeledDataflowAlertProps) => { const projects = pluralOf(alert.projects.length, 'project'); const subheader = ` Showing costs from ${alert.projects.length} ${projects} with unlabeled Dataflow jobs in the last 30 days. From fd8384d7e6333455192a6b33880cc148796c0c51 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Tue, 27 Oct 2020 13:09:06 -0400 Subject: [PATCH 6/6] use cost insights changeset prefix --- ...{swift-carrots-bake.md => cost-insights-swift-carrots-bake.md} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename .changeset/{swift-carrots-bake.md => cost-insights-swift-carrots-bake.md} (100%) diff --git a/.changeset/swift-carrots-bake.md b/.changeset/cost-insights-swift-carrots-bake.md similarity index 100% rename from .changeset/swift-carrots-bake.md rename to .changeset/cost-insights-swift-carrots-bake.md