fix(TenantOverview): add copy button to tenant name (#459)

Author: artemmufazalov

src/components/EntityStatus/EntityStatus.js

@@ -31,6 +31,7 @@ class EntityStatus extends React.Component {
         label: PropTypes.string,
         iconPath: PropTypes.string,
         hasClipboardButton: PropTypes.bool,
+        clipboardButtonAlwaysVisible: PropTypes.bool,
         showStatus: PropTypes.bool,
         externalLink: PropTypes.bool,
         className: PropTypes.string,
@@ -47,6 +48,7 @@ class EntityStatus extends React.Component {
         externalLink: false,
         mode: 'color',
         withLeftTrim: false,
+        clipboardButtonAlwaysVisible: false,
     };
     renderIcon() {
         const {status, size, showStatus, mode} = this.props;
@@ -123,7 +125,7 @@ class EntityStatus extends React.Component {
                         component="span"
                         size="s"
                         className={b('clipboard-button', {
-                            visible: false,
+                            visible: this.props.clipboardButtonAlwaysVisible,
                         })}
                     >
                         <ClipboardButton text={name} size={16} />

src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.js

@@ -27,10 +27,13 @@ const renderName = (tenant) => {
         const {Name} = tenant;
         return (
             <div className={b('tenant-name-wrapper')}>
-                <EntityStatus status={tenant.State} />
-                <span className={b('tenant-name-trim')}>
-                    <span className={b('tenant-name')}>{Name}</span>
-                </span>
+                <EntityStatus
+                    status={tenant.State}
+                    name={Name}
+                    withLeftTrim
+                    hasClipboardButton
+                    clipboardButtonAlwaysVisible
+                />
             </div>
         );
     }

src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.scss

@@ -10,21 +10,6 @@
         display: flex;
         overflow: hidden;
         align-items: center;
-
-        & .yc-link {
-            display: flex;
-        }
-    }
-    &__tenant-name-trim {
-        overflow: hidden;
-
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        direction: rtl;
-    }
-
-    &__tenant-name {
-        unicode-bidi: plaintext;
     }
 
     &__top {