]> source.dussan.org Git - sonarqube.git/commitdiff
SONAR-19023 Add icons needed for the project overview page to design-system
authorDavid Cho-Lerat <david.cho-lerat@sonarsource.com>
Tue, 11 Apr 2023 10:35:46 +0000 (12:35 +0200)
committersonartech <sonartech@sonarsource.com>
Wed, 12 Apr 2023 20:03:18 +0000 (20:03 +0000)
35 files changed:
server/sonar-web/design-system/src/components/Checkbox.tsx
server/sonar-web/design-system/src/components/Dropdown.tsx
server/sonar-web/design-system/src/components/InputSearch.tsx
server/sonar-web/design-system/src/components/Link.tsx
server/sonar-web/design-system/src/components/__tests__/DropdownMenu-test.tsx
server/sonar-web/design-system/src/components/clipboard.tsx
server/sonar-web/design-system/src/components/icons/BranchIcon.tsx
server/sonar-web/design-system/src/components/icons/BugIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/CheckIcon.tsx
server/sonar-web/design-system/src/components/icons/ChevronDownIcon.tsx
server/sonar-web/design-system/src/components/icons/ClockIcon.tsx
server/sonar-web/design-system/src/components/icons/CloseIcon.tsx
server/sonar-web/design-system/src/components/icons/CodeSmellIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/CopyIcon.tsx
server/sonar-web/design-system/src/components/icons/FlagErrorIcon.tsx
server/sonar-web/design-system/src/components/icons/FlagInfoIcon.tsx
server/sonar-web/design-system/src/components/icons/FlagSuccessIcon.tsx
server/sonar-web/design-system/src/components/icons/FlagWarningIcon.tsx
server/sonar-web/design-system/src/components/icons/HelperHintIcon.tsx
server/sonar-web/design-system/src/components/icons/HomeFillIcon.tsx
server/sonar-web/design-system/src/components/icons/HomeIcon.tsx
server/sonar-web/design-system/src/components/icons/Icon.tsx
server/sonar-web/design-system/src/components/icons/MainBranchIcon.tsx
server/sonar-web/design-system/src/components/icons/MenuHelpIcon.tsx
server/sonar-web/design-system/src/components/icons/MenuIcon.tsx
server/sonar-web/design-system/src/components/icons/MenuSearchIcon.tsx
server/sonar-web/design-system/src/components/icons/OpenNewTabIcon.tsx
server/sonar-web/design-system/src/components/icons/OverviewQGNotComputedIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/OverviewQGPassedIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/PullRequestIcon.tsx
server/sonar-web/design-system/src/components/icons/SearchIcon.tsx
server/sonar-web/design-system/src/components/icons/SecurityHotspotIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/StarIcon.tsx
server/sonar-web/design-system/src/components/icons/VulnerabilityIcon.tsx [new file with mode: 0644]
server/sonar-web/design-system/src/components/icons/index.ts

index 80bd53e02d51042c52749ebcca73c7d6027e2942..ad5848ecb8c8b66e50cfa36d2f8d40195b4368de 100644 (file)
  * 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 React from 'react';
 import tw from 'twin.macro';
 import { themeBorder, themeColor, themeContrast } from '../helpers/theme';
 import DeferredSpinner from './DeferredSpinner';
