react-panel: Remove comments and improve readability in render()

public/app/features/dashboard/dashgrid/QueryInspector.tsx

@@ -74,19 +74,12 @@ export class QueryInspector extends PureComponent<Props, State> {
   };
   };
 
 
   onDataSourceResponse = (response: any = {}) => {
   onDataSourceResponse = (response: any = {}) => {
-    // ignore if closed
-    // if (!this.isOpen) {
-    //   return;
-    // }
-
     if (this.state.isMocking) {
     if (this.state.isMocking) {
       this.handleMocking(response);
       this.handleMocking(response);
       return;
       return;
     }
     }
 
 
-    // this.isLoading = false;
-    // data = _.cloneDeep(data);
-    response = { ...response }; // clone
+    response = { ...response }; // clone - dont modify the response
 
 
     if (response.headers) {
     if (response.headers) {
       delete response.headers;
       delete response.headers;
@@ -109,15 +102,6 @@ export class QueryInspector extends PureComponent<Props, State> {
     if (response.data) {
     if (response.data) {
       response.response = response.data;
       response.response = response.data;
 
 
-      // if (response.status === 200) {
-      //   // if we are in error state, assume we automatically opened
-      //   // and auto close it again
-      //   if (this.hasError) {
-      //     this.hasError = false;
-      //     this.isOpen = false;
-      //   }
-      // }
-
       delete response.data;
       delete response.data;
       delete response.status;
       delete response.status;
       delete response.statusText;
       delete response.statusText;
@@ -175,10 +159,26 @@ export class QueryInspector extends PureComponent<Props, State> {
     }));
     }));
   };
   };
 
 
+  renderExpandCollapse = () => {
+    const { allNodesExpanded } = this.state;
+
+    const collapse = (
+      <>
+        <i className="fa fa-minus-square-o" /> Collapse All
+      </>
+    );
+    const expand = (
+      <>
+        <i className="fa fa-plus-square-o" /> Expand All
+      </>
+    );
+    return allNodesExpanded ? collapse : expand;
+  };
+
   render() {
   render() {
     const { response, isLoading } = this.state.dsQuery;
     const { response, isLoading } = this.state.dsQuery;
     const { LoadingPlaceholder } = this.props;
     const { LoadingPlaceholder } = this.props;
-    const { allNodesExpanded, isMocking } = this.state;
+    const { isMocking } = this.state;
     const openNodes = this.getNrOfOpenNodes();
     const openNodes = this.getNrOfOpenNodes();
 
 
     if (isLoading) {
     if (isLoading) {
@@ -187,23 +187,12 @@ export class QueryInspector extends PureComponent<Props, State> {
 
 
     return (
     return (
       <>
       <>
-        {/* <div className="query-troubleshooter__header">
-        <a className="pointer" ng-click="ctrl.toggleMocking()">Mock Response</a>
-        */}
         <div>
         <div>
           <button className="btn btn-transparent btn-p-x-0 m-r-1" onClick={this.onToggleMocking}>
           <button className="btn btn-transparent btn-p-x-0 m-r-1" onClick={this.onToggleMocking}>
             Mock response
             Mock response
           </button>
           </button>
           <button className="btn btn-transparent btn-p-x-0 m-r-1" onClick={this.onToggleExpand}>
           <button className="btn btn-transparent btn-p-x-0 m-r-1" onClick={this.onToggleExpand}>
-            {allNodesExpanded ? (
-              <>
-                <i className="fa fa-minus-square-o" /> Collapse All
-              </>
-            ) : (
-              <>
-                <i className="fa fa-plus-square-o" /> Expand All
-              </>
-            )}
+            {this.renderExpandCollapse()}
           </button>
           </button>
 
 
           <CopyToClipboard
           <CopyToClipboard