From 031ea13fe8948c152b33f75d148c263cbccb18e7 Mon Sep 17 00:00:00 2001
From: Naumov Alexey <Iamemptyhuh@gmail.com>
Date: Thu, 24 Jun 2021 18:37:48 +0300
Subject: [PATCH] refactor(plugin-sql-editor): CB-1060 remove unnecessary
 context usage

---
 .../ExecutionPlan/ExecutionPlanTreeBlock.tsx  | 13 +++++--
 .../ExecutionPlan/NestedNode.tsx              | 11 +-----
 .../ExecutionPlan/QueryPanel.tsx              | 37 -------------------
 3 files changed, 10 insertions(+), 51 deletions(-)
 delete mode 100644 webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/QueryPanel.tsx

diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/ExecutionPlanTreeBlock.tsx b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/ExecutionPlanTreeBlock.tsx
index b8d910864b..281754417c 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/ExecutionPlanTreeBlock.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/ExecutionPlanTreeBlock.tsx
@@ -6,15 +6,13 @@
  * you may not use this file except in compliance with the License.
  */
 
-import { useContext } from 'react';
 import styled, { css } from 'reshadow';
 
 import { Split, Pane, ResizerControls, splitStyles } from '@cloudbeaver/core-blocks';
+import { TextareaNew } from '@cloudbeaver/core-blocks';
 import { composes, useStyles } from '@cloudbeaver/core-theming';
 
 import { ExecutionPlanTree } from './ExecutionPlanTree';
-import { ExecutionPlanTreeContext } from './ExecutionPlanTreeContext';
-import { QueryPanel } from './QueryPanel';
 
 const styles = composes(
   css`
@@ -52,7 +50,14 @@ export const ExecutionPlanTreeBlock: React.FC<Props> = function ExecutionPlanTre
       </Pane>
       <ResizerControls />
       <Pane main>
-        <QueryPanel query={query} />
+        <TextareaNew
+          className={className}
+          name='value'
+          rows={3}
+          value={query}
+          readOnly
+          embedded
+        />
       </Pane>
     </Split>
   );
diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/NestedNode.tsx b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/NestedNode.tsx
index 3ffe93bb53..a4c5c2243a 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/NestedNode.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/NestedNode.tsx
@@ -10,7 +10,6 @@ import { useCallback, useContext, useState } from 'react';
 import styled, { css } from 'reshadow';
 
 import { TableItem, TableColumnValue } from '@cloudbeaver/core-blocks';
-import type { ObjectPropertyInfo } from '@cloudbeaver/core-sdk';
 import { useStyles } from '@cloudbeaver/core-theming';
 
 import { ExecutionPlanTreeContext, IExecutionPlanNode } from './ExecutionPlanTreeContext';
@@ -49,14 +48,6 @@ export const NestedNode: React.FC<Props> = function NestedNode({ node, depth, cl
     throw new Error('Tree context must be provided');
   }
 
-  const getValue = useCallback((property: ObjectPropertyInfo | undefined) => {
-    if (!property || !treeContext.columns.find(column => column.id === property.id)) {
-      return '';
-    }
-
-    return getPropertyValue(property);
-  }, [treeContext.columns]);
-
   const expand = useCallback((event: React.MouseEvent<any, MouseEvent>) => {
     event.stopPropagation();
     setExpanded(prev => !prev);
@@ -69,7 +60,7 @@ export const NestedNode: React.FC<Props> = function NestedNode({ node, depth, cl
       <TableItem key={`${node.id}_${depth}`} className={className} item={node.id}>
         {treeContext.columns.map((column, idx) => {
           const property = node.properties.find(property => property.id === column.id);
-          const value = getValue(property);
+          const value = property ? getPropertyValue(property) : '';
           return (
             <TableColumnValue key={`${property?.id}_${depth}`} title={value}>
               <control>
diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/QueryPanel.tsx b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/QueryPanel.tsx
deleted file mode 100644
index ba4b160616..0000000000
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/ExecutionPlan/QueryPanel.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-/*
- * CloudBeaver - Cloud Database Manager
- * Copyright (C) 2020-2021 DBeaver Corp and others
- *
- * Licensed under the Apache License, Version 2.0.
- * you may not use this file except in compliance with the License.
- */
-
-import { useContext } from 'react';
-
-import { TextareaNew } from '@cloudbeaver/core-blocks';
-
-import { ExecutionPlanTreeContext } from './ExecutionPlanTreeContext';
-
-interface Props {
-  query: string;
-  className?: string;
-}
-
-export const QueryPanel: React.FC<Props> = function QueryPanel({ className, query }) {
-  const treeContext = useContext(ExecutionPlanTreeContext);
-
-  if (!treeContext) {
-    throw new Error('Tree context must be provided');
-  }
-
-  return (
-    <TextareaNew
-      className={className}
-      name='value'
-      rows={3}
-      value={query}
-      readOnly
-      embedded
-    />
-  );
-};