From dc83bdd9fb9253ffeedb610b8427818c62e910d0 Mon Sep 17 00:00:00 2001
From: hriday-panchasara <hriday.panchasara@ericsson.com>
Date: Fri, 28 Jan 2022 10:14:53 -0600
Subject: [PATCH] selecting device names/labels shoudn't be allowed

Signed-off-by: hriday-panchasara <hriday.panchasara@ericsson.com>
---
 .../src/components/abstract-tree-output-component.tsx      | 2 +-
 .../src/components/datatree-output-component.tsx           | 2 +-
 .../src/components/null-output-component.tsx               | 2 +-
 .../src/trace-explorer/trace-explorer-views-widget.tsx     | 2 +-
 .../react-components/style/output-components-style.css     | 7 +++++++
 5 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/react-components/src/components/abstract-tree-output-component.tsx b/packages/react-components/src/components/abstract-tree-output-component.tsx
index 0746fdcde..5fb752aac 100644
--- a/packages/react-components/src/components/abstract-tree-output-component.tsx
+++ b/packages/react-components/src/components/abstract-tree-output-component.tsx
@@ -16,7 +16,7 @@ export abstract class AbstractTreeOutputComponent<P extends AbstractOutputProps,
 
     renderMainArea(): React.ReactNode {
         return <React.Fragment>
-            <div ref={this.treeRef} className='output-component-tree'
+            <div ref={this.treeRef} className='output-component-tree disable-select'
                 style={{ width: this.getTreeWidth(), height: this.props.style.height }}
             >
                 {this.renderTree()}
diff --git a/packages/react-components/src/components/datatree-output-component.tsx b/packages/react-components/src/components/datatree-output-component.tsx
index cdbd349fc..0915117d9 100644
--- a/packages/react-components/src/components/datatree-output-component.tsx
+++ b/packages/react-components/src/components/datatree-output-component.tsx
@@ -102,7 +102,7 @@ export class DataTreeOutputComponent extends AbstractOutputComponent<AbstractOut
     renderMainArea(): React.ReactNode {
         return <React.Fragment>
             {this.state.outputStatus === ResponseStatus.COMPLETED ?
-                <div ref={this.treeRef} className='output-component-tree'
+                <div ref={this.treeRef} className='output-component-tree disable-select'
                     style={{ height: this.props.style.height, width: this.props.widthWPBugWorkaround }}
                 >
                     {this.renderTree()}
diff --git a/packages/react-components/src/components/null-output-component.tsx b/packages/react-components/src/components/null-output-component.tsx
index c1cf50c59..a9b49894e 100644
--- a/packages/react-components/src/components/null-output-component.tsx
+++ b/packages/react-components/src/components/null-output-component.tsx
@@ -16,7 +16,7 @@ export class NullOutputComponent extends AbstractOutputComponent<NullOutputProps
         const treeWidth = Math.min(this.getMainAreaWidth(), this.props.style.sashOffset + this.props.style.sashWidth);
         const chartWidth = this.getMainAreaWidth() - treeWidth;
         return <React.Fragment>
-            <div className='output-component-tree'
+            <div className='output-component-tree disable-select'
                 style={{ width: treeWidth, height: this.props.style.height }}
             >
                 {''}
diff --git a/packages/react-components/src/trace-explorer/trace-explorer-views-widget.tsx b/packages/react-components/src/trace-explorer/trace-explorer-views-widget.tsx
index f04ac9a22..193010a4c 100644
--- a/packages/react-components/src/trace-explorer/trace-explorer-views-widget.tsx
+++ b/packages/react-components/src/trace-explorer/trace-explorer-views-widget.tsx
@@ -58,7 +58,7 @@ export class ReactAvailableViewsWidget extends React.Component<ReactAvailableVie
         const totalHeight = this.getTotalHeight();
         return (
             <div className='trace-explorer-views'>
-                <div className='trace-explorer-panel-content'>
+                <div className='trace-explorer-panel-content disable-select'>
                     <AutoSizer>
                         {({ width }) =>
                             <List
diff --git a/packages/react-components/style/output-components-style.css b/packages/react-components/style/output-components-style.css
index 5f90a0a21..1ff177d52 100644
--- a/packages/react-components/style/output-components-style.css
+++ b/packages/react-components/style/output-components-style.css
@@ -47,6 +47,13 @@
     z-index: -1;
 }
 
+.disable-select {
+    -webkit-user-select: none;  
+    -moz-user-select: none;    
+    -ms-user-select: none;      
+    user-select: none;
+}
+
 .output-component-tree {
     white-space: pre-wrap;
 }