fix standart chart resize in pivot, improve performance

src/views/MainView/Workspace/Tabs/Tab/DataView/Chart/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div ref="chartContainer" class="chart-container">
-    <div v-show="!dataSources && visible" class="warning chart-warning">
+    <div v-show="!dataSources" class="warning chart-warning">
       There is no data to build a chart. Run your SQL query and make sure the
       result is not empty.
     </div>
@@ -9,7 +9,6 @@
       :style="{ height: !dataSources ? 'calc(100% - 40px)' : '100%' }"
     >
       <PlotlyEditor
-        v-show="visible"
         ref="plotlyEditor"
         :data="state.data"
         :layout="state.layout"
@@ -64,7 +63,6 @@ export default {
         displaylogo: false,
         modeBarButtonsToRemove: ['toImage']
       },
-      visible: true,
       resizeObserver: null,
       useResizeHandler: this.$store.state.isWorkspaceVisible
     }
@@ -137,7 +135,7 @@ export default {
     updatePlotly() {
       const plotComponent = this.$refs.plotlyEditor.plotComponentRef.current
       plotComponent.updatePlotly(
-        false, // shouldInvokeResizeHandler
+        true, // shouldInvokeResizeHandler
         plotComponent.props.onUpdate, // figureCallbackFunction
         false // shouldAttachUpdateEvents
       )

src/views/MainView/Workspace/Tabs/Tab/DataView/Pivot/index.vue

@@ -35,6 +35,7 @@ import pivotHelper from './pivotHelper'
 import Chart from '@/views/MainView/Workspace/Tabs/Tab/DataView/Chart'
 import chartHelper from '@/lib/chartHelper'
 import events from '@/lib/utils/events'
+import plotly from 'plotly.js'
 
 export default {
   name: 'Pivot',
@@ -130,17 +131,19 @@ export default {
     // We need to detect resizing because plotly doesn't resize when resize its container
     // but it resize on window.resize (we will trigger it manualy in order to make plotly resize)
     this.resizeObserver = new ResizeObserver(this.handleResize)
-    this.resizeObserver.observe(this.$refs.customChartOutput)
+    this.resizeObserver.observe(this.$refs.pivotOutput)
   },
   beforeUnmount() {
-    this.resizeObserver.unobserve(this.$refs.customChartOutput)
+    this.resizeObserver.unobserve(this.$refs.pivotOutput)
   },
   methods: {
     handleResize() {
       // hack: plotly changes size only on window.resize event,
-      // so, we trigger it when container resizes (e.g. when move splitter)
+      // so, we resize it manually when container resizes (e.g. when move splitter)
       if (this.viewStandartChart) {
-        window.dispatchEvent(new Event('resize'))
+        plotly.Plots.resize(
+          this.$refs.pivotOutput.querySelector('.js-plotly-plot')
+        )
       }
     },
 
@@ -184,9 +187,7 @@ export default {
       )
 
       // fix for Firefox: fit plotly renderers just after choosing it in pivotUi
-      if (this.viewStandartChart) {
-        window.dispatchEvent(new Event('resize'))
-      }
+      this.handleResize()
     },
 
     getOptionsForSave() {

src/views/MainView/Workspace/Tabs/Tab/index.vue

@@ -134,7 +134,6 @@ export default {
       const fromPosition = this.tab.layout[from]
       this.tab.layout[from] = this.tab.layout[to]
       this.tab.layout[to] = fromPosition
-      window.dispatchEvent(new Event('resize'))
 
       events.send('inquiry.panel', null, { panel: to })
     },