]> source.dussan.org Git - sonarqube.git/commitdiff
SONAR-20023 Drop old type icon from source viewer
authorstanislavh <stanislav.honcharov@sonarsource.com>
Wed, 9 Aug 2023 11:08:09 +0000 (13:08 +0200)
committersonartech <sonartech@sonarsource.com>
Fri, 18 Aug 2023 20:02:49 +0000 (20:02 +0000)
server/sonar-web/design-system/src/components/__tests__/LineFinding-test.tsx
server/sonar-web/design-system/src/components/__tests__/__snapshots__/LineFinding-test.tsx.snap
server/sonar-web/design-system/src/components/code-line/LineFinding.tsx
server/sonar-web/design-system/src/components/icons/IssueTypeIcon.tsx
server/sonar-web/src/main/js/apps/issues/crossComponentSourceViewer/ComponentSourceSnippetGroupViewer.tsx

index 30d470d809bc0ed23b4a3660b92acabbac02bf7d..2d05bd33cd68008f0f13f093ac48abfddd54f2b8 100644 (file)
@@ -30,16 +30,11 @@ it('should render correctly', async () => {
   expect(container).toMatchSnapshot();
 });
 
-it('should render correctly when issueType is provided', () => {
-  const { container } = setupWithProps({ issueType: 'bugs' });
-  expect(container).toMatchSnapshot();
-});
-
 it('should be clickable when onIssueSelect is provided', async () => {
   const mockClick = jest.fn();
   const user = userEvent.setup();
 
-  setupWithProps({ issueType: 'bugs', onIssueSelect: mockClick });
+  setupWithProps({ onIssueSelect: mockClick });
   await user.click(screen.getByRole('button'));
   expect(mockClick).toHaveBeenCalled();
 });
index f68f4f6dec9b4dc8e15ea479adc23f7539fa0bf5..1d6ffe7a20d2e061b8c9370ff0a3708cb5b27b77 100644 (file)
@@ -49,100 +49,3 @@ exports[`should render correctly 1`] = `
   </button>
 </div>
 `;
-
-exports[`should render correctly when issueType is provided 1`] = `
-.emotion-0 {
-  all: unset;
-  cursor: pointer;
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  gap: 0.5rem;
-  margin-left: 0.25rem;
-  margin-right: 0.25rem;
-  margin-top: 0.75rem;
-  margin-bottom: 0.75rem;
-  padding: 0.75rem;
-  font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
-  font-size: 1rem;
-  line-height: 1.5rem;
-  font-weight: 600;
-  border-radius: 0.25rem;
-  width: 100%;
-  box-sizing: border-box;
-  border: 1px solid rgb(253,162,155);
-  color: rgb(62,67,87);
-  font-weight: 600;
-  word-break: break-word;
-  background-color: rgb(255,255,255);
-}
-
-.emotion-0:focus-visible {
-  background-color: rgb(239,242,249);
-}
-
-.emotion-0:hover {
-  box-shadow: 0px 1px 3px 0px rgba(29,33,47,0.05),0px 1px 25px 0px rgba(29,33,47,0.05);
-}
-
-.emotion-2 {
-  height: 1.5rem;
-  width: 1.5rem;
-  display: -webkit-inline-box;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-flex-shrink: 0;
-  -ms-flex-negative: 0;
-  flex-shrink: 0;
-  -webkit-align-items: center;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  -webkit-justify-content: center;
-  justify-content: center;
-  background: rgb(254,205,202);
-  border-radius: 100%;
-}
-
-<div>
-  <button
-    class="emotion-0 emotion-1"
-    data-issue="key"
-  >
-    <div
-      class="sw-ml-1/2 emotion-2 emotion-3"
-    >
-      <svg
-        aria-hidden="true"
-        fill="none"
-        height="16"
-        role="img"
-        style="clip-rule: evenodd; display: inline-block; fill-rule: evenodd; user-select: none; vertical-align: middle; stroke-linejoin: round; stroke-miterlimit: 1.414;"
-        version="1.1"
-        viewBox="0 0 16 16"
-        width="16"
-        xml:space="preserve"
-        xmlns:xlink="http://www.w3.org/1999/xlink"
-      >
-        <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="rgb(93,29,19)"
-        />
-        <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="rgb(93,29,19)"
-        />
-      </svg>
-    </div>
-    message
-  </button>
-</div>
-`;
index 65bb88cc93d574db86e292d827992b0d05d77ec6..742c478b197b43573e6904594019393e23e19e6a 100644 (file)
@@ -22,19 +22,17 @@ import { forwardRef, Ref } from 'react';
 import tw from 'twin.macro';
 import { themeBorder, themeColor, themeContrast, themeShadow } from '../../helpers/theme';
 import { BareButton } from '../buttons';