-import CheckIcon from './icons/CheckIcon';
+import { CheckIcon } from './icons/CheckIcon';
 import { CustomIcon } from './icons/Icon';
 
 interface Props {
index 3eccd54e68f76f30a75a070263ce338c77171932..28cd84dfdcd57d2357a199ad6e227854018c048d 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import React from 'react';
 import { translate } from '../helpers/l10n';
 import { PopupPlacement, PopupZLevel } from '../helpers/positioning';
 import { InputSizeKeys } from '../types/theme';
 import { DropdownMenu } from './DropdownMenu';
 import DropdownToggler from './DropdownToggler';
-import MenuIcon from './icons/MenuIcon';
+import { MenuIcon } from './icons/MenuIcon';
 import { InteractiveIcon } from './InteractiveIcon';
 
 type OnClickCallback = (event?: React.MouseEvent<HTMLElement>) => void;
index ba7ee3cd6e64c40c3e114d01f6a9dedf0a3f2123..2330a050058d1ab1312bf35a62210b5af6dd340d 100644 (file)
@@ -17,6 +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 styled from '@emotion/styled';
 import classNames from 'classnames';
 import { debounce } from 'lodash';
@@ -28,8 +29,8 @@ import { themeBorder, themeColor, themeContrast } from '../helpers/theme';
 import { isDefined } from '../helpers/types';
 import { InputSizeKeys } from '../types/theme';
 import DeferredSpinner from './DeferredSpinner';
-import CloseIcon from './icons/CloseIcon';
-import SearchIcon from './icons/SearchIcon';
+import { CloseIcon } from './icons/CloseIcon';
+import { SearchIcon } from './icons/SearchIcon';
 import { InteractiveIcon } from './InteractiveIcon';
 
 interface Props {
index 5f427ece7e2138e8147b02d1dd6673f0e403866a..8b0f846bb914402e449d776d5e3b2296e37dfac2 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import React, { HTMLAttributeAnchorTarget } from 'react';
 import { Link as RouterLink, LinkProps as RouterLinkProps } from 'react-router-dom';
 import tw, { theme as twTheme } from 'twin.macro';
 import { themeBorder, themeColor } from '../helpers/theme';
-import OpenNewTabIcon from './icons/OpenNewTabIcon';
+import { OpenNewTabIcon } from './icons/OpenNewTabIcon';
 import { TooltipWrapperInner } from './Tooltip';
 
 export interface LinkProps extends RouterLinkProps {
index 350c6874e2277a4155ed99284e125e771495f85b..1e68ae1d22e375cbc6fd514dd64d439293796688 100644 (file)
@@ -32,7 +32,7 @@ import {
   ItemNavLink,
   ItemRadioButton,
 } from '../DropdownMenu';
-import MenuIcon from '../icons/MenuIcon';
+import { MenuIcon } from '../icons/MenuIcon';
 import Tooltip from '../Tooltip';
 
 beforeEach(() => {
index 1e3763cb91160e3a43a45472389e08e01af6cf1b..50141fd929fad715466c943948f4b3b670c18723 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import classNames from 'classnames';
 import Clipboard from 'clipboard';
 import React from 'react';
 import { INTERACTIVE_TOOLTIP_DELAY } from '../helpers/constants';
 import { translate } from '../helpers/l10n';
 import { ButtonSecondary } from './buttons';
-import CopyIcon from './icons/CopyIcon';
+import { CopyIcon } from './icons/CopyIcon';
 import { IconProps } from './icons/Icon';
 import { DiscreetInteractiveIcon, InteractiveIcon, InteractiveIconSize } from './InteractiveIcon';
 import Tooltip from './Tooltip';
index 532434ea26ccb56d0b5de1b8fca381ec9b09276e..39e078746f557060780414ecbeea183647eed7d8 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { GitBranchIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(GitBranchIcon, 'BranchIcon');
+export const BranchIcon = OcticonHoc(GitBranchIcon, 'BranchIcon');
diff --git a/server/sonar-web/design-system/src/components/icons/BugIcon.tsx b/server/sonar-web/design-system/src/components/icons/BugIcon.tsx
new file mode 100644 (file)
index 0000000..bf1410e
--- /dev/null
@@ -0,0 +1,40 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+import { CustomIcon, IconProps } from './Icon';
+
+export function BugIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+  const theme = useTheme();
+
+  return (
+    <CustomIcon {...iconProps}>
+      <path
+        d="M10.09,1.88A2.86,2.86,0,0,0,8,1a2.87,2.87,0,0,0-2.11.87A2.93,2.93,0,0,0,5,4h6A2.93,2.93,0,0,0,10.09,1.88Z"
+        fill={themeColor(fill)({ theme })}
+      />
+      <path
+        d="M14.54,9H13V5.6L14.3,4.42a.5.5,0,0,0,0-.71.49.49,0,0,0-.7,0L12.17,5H3.82L2.34,3.66a.5.5,0,0,0-.67.74L2.94,5.55V9H1.46a.5.5,0,0,0,0,1H3a5.2,5.2,0,0,0,1.05,2.32l-2,1.81a.5.5,0,1,0,.67.74l2-1.82A4.62,4.62,0,0,0,7,14.1V8A1,1,0,0,1,8,7a.94.94,0,0,1,1,.9v6.17A4.55,4.55,0,0,0,11.18,13l2,1.83a.51.51,0,0,0,.33.13.48.48,0,0,0,.37-.17.49.49,0,0,0,0-.7l-2-1.8a5.34,5.34,0,0,0,1-2.29h1.64a.5.5,0,0,0,0-1Z"
+        fill={themeColor(fill)({ theme })}
+      />
+    </CustomIcon>
+  );
+}
index dff5e8b4455cb2fcca888512cd5b9bfd36a119d2..5b42e8dba4593a29a70db6bc3d1bdc126ebb74ab 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function CheckIcon({ fill = 'iconCheck', ...iconProps }: IconProps) {
+export function CheckIcon({ fill = 'iconCheck', ...iconProps }: IconProps) {
   const theme = useTheme();
   return (
     <CustomIcon {...iconProps}>
index b34e88000988df4778402d823577b79469457dfd..0f711a38f76d110fa7027bcee7a0295245b33f26 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
index 15f81c7a3025965467938824f80a5018b68e200d..23bb59c2f6d599540c20bfe38a89a57c9bc2bebf 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { ClockIcon } from '@primer/octicons-react';
+
+import { ClockIcon as OcticonClockIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(ClockIcon);
+export const ClockIcon = OcticonHoc(OcticonClockIcon, 'ClockIcon');
index 79fb0888398cd6c66e66f4e9b665469cff2e1296..26ec6f2eea5b157066b52bde8955ceead8eb369c 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { XIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(XIcon, 'CloseIcon');
+export const CloseIcon = OcticonHoc(XIcon, 'CloseIcon');
diff --git a/server/sonar-web/design-system/src/components/icons/CodeSmellIcon.tsx b/server/sonar-web/design-system/src/components/icons/CodeSmellIcon.tsx
new file mode 100644 (file)
index 0000000..0a5e4f2
--- /dev/null
@@ -0,0 +1,36 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+import { CustomIcon, IconProps } from './Icon';
+
+export function CodeSmellIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+  const theme = useTheme();
+
+  return (
+    <CustomIcon {...iconProps}>
+      <path
+        d="M8,15.1a7,7,0,1,0-7-7A7,7,0,0,0,8,15.1Zm.74-8.9,1.46-2.52a.29.29,0,0,1,.25-.14.3.3,0,0,1,.15,0,5.26,5.26,0,0,1,2.61,4.53.28.28,0,0,1-.29.29H10a.28.28,0,0,1-.29-.29,1.78,1.78,0,0,0-.88-1.51A.29.29,0,0,1,8.75,6.2Zm.11,3.44A.23.23,0,0,1,9,9.6a.29.29,0,0,1,.25.14l1.46,2.52a.18.18,0,0,1,0,.13.3.3,0,0,1-.15.27,5.3,5.3,0,0,1-5.23,0,.3.3,0,0,1-.1-.4L6.73,9.74A.29.29,0,0,1,7,9.6a.23.23,0,0,1,.14,0A1.79,1.79,0,0,0,8.86,9.64ZM5.33,3.59a.3.3,0,0,1,.41.1L7.2,6.21a.29.29,0,0,1-.1.4,1.79,1.79,0,0,0-.87,1.51.28.28,0,0,1-.29.29H3a.32.32,0,0,1-.32-.29A5.26,5.26,0,0,1,5.33,3.59Z"
+        fill={themeColor(fill)({ theme })}
+      />
+    </CustomIcon>
+  );
+}
index e9f125799611dd1af7f2890fda1e3e4563507ba8..95f2890160cba40687be3931031573425ca95ede 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { CopyIcon } from '@primer/octicons-react';
+
+import { CopyIcon as OcticonCopyIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(CopyIcon);
+export const CopyIcon = OcticonHoc(OcticonCopyIcon, 'CopyIcon');
index 519b9a387a0ca7736865e1de596491139ceefbb3..83509b0a23bda2c48dfcb6c1fb85dd31cc2db002 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
index 3aef3045e4af2551c07b845200d59277ec578210..5e7e9b473dc6d1a73d5b0891118cf73b3e12fa54 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
index 748b8a5bc315f7402e13eece900a12aec3ed970e..fdc0d77ed33fcb0d4781516454ad6e95d7a5aad2 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
index 0550bbb9c96254da2aa89ad1342a1fc4e2a96f64..4945a44ea439c0a9a510c6b72e575d8f57fc758c 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
index 0a5e69616342de40131d8a36d9fcc772a1a80a09..ea7774b84d6202befcc784ccf112daed3b2366e4 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor, themeContrast } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function HelperHintIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+export function HelperHintIcon(iconProps: IconProps) {
   const theme = useTheme();
   return (
     <CustomIcon {...iconProps}>
index 72d7cd6505912ecfd916ad75d317ee017b9f064e..91d31f028ccc72ce8d94ddde5c532ef048ecb4a0 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function HomeFillIcon({ fill = 'iconFavorite', ...iconProps }: IconProps) {
+export function HomeFillIcon({ fill = 'iconFavorite', ...iconProps }: IconProps) {
   const theme = useTheme();
   const fillColor = themeColor(fill)({ theme });
   return (
index a4a6d07ba0160b78361f236d0627addbe3f456f5..f10bb82d74ae55a9bd94f53e618678ce18fc9daa 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { HomeIcon } from '@primer/octicons-react';
+
+import { HomeIcon as OcticonHomeIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(HomeIcon);
+export const HomeIcon = OcticonHoc(OcticonHomeIcon, 'HomeIcon');
index 5edea8c38c05aa7f5718ba83e99c7ee0dd4c2987..a9a246a0c217945c9a3d4ec2d824ace7a227f40f 100644 (file)
@@ -17,6 +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 { useTheme } from '@emotion/react';
 import { OcticonProps } from '@primer/octicons-react';
 import React from 'react';
index e954c1e74e00ca301dd80628f15f8448bb18f15b..ca4af3e19819db582e83e712511f3569227445db 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function MainBranchIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+export function MainBranchIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
   const theme = useTheme();
   return (
     <CustomIcon {...iconProps}>
index 5fcebecdf935b21a93a05403afa5ffd04d17b564..108dce3a4171c77f4e57e70ffb271813866c36bc 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function MenuHelpIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+export function MenuHelpIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
   const theme = useTheme();
   return (
     <CustomIcon {...iconProps}>
index ea30d7ddf9a27142ec290f5c99c1570c6493dfdb..2e3b99820af92fddc83a3cf35420d01cde8b0097 100644 (file)
  * 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 { KebabHorizontalIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-const MenuIcon = styled(OcticonHoc(KebabHorizontalIcon))`
+export const MenuIcon = styled(OcticonHoc(KebabHorizontalIcon, 'MenuIcon'))`
   transform: rotate(90deg);
 `;
-
-MenuIcon.displayName = 'MenuIcon';
-export default MenuIcon;
index a09077285e8e3c79cfbf8205384f00521df3c8ef..2ec2898dc52d2061306715b4b06573ac4c7c9db0 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { useTheme } from '@emotion/react';
 import { themeColor } from '../../helpers/theme';
 import { CustomIcon, IconProps } from './Icon';
 
-export default function MenuSearchIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+export function MenuSearchIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
   const theme = useTheme();
 
   return (
index f856c0ce7eecd657fe02f28ad59db5b18cfd4681..47aa519c669170ec072e808001d65fd7613f075e 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { LinkExternalIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(LinkExternalIcon, 'OpenNewTabIcon');
+export const OpenNewTabIcon = OcticonHoc(LinkExternalIcon, 'OpenNewTabIcon');
diff --git a/server/sonar-web/design-system/src/components/icons/OverviewQGNotComputedIcon.tsx b/server/sonar-web/design-system/src/components/icons/OverviewQGNotComputedIcon.tsx
new file mode 100644 (file)
index 0000000..8bb6bb0
--- /dev/null
@@ -0,0 +1,132 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+
+export function OverviewQGNotComputedIcon({ className }: { className?: string }) {
+  const theme = useTheme();
+
+  return (
+    <svg
+      className={className}
+      fill="none"
+      height="168"
+      role="img"
+      viewBox="0 0 168 168"
+      width="168"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        clipRule="evenodd"
+        d="M149.542 26.472L141.248 37.2099C140.456 38.2345 140.645 39.7068 141.67 40.4983C142.695 41.2897 144.167 41.1007 144.959 40.076L153.253 29.3382C154.044 28.3135 153.855 26.8413 152.831 26.0498C151.806 25.2583 150.334 25.4473 149.542 26.472ZM137.915 45.3598C141.625 48.2252 146.955 47.5408 149.82 43.8312L158.114 33.0934C160.98 29.3837 160.295 24.0536 156.586 21.1883C152.876 18.3229 147.546 19.0072 144.681 22.7168L136.386 33.4547C133.521 37.1643 134.205 42.4944 137.915 45.3598Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M149.385 57.9371C149.385 46.1503 139.83 36.5952 128.043 36.5952C116.257 36.5952 106.702 46.1503 106.702 57.9371C106.702 69.7238 116.257 79.2789 128.043 79.2789C139.83 79.2789 149.385 69.7238 149.385 57.9371ZM155.528 57.9371C155.528 42.7576 143.223 30.4523 128.043 30.4523C112.864 30.4523 100.559 42.7576 100.559 57.9371C100.559 73.1165 112.864 85.4218 128.043 85.4218C143.223 85.4218 155.528 73.1165 155.528 57.9371Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M143.6 57.937C143.6 49.3459 136.635 42.3814 128.044 42.3814C119.453 42.3814 112.489 49.3459 112.489 57.937C112.489 66.5281 119.453 73.4925 128.044 73.4925C136.635 73.4925 143.6 66.528 143.6 57.937ZM149.743 57.937C149.743 45.9532 140.028 36.2385 128.044 36.2385C116.06 36.2385 106.346 45.9532 106.346 57.937C106.346 69.9207 116.06 79.6355 128.044 79.6355C140.028 79.6355 149.743 69.9207 149.743 57.937Z"
+        fill={themeColor('illustrationShade')({ theme })}
+        fillRule="evenodd"
+      />
+      <path d="M24 40L24 135H32L32 40H24Z" fill={themeColor('illustrationSecondary')({ theme })} />
+      <path
+        d="M38 56L53 56L53 48L38 48L38 56Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+      />
+      <path
+        d="M61 56L76 56L76 48L61 48L61 56Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+      />
+      <path
+        clipRule="evenodd"
+        d="M88 67.5746H21V61.3297H88V67.5746Z"
+        fill={themeColor('illustrationOutline')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M18 133C18 136.866 21.134 140 25 140H153C156.866 140 160 136.866 160 133V78H154V133C154 133.552 153.552 134 153 134H25C24.4477 134 24 133.552 24 133V44C24 43.4477 24.4477 43 25 43H72V37H25C21.134 37 18 40.134 18 44V133Z"
+        fill={themeColor('illustrationOutline')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M69.2432 103.219L78.7954 93.6672L74.5527 89.4245L60.7578 103.219L74.5527 117.014L78.7954 112.771L69.2432 103.219Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M108.906 103.219L99.3538 93.6672L103.596 89.4246L117.391 103.219L103.596 117.014L99.3538 112.771L108.906 103.219Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M81.7179 119.862L91.0929 84.2365L96.8953 85.7635L87.5203 121.388L81.7179 119.862Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+        fillRule="evenodd"
+      />
+      <path
+        d="M51 128.953C51 141.379 40.9264 151.453 28.5 151.453C16.0736 151.453 6 141.379 6 128.953C6 116.526 16.0736 106.453 28.5 106.453C40.9264 106.453 51 116.526 51 128.953Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+      <path
+        clipRule="evenodd"
+        d="M25 131.953V113.953H31V131.953H25Z"
+        fill="white"
+        fillRule="evenodd"
+      />
+      <path
+        clipRule="evenodd"
+        d="M25 142.453L25 136.453L31 136.453L31 142.453L25 142.453Z"
+        fill="white"
+        fillRule="evenodd"
+      />
+      <path
+        d="M105.398 35.2089L90.7238 24.2245L95.8489 19.5626L105.398 35.2089Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+      <path
+        d="M99 41.5242L88.5 44.9883L88.5 38.0601L99 41.5242Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+      <path
+        d="M139.228 86.8865L147.417 92.2112L141.826 96.3028L139.228 86.8865Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+      <path
+        d="M132 88.5242L135.464 105.024H128.536L132 88.5242Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+      <path
+        d="M114 29.5242L110.536 19.7742L117.464 19.7742L114 29.5242Z"
+        fill={themeColor('illustrationPrimary')({ theme })}
+      />
+    </svg>
+  );
+}
diff --git a/server/sonar-web/design-system/src/components/icons/OverviewQGPassedIcon.tsx b/server/sonar-web/design-system/src/components/icons/OverviewQGPassedIcon.tsx
new file mode 100644 (file)
index 0000000..e535d8f
--- /dev/null
@@ -0,0 +1,99 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+
+export function OverviewQGPassedIcon({ className }: { className?: string }) {
+  const theme = useTheme();
+
+  return (
+    <svg
+      className={className}
+      fill="none"
+      height="150"
+      role="img"
+      viewBox="0 0 154 150"
+      width="154"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M18 26.3839L18 128.594H26L26 26.3839H18Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+      />
+      <path
+        d="M32 43.5982L47 43.5982L47 34.9911L32 34.9911L32 43.5982Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+      />
+      <path
+        d="M55 43.5982L70 43.5982L70 34.9911L55 34.9911L55 43.5982Z"
+        fill={themeColor('illustrationSecondary')({ theme })}
+      />
+      <path
+        d="M15 52.2054L87 52.2054"
+        stroke={themeColor('illustrationOutline')({ theme })}
+        strokeWidth="6"
+      />
+      <path
+        d="M87 26.3839H19C16.7909 26.3839 15 28.1748 15 30.3839V126.746C15 128.955 16.7909 130.746 19 130.746H147C149.209 130.746 151 128.955 151 126.746V62.9643M136 26.3839H147C149.209 26.3839 151 28.1748 151 30.3839V42.5223"
+        stroke={themeColor('illustrationOutline')({ theme })}
+        strokeWidth="6"
+      />
+      <path
+        d="M70.6736 103.733L59 91.1733L70.6736 78.614"
+        stroke={themeColor('illustrationSecondary')({ theme })}
+        strokeWidth="6"
+      />
+      <path
+        d="M95.4744 78.614L107.148 91.1733L95.4744 103.733"
+        stroke={themeColor('illustrationSecondary')({ theme })}
+        strokeWidth="6"
+      />
+      <path
+        d="M87.9937 71.5714L78.6187 109.9"
+        stroke={themeColor('illustrationSecondary')({ theme })}
+        strokeWidth="6"
+      />
+      <ellipse
+        cx="22.5"
+        cy="122.676"
+        fill={themeColor('illustrationPrimary')({ theme })}
+        rx="22.5"
+        ry="24.2076"
+      />
+      <path d="M14 121.063L21 128.594L34 114.607" stroke="white" strokeWidth="6" />
+      <path
+        d="M108.684 52.7433C116.712 48.065 123.243 41.1875 127.5 32.9269C131.757 41.1875 138.288 48.065 146.316 52.7433C138.288 57.4216 131.757 64.2991 127.5 72.5597C123.243 64.2991 116.712 57.4216 108.684 52.7433Z"
+        stroke={themeColor('illustrationPrimary')({ theme })}
+        strokeWidth="6"
+      />
+      <path
+        d="M94.8732 23.1563C99.0981 20.5339 102.585 16.8739 105 12.5277C107.415 16.8739 110.902 20.5339 115.127 23.1563C110.902 25.7786 107.415 29.4386 105 33.7848C102.585 29.4386 99.0981 25.7786 94.8732 23.1563Z"
+        stroke={themeColor('illustrationPrimary')({ theme })}
+        strokeWidth="4.5"
+      />
+      <path
+        d="M123.126 8.6317C124.893 7.43681 126.384 5.87768 127.5 4.06049C128.616 5.87768 130.107 7.43681 131.874 8.6317C130.107 9.82658 128.616 11.3857 127.5 13.2029C126.384 11.3857 124.893 9.82658 123.126 8.6317Z"
+        stroke={themeColor('illustrationPrimary')({ theme })}
+        strokeWidth="3"
+      />
+    </svg>
+  );
+}
index 4f058f00f00e872687b41e5fab0fd596d30f9505..a91eaa04faae7d2928f4a74042d751bc56e1df1d 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+
 import { GitPullRequestIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(GitPullRequestIcon, 'PullRequestIcon');
+export const PullRequestIcon = OcticonHoc(GitPullRequestIcon, 'PullRequestIcon');
index 674ac699a6e3cc627495265fb6b6a968c23a5a88..f629c1e946094747262b2d5de3bf6eab9046cac9 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { SearchIcon } from '@primer/octicons-react';
+
+import { SearchIcon as OcticonSearchIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(SearchIcon);
+export const SearchIcon = OcticonHoc(OcticonSearchIcon, 'SearchIcon');
diff --git a/server/sonar-web/design-system/src/components/icons/SecurityHotspotIcon.tsx b/server/sonar-web/design-system/src/components/icons/SecurityHotspotIcon.tsx
new file mode 100644 (file)
index 0000000..8f5b06a
--- /dev/null
@@ -0,0 +1,36 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+import { CustomIcon, IconProps } from './Icon';
+
+export function SecurityHotspotIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+  const theme = useTheme();
+
+  return (
+    <CustomIcon {...iconProps}>
+      <path
+        d="M14.08 3.23a1 1 0 00-.67-.77L8.16 1a1.06 1.06 0 00-.5 0L2.41 2.46a.94.94 0 00-.67.77c-.08.57-.74 5.63 1.14 8.31A9 9 0 007.68 15a.85.85 0 00.23 0 .78.78 0 00.22 0 8.93 8.93 0 004.81-3.46c1.85-2.68 1.21-7.74 1.14-8.31zM12.21 8a6.15 6.15 0 01-.86 2.42A7.92 7.92 0 018 13V8zM8 3v5H3.59a24.29 24.29 0 010-3.82z"
+        fill={themeColor(fill)({ theme })}
+      />
+    </CustomIcon>
+  );
+}
index f83c9a340a52f0630c80cd0d14e781b93e073e9c..bb0913640a18ce8ddf9fa2d4ee3a71e5654ed74d 100644 (file)
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { StarIcon } from '@primer/octicons-react';
+
+import { StarIcon as OcticonStarIcon } from '@primer/octicons-react';
 import { OcticonHoc } from './Icon';
 
-export default OcticonHoc(StarIcon);
+export const StarIcon = OcticonHoc(OcticonStarIcon, 'StarIcon');
diff --git a/server/sonar-web/design-system/src/components/icons/VulnerabilityIcon.tsx b/server/sonar-web/design-system/src/components/icons/VulnerabilityIcon.tsx
new file mode 100644 (file)
index 0000000..dcede54
--- /dev/null
@@ -0,0 +1,36 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2023 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 { useTheme } from '@emotion/react';
+import { themeColor } from '../../helpers/theme';
+import { CustomIcon, IconProps } from './Icon';
+
+export function VulnerabilityIcon({ fill = 'currentColor', ...iconProps }: IconProps) {
+  const theme = useTheme();
+
+  return (
+    <CustomIcon {...iconProps}>
+      <path
+        d="M12,7.05H6V5a2,2,0,1,1,4,0,1,1,0,0,0,2,0A4,4,0,1,0,4,5V7.06A1.12,1.12,0,0,0,3,8.17V14a1.12,1.12,0,0,0,1.12,1.12H12A1.12,1.12,0,0,0,13.1,14V8.17A1.12,1.12,0,0,0,12,7.05ZM8,13a2,2,0,1,1,2-2A2,2,0,0,1,8,13Z"
+        fill={themeColor(fill)({ theme })}
+      />
+    </CustomIcon>
+  );
+}
index 303600bd9be952cc4aab839223777d8e5d1f34d5..b57a9b5862fed0d11789137da0cb74d19d875629 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-export { default as BranchIcon } from './BranchIcon';
+
+export { BranchIcon } from './BranchIcon';
+export { BugIcon } from './BugIcon';
 export { ChevronDownIcon } from './ChevronDownIcon';
-export { default as ClockIcon } from './ClockIcon';
+export { ClockIcon } from './ClockIcon';
+export { CodeSmellIcon } from './CodeSmellIcon';
 export { FlagErrorIcon } from './FlagErrorIcon';
 export { FlagInfoIcon } from './FlagInfoIcon';
 export { FlagSuccessIcon } from './FlagSuccessIcon';
 export { FlagWarningIcon } from './FlagWarningIcon';
-export { default as HelperHintIcon } from './HelperHintIcon';
-export { default as HomeFillIcon } from './HomeFillIcon';
-export { default as HomeIcon } from './HomeIcon';
-export { default as MainBranchIcon } from './MainBranchIcon';
-export { default as MenuHelpIcon } from './MenuHelpIcon';
-export { default as MenuSearchIcon } from './MenuSearchIcon';
-export { default as OpenNewTabIcon } from './OpenNewTabIcon';
-export { default as PullRequestIcon } from './PullRequestIcon';
-export { default as StarIcon } from './StarIcon';
+export { HelperHintIcon } from './HelperHintIcon';
+export { HomeFillIcon } from './HomeFillIcon';
+export { HomeIcon } from './HomeIcon';
+export { MainBranchIcon } from './MainBranchIcon';
+export { MenuHelpIcon } from './MenuHelpIcon';
+export { MenuSearchIcon } from './MenuSearchIcon';
+export { OpenNewTabIcon } from './OpenNewTabIcon';
+export { OverviewQGNotComputedIcon } from './OverviewQGNotComputedIcon';
+export { OverviewQGPassedIcon } from './OverviewQGPassedIcon';
+export { PullRequestIcon } from './PullRequestIcon';
+export { SecurityHotspotIcon } from './SecurityHotspotIcon';
+export { StarIcon } from './StarIcon';
+export { VulnerabilityIcon } from './VulnerabilityIcon';