Create and use ClearButton component

3 files changed, 13 insertions, 13 deletions

diff --git a/server/sonar-web/src/main/js/components/workspace/WorkspaceNavItem.tsx b/server/sonar-web/src/main/js/components/workspace/WorkspaceNavItem.tsx
index 51505c7dbaa..bb94c03bc04 100644
--- a/server/sonar-web/src/main/js/components/workspace/WorkspaceNavItem.tsx
+++ b/server/sonar-web/src/main/js/components/workspace/WorkspaceNavItem.tsx
@@ -18,8 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import ClearIcon from '../icons-components/ClearIcon';
-import { ButtonIcon } from '../ui/buttons';
+import { ClearButton } from '../ui/buttons';
 
 export interface Props {
   children: React.ReactNode;
@@ -40,12 +39,12 @@ export default class WorkspaceNavItem extends React.PureComponent<Props> {
         <a className="workspace-nav-item-link" href="#" onClick={this.handleNameClick}>
           {this.props.children}
         </a>
-        <ButtonIcon
+        <ClearButton
           className="js-close workspace-nav-item-close workspace-header-icon button-small little-spacer-left"
           color="#fff"
-          onClick={this.props.onClose}>
-          <ClearIcon fill={undefined} size={12} />
-        </ButtonIcon>
+          iconProps={{ size: 12 }}
+          onClick={this.props.onClose}
+        />
       </li>
     );
   }
diff --git a/server/sonar-web/src/main/js/components/workspace/__tests__/WorkspaceNavItem-test.tsx b/server/sonar-web/src/main/js/components/workspace/__tests__/WorkspaceNavItem-test.tsx
index fabed55b690..90ec99f0db8 100644
--- a/server/sonar-web/src/main/js/components/workspace/__tests__/WorkspaceNavItem-test.tsx
+++ b/server/sonar-web/src/main/js/components/workspace/__tests__/WorkspaceNavItem-test.tsx
@@ -29,7 +29,7 @@ it('should render', () => {
 it('should close', () => {
   const onClose = jest.fn();
   const wrapper = shallowRender({ onClose });
-  click(wrapper.find('ButtonIcon'));
+  click(wrapper.find('ClearButton'));
   expect(onClose).toBeCalled();
 });
 
diff --git a/server/sonar-web/src/main/js/components/workspace/__tests__/__snapshots__/WorkspaceNavItem-test.tsx.snap b/server/sonar-web/src/main/js/components/workspace/__tests__/__snapshots__/WorkspaceNavItem-test.tsx.snap
index 3834b942dba..92280457eef 100644
--- a/server/sonar-web/src/main/js/components/workspace/__tests__/__snapshots__/WorkspaceNavItem-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/workspace/__tests__/__snapshots__/WorkspaceNavItem-test.tsx.snap
@@ -13,14 +13,15 @@ exports[`should render 1`] = `
       id="workspace-nav-item"
     />
   </a>
-  <ButtonIcon
+  <ClearButton
     className="js-close workspace-nav-item-close workspace-header-icon button-small little-spacer-left"
     color="#fff"
+    iconProps={
+      Object {
+        "size": 12,
+      }
+    }
     onClick={[MockFunction]}
-  >
-    <ClearIcon
-      size={12}
-    />
-  </ButtonIcon>
+  />
 </li>
 `;