From cf3c5203c08b21b12108b917a1725a7829d63109 Mon Sep 17 00:00:00 2001 From: stanislavh Date: Tue, 23 Apr 2024 14:12:32 +0200 Subject: SONAR-22049 Align RatingLabel type --- .../design-system/src/components/Card.tsx | 77 --------------- .../src/components/MetricsRatingBadge.tsx | 107 --------------------- .../src/components/__tests__/Card-test.tsx | 45 --------- .../__tests__/MetricsRatingBadge-test.tsx | 38 -------- .../design-system/src/components/index.ts | 2 - server/sonar-web/design-system/src/index.ts | 1 + .../src/sonar-aligned/components/Card.tsx | 77 +++++++++++++++ .../components/MetricsRatingBadge.tsx | 107 +++++++++++++++++++++ .../components/__tests__/Card-test.tsx | 45 +++++++++ .../__tests__/MetricsRatingBadge-test.tsx | 38 ++++++++ .../src/sonar-aligned/components/index.ts | 22 +++++ .../design-system/src/sonar-aligned/index.ts | 22 +++++ .../design-system/src/sonar-aligned/types/index.ts | 21 ++++ .../src/sonar-aligned/types/measures.ts | 29 ++++++ .../sonar-web/design-system/src/types/measures.ts | 10 -- server/sonar-web/design-system/tsconfig.json | 3 +- .../js/apps/code/components/ComponentMeasure.tsx | 4 +- .../components/MeasureHeader.tsx | 4 +- .../component-measures/drilldown/MeasureCell.tsx | 4 +- .../sidebar/SubnavigationMeasureValue.tsx | 4 +- .../project-card/ProjectCardMeasures.tsx | 4 +- .../main/js/apps/projects/filters/RatingFacet.tsx | 4 +- .../apps/projects/filters/SecurityReviewFilter.tsx | 4 +- .../src/main/js/components/measure/Measure.tsx | 4 +- .../js/components/measure/MeasureIndicator.tsx | 17 ++-- 25 files changed, 387 insertions(+), 306 deletions(-) delete mode 100644 server/sonar-web/design-system/src/components/Card.tsx delete mode 100644 server/sonar-web/design-system/src/components/MetricsRatingBadge.tsx delete mode 100644 server/sonar-web/design-system/src/components/__tests__/Card-test.tsx delete mode 100644 server/sonar-web/design-system/src/components/__tests__/MetricsRatingBadge-test.tsx create mode 100644 server/sonar-web/design-system/src/sonar-aligned/components/Card.tsx create mode 100644 server/sonar-web/design-system/src/sonar-aligned/components/MetricsRatingBadge.tsx create mode 100644 server/sonar-web/design-system/src/sonar-aligned/components/__tests__/Card-test.tsx create mode 100644 server/sonar-web/design-system/src/sonar-aligned/components/__tests__/MetricsRatingBadge-test.tsx create mode 100644 server/sonar-web/design-system/src/sonar-aligned/components/index.ts create mode 100644 server/sonar-web/design-system/src/sonar-aligned/index.ts create mode 100644 server/sonar-web/design-system/src/sonar-aligned/types/index.ts create mode 100644 server/sonar-web/design-system/src/sonar-aligned/types/measures.ts (limited to 'server') diff --git a/server/sonar-web/design-system/src/components/Card.tsx b/server/sonar-web/design-system/src/components/Card.tsx deleted file mode 100644 index ef9c63f3c92..00000000000 --- a/server/sonar-web/design-system/src/components/Card.tsx +++ /dev/null @@ -1,77 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import styled from '@emotion/styled'; -import * as React from 'react'; -import tw from 'twin.macro'; -import { themeBorder, themeColor } from '../helpers/theme'; -import { BasicSeparator } from './Separator'; - -interface CardProps extends React.HTMLAttributes { - children: React.ReactNode; -} - -export function Card(props: Readonly) { - const { children, ...rest } = props; - - return {children}; -} - -export function GreyCard(props: Readonly) { - const { children, ...rest } = props; - - return {children}; -} - -export function LightGreyCard(props: Readonly) { - const { children, ...rest } = props; - - return {children}; -} - -export function LightGreyCardTitle({ children }: Readonly) { - return ( - <> -
- {children} -
- - - ); -} - -export const CardWithPrimaryBackground = styled(Card)` - background-color: ${themeColor('backgroundPrimary')}; -`; - -const CardStyled = styled.div` - background-color: ${themeColor('backgroundSecondary')}; - border: ${themeBorder('default', 'projectCardBorder')}; - - ${tw`sw-p-6`}; - ${tw`sw-rounded-1`}; -`; - -const LightGreyCardStyled = styled(CardStyled)` - border: ${themeBorder('default')}; -`; - -const GreyCardStyled = styled(CardStyled)` - border: ${themeBorder('default', 'almCardBorder')}; -`; diff --git a/server/sonar-web/design-system/src/components/MetricsRatingBadge.tsx b/server/sonar-web/design-system/src/components/MetricsRatingBadge.tsx deleted file mode 100644 index d82e9a86843..00000000000 --- a/server/sonar-web/design-system/src/components/MetricsRatingBadge.tsx +++ /dev/null @@ -1,107 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import styled from '@emotion/styled'; -import tw from 'twin.macro'; -import { getProp, themeColor, themeContrast } from '../helpers/theme'; -import { MetricsLabel } from '../types/measures'; - -type sizeType = keyof typeof SIZE_MAPPING; -interface Props extends React.AriaAttributes { - className?: string; - label: string; - rating?: MetricsLabel; - size?: sizeType; -} - -const SIZE_MAPPING = { - xs: '1rem', - sm: '1.5rem', - md: '2rem', - lg: '2.8rem', - xl: '4rem', -}; - -export function MetricsRatingBadge({ - className, - size = 'sm', - label, - rating, - ...ariaAttrs -}: Readonly) { - if (!rating) { - return ( - - — - - ); - } - return ( - - {rating} - - ); -} - -const StyledNoRatingBadge = styled.div<{ size: string }>` - display: inline-flex; - align-items: center; - justify-content: center; - - width: ${getProp('size')}; - height: ${getProp('size')}; -`; - -const getFontSize = (size: string) => { - switch (size) { - case '2rem': - return '0.875rem'; - case '4rem': - return '1.5rem'; - default: - return '0.75rem'; - } -}; - -const MetricsRatingBadgeStyled = styled.div<{ rating: MetricsLabel; size: string }>` - width: ${getProp('size')}; - height: ${getProp('size')}; - color: ${({ rating }) => themeContrast(`rating.${rating}`)}; - font-size: ${({ size }) => getFontSize(size)}; - background-color: ${({ rating }) => themeColor(`rating.${rating}`)}; - user-select: none; - - display: inline-flex; - align-items: center; - justify-content: center; - - ${tw`sw-rounded-pill`}; - ${tw`sw-font-semibold`}; -`; diff --git a/server/sonar-web/design-system/src/components/__tests__/Card-test.tsx b/server/sonar-web/design-system/src/components/__tests__/Card-test.tsx deleted file mode 100644 index f6d02f77f8d..00000000000 --- a/server/sonar-web/design-system/src/components/__tests__/Card-test.tsx +++ /dev/null @@ -1,45 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import { screen } from '@testing-library/react'; -import { render } from '../../helpers/testUtils'; -import { Card, GreyCard, LightGreyCard } from '../Card'; - -it('renders card correctly', () => { - render(Hello); - const cardContent = screen.getByText('Hello'); - expect(cardContent).toHaveStyle({ - border: '1px solid rgb(225,230,243)', - 'background-color': 'rgb(255,255,255)', - }); -}); - -it.each([Card, GreyCard, LightGreyCard])( - 'renders %p correctly with classNames', - (CardComponent) => { - render( - - Hello - , - ); - const cardContent = screen.getByText('Hello'); - expect(cardContent).toHaveClass('sw-bg-black sw-border-8'); - expect(cardContent).toHaveAttribute('role', 'tabpanel'); - }, -); diff --git a/server/sonar-web/design-system/src/components/__tests__/MetricsRatingBadge-test.tsx b/server/sonar-web/design-system/src/components/__tests__/MetricsRatingBadge-test.tsx deleted file mode 100644 index 31e15fedbed..00000000000 --- a/server/sonar-web/design-system/src/components/__tests__/MetricsRatingBadge-test.tsx +++ /dev/null @@ -1,38 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import { screen } from '@testing-library/react'; -import { render } from '../../helpers/testUtils'; -import { FCProps } from '../../types/misc'; - -import { MetricsRatingBadge } from '../MetricsRatingBadge'; - -it('should display RatingIndicator', () => { - setupWithProps(); - expect(screen.getByLabelText('New label')).toBeInTheDocument(); -}); - -it('should display RatingIndicator with value', () => { - setupWithProps({ rating: 'A' }); - expect(screen.getByText('A')).toBeInTheDocument(); -}); - -function setupWithProps(props: Partial> = {}) { - return render(); -} diff --git a/server/sonar-web/design-system/src/components/index.ts b/server/sonar-web/design-system/src/components/index.ts index b5b2e73515a..ae2932330ec 100644 --- a/server/sonar-web/design-system/src/components/index.ts +++ b/server/sonar-web/design-system/src/components/index.ts @@ -25,7 +25,6 @@ export { BarChart } from './BarChart'; export * from './BorderlessAccordion'; export { Breadcrumbs } from './Breadcrumbs'; export * from './BubbleChart'; -export * from './Card'; export * from './CodeSnippet'; export * from './CodeSyntaxHighlighter'; export * from './ColorsLegend'; @@ -57,7 +56,6 @@ export * from './LocationMarker'; export * from './MainAppBar'; export * from './MainMenu'; export * from './MainMenuItem'; -export * from './MetricsRatingBadge'; export * from './MultiSelector'; export * from './NavBarTabs'; export * from './NewCodeLegend'; diff --git a/server/sonar-web/design-system/src/index.ts b/server/sonar-web/design-system/src/index.ts index 992d51242bf..3bac299b5e3 100644 --- a/server/sonar-web/design-system/src/index.ts +++ b/server/sonar-web/design-system/src/index.ts @@ -19,5 +19,6 @@ */ export * from './components'; export * from './helpers'; +export * from './sonar-aligned'; export * from './theme'; export * from './types'; diff --git a/server/sonar-web/design-system/src/sonar-aligned/components/Card.tsx b/server/sonar-web/design-system/src/sonar-aligned/components/Card.tsx new file mode 100644 index 00000000000..a8f7c8ce929 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/components/Card.tsx @@ -0,0 +1,77 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +import styled from '@emotion/styled'; +import * as React from 'react'; +import tw from 'twin.macro'; +import { BasicSeparator } from '../../components/Separator'; +import { themeBorder, themeColor } from '../../helpers/theme'; + +interface CardProps extends React.HTMLAttributes { + children: React.ReactNode; +} + +export function Card(props: Readonly) { + const { children, ...rest } = props; + + return {children}; +} + +export function GreyCard(props: Readonly) { + const { children, ...rest } = props; + + return {children}; +} + +export function LightGreyCard(props: Readonly) { + const { children, ...rest } = props; + + return {children}; +} + +export function LightGreyCardTitle({ children }: Readonly) { + return ( + <> +
+ {children} +
+ + + ); +} + +export const CardWithPrimaryBackground = styled(Card)` + background-color: ${themeColor('backgroundPrimary')}; +`; + +const CardStyled = styled.div` + background-color: ${themeColor('backgroundSecondary')}; + border: ${themeBorder('default', 'projectCardBorder')}; + + ${tw`sw-p-6`}; + ${tw`sw-rounded-1`}; +`; + +const LightGreyCardStyled = styled(CardStyled)` + border: ${themeBorder('default')}; +`; + +const GreyCardStyled = styled(CardStyled)` + border: ${themeBorder('default', 'almCardBorder')}; +`; diff --git a/server/sonar-web/design-system/src/sonar-aligned/components/MetricsRatingBadge.tsx b/server/sonar-web/design-system/src/sonar-aligned/components/MetricsRatingBadge.tsx new file mode 100644 index 00000000000..9bdae72f604 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/components/MetricsRatingBadge.tsx @@ -0,0 +1,107 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +import styled from '@emotion/styled'; +import tw from 'twin.macro'; +import { getProp, themeColor, themeContrast } from '../../helpers/theme'; +import { RatingLabel } from '../types/measures'; + +type sizeType = keyof typeof SIZE_MAPPING; +interface Props extends React.AriaAttributes { + className?: string; + label?: string; + rating?: RatingLabel; + size?: sizeType; +} + +const SIZE_MAPPING = { + xs: '1rem', + sm: '1.5rem', + md: '2rem', + lg: '2.8rem', + xl: '4rem', +}; + +export function MetricsRatingBadge({ + className, + size = 'sm', + label, + rating, + ...ariaAttrs +}: Readonly) { + if (!rating) { + return ( + + — + + ); + } + return ( + + {rating} + + ); +} + +const StyledNoRatingBadge = styled.div<{ size: string }>` + display: inline-flex; + align-items: center; + justify-content: center; + + width: ${getProp('size')}; + height: ${getProp('size')}; +`; + +const getFontSize = (size: string) => { + switch (size) { + case '2rem': + return '0.875rem'; + case '4rem': + return '1.5rem'; + default: + return '0.75rem'; + } +}; + +const MetricsRatingBadgeStyled = styled.div<{ rating: RatingLabel; size: string }>` + width: ${getProp('size')}; + height: ${getProp('size')}; + color: ${({ rating }) => themeContrast(`rating.${rating}`)}; + font-size: ${({ size }) => getFontSize(size)}; + background-color: ${({ rating }) => themeColor(`rating.${rating}`)}; + user-select: none; + + display: inline-flex; + align-items: center; + justify-content: center; + + ${tw`sw-rounded-pill`}; + ${tw`sw-font-semibold`}; +`; diff --git a/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/Card-test.tsx b/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/Card-test.tsx new file mode 100644 index 00000000000..817af9d4da6 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/Card-test.tsx @@ -0,0 +1,45 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +import { screen } from '@testing-library/react'; +import { render } from '../../../helpers/testUtils'; +import { Card, GreyCard, LightGreyCard } from '../Card'; + +it('renders card correctly', () => { + render(Hello); + const cardContent = screen.getByText('Hello'); + expect(cardContent).toHaveStyle({ + border: '1px solid rgb(225,230,243)', + 'background-color': 'rgb(255,255,255)', + }); +}); + +it.each([Card, GreyCard, LightGreyCard])( + 'renders %p correctly with classNames', + (CardComponent) => { + render( + + Hello + , + ); + const cardContent = screen.getByText('Hello'); + expect(cardContent).toHaveClass('sw-bg-black sw-border-8'); + expect(cardContent).toHaveAttribute('role', 'tabpanel'); + }, +); diff --git a/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/MetricsRatingBadge-test.tsx b/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/MetricsRatingBadge-test.tsx new file mode 100644 index 00000000000..8342ab1ca6c --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/components/__tests__/MetricsRatingBadge-test.tsx @@ -0,0 +1,38 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +import { screen } from '@testing-library/react'; +import { render } from '../../../helpers/testUtils'; +import { FCProps } from '../../../types/misc'; + +import { MetricsRatingBadge } from '../MetricsRatingBadge'; + +it('should display RatingIndicator', () => { + setupWithProps(); + expect(screen.getByLabelText('New label')).toBeInTheDocument(); +}); + +it('should display RatingIndicator with value', () => { + setupWithProps({ rating: 'A' }); + expect(screen.getByText('A')).toBeInTheDocument(); +}); + +function setupWithProps(props: Partial> = {}) { + return render(); +} diff --git a/server/sonar-web/design-system/src/sonar-aligned/components/index.ts b/server/sonar-web/design-system/src/sonar-aligned/components/index.ts new file mode 100644 index 00000000000..4aff4e3e703 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/components/index.ts @@ -0,0 +1,22 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ + +export * from './Card'; +export * from './MetricsRatingBadge'; diff --git a/server/sonar-web/design-system/src/sonar-aligned/index.ts b/server/sonar-web/design-system/src/sonar-aligned/index.ts new file mode 100644 index 00000000000..48fc39c2122 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/index.ts @@ -0,0 +1,22 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ + +export * from './components'; +export * from './types'; diff --git a/server/sonar-web/design-system/src/sonar-aligned/types/index.ts b/server/sonar-web/design-system/src/sonar-aligned/types/index.ts new file mode 100644 index 00000000000..076ba52f860 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/types/index.ts @@ -0,0 +1,21 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ + +export * from './measures'; diff --git a/server/sonar-web/design-system/src/sonar-aligned/types/measures.ts b/server/sonar-web/design-system/src/sonar-aligned/types/measures.ts new file mode 100644 index 00000000000..b7e402a65f7 --- /dev/null +++ b/server/sonar-web/design-system/src/sonar-aligned/types/measures.ts @@ -0,0 +1,29 @@ +/* + * SonarQube + * Copyright (C) 2009-2024 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ + +export enum RatingEnum { + A = 'A', + B = 'B', + C = 'C', + D = 'D', + E = 'E', +} + +export type RatingLabel = keyof typeof RatingEnum; diff --git a/server/sonar-web/design-system/src/types/measures.ts b/server/sonar-web/design-system/src/types/measures.ts index a118f888231..71ee1b988de 100644 --- a/server/sonar-web/design-system/src/types/measures.ts +++ b/server/sonar-web/design-system/src/types/measures.ts @@ -28,16 +28,6 @@ export enum DuplicationEnum { export type DuplicationLabel = keyof typeof DuplicationEnum; -export enum MetricsEnum { - A = 'A', - B = 'B', - C = 'C', - D = 'D', - E = 'E', -} - -export type MetricsLabel = keyof typeof MetricsEnum; - export enum SizeEnum { XS = 'XS', S = 'S', diff --git a/server/sonar-web/design-system/tsconfig.json b/server/sonar-web/design-system/tsconfig.json index 9563ae0ec9f..22b2e4e8bec 100644 --- a/server/sonar-web/design-system/tsconfig.json +++ b/server/sonar-web/design-system/tsconfig.json @@ -16,7 +16,8 @@ "~helpers/*": ["src/helpers/*"], "~icons/*": ["src/icons/*"], "~types/*": ["src/types/*"], - "~utils/*": ["src/utils/*"] + "~utils/*": ["src/utils/*"], + "~sonar-aligned/*": ["src/sonar-aligned/*"] }, "resolveJsonModule": true, "skipLibCheck": true diff --git a/server/sonar-web/src/main/js/apps/code/components/ComponentMeasure.tsx b/server/sonar-web/src/main/js/apps/code/components/ComponentMeasure.tsx index d3b36317eb3..b4b21a0fab7 100644 --- a/server/sonar-web/src/main/js/apps/code/components/ComponentMeasure.tsx +++ b/server/sonar-web/src/main/js/apps/code/components/ComponentMeasure.tsx @@ -19,11 +19,11 @@ */ import { ContentCell, - MetricsEnum, MetricsRatingBadge, NumericalCell, QualityGateIndicator, RatingCell, + RatingEnum, } from 'design-system'; import * as React from 'react'; import Measure from '../../../components/measure/Measure'; @@ -96,7 +96,7 @@ export default function ComponentMeasure(props: Props) { ); diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureHeader.tsx b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureHeader.tsx index a6790e2af7a..4fd76d7d88b 100644 --- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureHeader.tsx +++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureHeader.tsx @@ -19,7 +19,7 @@ */ import { LinkStandalone } from '@sonarsource/echoes-react'; import classNames from 'classnames'; -import { MetricsLabel, MetricsRatingBadge } from 'design-system'; +import { MetricsRatingBadge, RatingLabel } from 'design-system'; import * as React from 'react'; import LanguageDistribution from '../../../components/charts/LanguageDistribution'; import Tooltip from '../../../components/controls/Tooltip'; @@ -78,7 +78,7 @@ export default function MeasureHeader(props: Readonly) { ) : translate('metric.no_rating') } - rating={formatMeasure(measureValue, MetricType.Rating) as MetricsLabel} + rating={formatMeasure(measureValue, MetricType.Rating) as RatingLabel} /> } /> diff --git a/server/sonar-web/src/main/js/apps/component-measures/drilldown/MeasureCell.tsx b/server/sonar-web/src/main/js/apps/component-measures/drilldown/MeasureCell.tsx index 56a1ac29744..e4354dbf8c9 100644 --- a/server/sonar-web/src/main/js/apps/component-measures/drilldown/MeasureCell.tsx +++ b/server/sonar-web/src/main/js/apps/component-measures/drilldown/MeasureCell.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { MetricsLabel, MetricsRatingBadge, NumericalCell } from 'design-system'; +import { MetricsRatingBadge, NumericalCell, RatingLabel } from 'design-system'; import * as React from 'react'; import Measure from '../../../components/measure/Measure'; import { translate, translateWithParameters } from '../../../helpers/l10n'; @@ -55,7 +55,7 @@ export default function MeasureCell({ component, measure, metric }: Props) { ) : translate('metric.no_rating') } - rating={formatMeasure(value, MetricType.Rating) as MetricsLabel} + rating={formatMeasure(value, MetricType.Rating) as RatingLabel} /> } /> diff --git a/server/sonar-web/src/main/js/apps/component-measures/sidebar/SubnavigationMeasureValue.tsx b/server/sonar-web/src/main/js/apps/component-measures/sidebar/SubnavigationMeasureValue.tsx index 7088bd7e639..ab344f0ff6b 100644 --- a/server/sonar-web/src/main/js/apps/component-measures/sidebar/SubnavigationMeasureValue.tsx +++ b/server/sonar-web/src/main/js/apps/component-measures/sidebar/SubnavigationMeasureValue.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { MetricsLabel, MetricsRatingBadge, Note } from 'design-system'; +import { MetricsRatingBadge, Note, RatingLabel } from 'design-system'; import React from 'react'; import Measure from '../../../components/measure/Measure'; import { translate, translateWithParameters } from '../../../helpers/l10n'; @@ -48,7 +48,7 @@ export default function SubnavigationMeasureValue({ measure }: Readonly) ? translateWithParameters('metric.has_rating_X', formatted) : translate('metric.no_rating') } - rating={formatted as MetricsLabel} + rating={formatted as RatingLabel} /> } metricKey={measure.metric.key} diff --git a/server/sonar-web/src/main/js/apps/projects/components/project-card/ProjectCardMeasures.tsx b/server/sonar-web/src/main/js/apps/projects/components/project-card/ProjectCardMeasures.tsx index 2f9afad7e32..352418538c0 100644 --- a/server/sonar-web/src/main/js/apps/projects/components/project-card/ProjectCardMeasures.tsx +++ b/server/sonar-web/src/main/js/apps/projects/components/project-card/ProjectCardMeasures.tsx @@ -20,10 +20,10 @@ import { CoverageIndicator, DuplicationsIndicator, - MetricsLabel, MetricsRatingBadge, Note, PageContentFontWrapper, + RatingLabel, } from 'design-system'; import * as React from 'react'; import Measure from '../../../../components/measure/Measure'; @@ -178,7 +178,7 @@ function renderRatings(props: ProjectCardMeasuresProps) { return ( - + + ); } diff --git a/server/sonar-web/src/main/js/apps/projects/filters/SecurityReviewFilter.tsx b/server/sonar-web/src/main/js/apps/projects/filters/SecurityReviewFilter.tsx index 1a99368fcee..9764cea8aa6 100644 --- a/server/sonar-web/src/main/js/apps/projects/filters/SecurityReviewFilter.tsx +++ b/server/sonar-web/src/main/js/apps/projects/filters/SecurityReviewFilter.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { MetricsEnum, MetricsRatingBadge } from 'design-system'; +import { MetricsRatingBadge, RatingEnum } from 'design-system'; import * as React from 'react'; import { translate, translateWithParameters } from '../../../helpers/l10n'; import { formatMeasure } from '../../../helpers/measures'; @@ -84,7 +84,7 @@ function renderOption(option: number) {
{labels[option]} diff --git a/server/sonar-web/src/main/js/components/measure/Measure.tsx b/server/sonar-web/src/main/js/components/measure/Measure.tsx index c453e58d898..0e0f1f0e140 100644 --- a/server/sonar-web/src/main/js/components/measure/Measure.tsx +++ b/server/sonar-web/src/main/js/components/measure/Measure.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { MetricsLabel, MetricsRatingBadge, QualityGateIndicator } from 'design-system'; +import { MetricsRatingBadge, QualityGateIndicator, RatingLabel } from 'design-system'; import * as React from 'react'; import Tooltip from '../../components/controls/Tooltip'; import { translate, translateWithParameters } from '../../helpers/l10n'; @@ -83,7 +83,7 @@ export default function Measure({ ? translateWithParameters('metric.has_rating_X', formatMeasure(value, MetricType.Rating)) : translate('metric.no_rating') } - rating={formatMeasure(value, MetricType.Rating) as MetricsLabel} + rating={formatMeasure(value, MetricType.Rating) as RatingLabel} /> ); diff --git a/server/sonar-web/src/main/js/components/measure/MeasureIndicator.tsx b/server/sonar-web/src/main/js/components/measure/MeasureIndicator.tsx index cb8bbe5b072..9889e139348 100644 --- a/server/sonar-web/src/main/js/components/measure/MeasureIndicator.tsx +++ b/server/sonar-web/src/main/js/components/measure/MeasureIndicator.tsx @@ -17,7 +17,12 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { CoverageIndicator, DuplicationsIndicator, MetricsRatingBadge } from 'design-system'; +import { + CoverageIndicator, + DuplicationsIndicator, + MetricsRatingBadge, + RatingEnum, +} from 'design-system'; import * as React from 'react'; import { formatMeasure } from '../../helpers/measures'; import { MetricKey, MetricType } from '../../types/metrics'; @@ -33,14 +38,6 @@ interface Props { value: string | undefined; } -enum MetricsEnum { - A = 'A', - B = 'B', - C = 'C', - D = 'D', - E = 'E', -} - export default function MeasureIndicator(props: Props) { const { className, metricKey, metricType, value } = props; @@ -66,7 +63,7 @@ export default function MeasureIndicator(props: Props) { const ratingFormatted = formatMeasure(value, MetricType.Rating); const ratingComponent = ( - + ); return ; -- cgit v1.2.3