-import { IssueTypeCircleIcon } from '../icons/IssueTypeIcon';
 
 interface Props {
   className?: string;
   issueKey: string;
-  issueType?: string;
   message: React.ReactNode;
   onIssueSelect?: (issueKey: string) => void;
   selected?: boolean;
 }
 
 function LineFindingFunc(
-  { issueType, message, issueKey, selected = true, className, onIssueSelect }: Props,
+  { message, issueKey, selected = true, className, onIssueSelect }: Props,
   ref: Ref<HTMLButtonElement>
 ) {
   return (
@@ -49,7 +47,6 @@ function LineFindingFunc(
       ref={ref}
       selected={selected}
     >
-      {issueType && <IssueTypeCircleIcon className="sw-ml-1/2" type={issueType} />}
       {message}
     </LineFindingStyled>
   );
index 94047ec41c7d1e9757eb39991a8816bbef1e5508..7988daa5c6a73dfd88bc601d0d4ce3a23fe7c8cf 100644 (file)
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 
-import { useTheme } from '@emotion/react';
-import styled from '@emotion/styled';
-import tw from 'twin.macro';
-import { themeColor, themeContrast } from '../../helpers/theme';
 import { IssueType } from '../../types';
 import { BugIcon } from './BugIcon';
 import { CodeSmellIcon } from './CodeSmellIcon';
@@ -67,20 +63,3 @@ export function IssueTypeIcon({ type, ...iconProps }: Props) {
       return null;
   }
 }
-
-export function IssueTypeCircleIcon({ className, type, ...iconProps }: Props) {
-  const theme = useTheme();
-  return (
-    <CircleIconContainer className={className}>
-      <IssueTypeIcon fill={themeContrast('issueTypeIcon')({ theme })} type={type} {...iconProps} />
-    </CircleIconContainer>
-  );
-}
-
-const CircleIconContainer = styled.div`
-  ${tw`sw-w-6 sw-h-6`}
-  ${tw`sw-inline-flex sw-items-center sw-justify-center sw-shrink-0`};
-
-  background: ${themeColor('issueTypeIcon')};
-  border-radius: 100%;
-`;
index 47d82f53de20ab51c6ab449e51bb62f3eaa22460..f2c5df4f80fab9931a36317c553a8df6f4040a46 100644 (file)
@@ -240,7 +240,6 @@ export default class ComponentSourceSnippetGroupViewer extends React.PureCompone
               <IssueSourceViewerScrollContext.Consumer key={issueToDisplay.key}>
                 {(ctx) => (
                   <LineFinding
-                    issueType={issueToDisplay.type}
                     issueKey={issueToDisplay.key}
                     message={
                       <IssueMessageHighlighting
@@ -315,7 +314,6 @@ export default class ComponentSourceSnippetGroupViewer extends React.PureCompone
               <IssueSourceViewerScrollContext.Consumer>
                 {(ctx) => (
                   <LineFinding
-                    issueType={issue.type}
                     issueKey={issue.key}
                     message={
                       <IssueMessageHighlighting