Prechádzať zdrojové kódy

[frontend] CVE - remove d3 dependency and unused performanceGraph KO component

dependabot[bot] 3 rokov pred
rodič
commit
fefebda01d

+ 2 - 6
apps/jobbrowser/src/jobbrowser/templates/job_browser.mako

@@ -1517,12 +1517,8 @@ ${ commonheader("Job Browser", "jobbrowser", user, request) | n,unicode }
         <div class="tab-content">
           <div class="tab-pane active" id="servicesLoad">
             <div class="wxm-poc" style="clear: both;">
-              <div style="float:left; margin-right: 10px; margin-bottom: 10px;">
-                % if PROMETHEUS.API_URL.get():
-                <!-- ko component: { name: 'performance-graph', params: { clusterName: name(), type: 'cpu' } } --><!-- /ko -->
-                % else:
-                  ${ _("Metrics are not setup") }
-                % endif
+              <div style="float:left; margin-right: 10px; margin-bottom: 10px;">                
+                ${ _("Metrics are not setup") }
               </div>
             </div>
           </div>

+ 0 - 2
desktop/core/src/desktop/js/hue.js

@@ -22,7 +22,6 @@ import $ from 'jquery/jquery.common';
 import 'ext/bootstrap.2.3.2.min';
 import 'ext/bootstrap-editable.1.5.1.min';
 import 'utils/d3Extensions';
-import * as d3 from 'd3';
 import d3v3 from 'd3v3';
 import Dropzone from 'dropzone';
 import filesize from 'filesize';
@@ -84,7 +83,6 @@ window.apiHelper = apiHelper;
 window.simpleGet = simpleGet;
 window.CancellableJqPromise = CancellableJqPromise;
 window.contextCatalog = contextCatalog;
-window.d3 = d3;
 window.d3v3 = d3v3;
 window.dataCatalog = dataCatalog;
 window.DOCUMENT_TYPE_I18n = DOCUMENT_TYPE_I18n;

+ 0 - 26
desktop/core/src/desktop/js/ko/components/__snapshots__/ko.performanceGraph.test.js.snap

@@ -1,26 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ko.performanceGraph.js should render component 1`] = `
-"<div data-bind=\\"descendantsComplete: descendantsComplete, component: { name: &quot;performance-graph&quot;, params: params }\\"><script type=\\"text/html\\" id=\\"performance-graph-d3-template\\">
-  <div style=\\"position:relative;\\"
-      data-bind=\\"attr: { 'id': id }, style: { height: graphHeight + 'px', width: graphWidth + 'px' }\\"></div>
-</script><div style=\\"position: relative\\" data-bind=\\"template: { afterRender: componentRendered }\\">
-  <div style=\\"padding: 10px; float: right;\\" data-bind=\\"foreach: availableGranularities\\">
-    <!-- ko if: $data === $parent.selectedGranularity() -->
-    <span class=\\"margin-right-20\\" data-bind=\\"text: label\\">1 hour</span>
-    <!-- /ko -->
-    <!-- ko if: $data !== $parent.selectedGranularity() --><!-- /ko -->
-  
-    <!-- ko if: $data === $parent.selectedGranularity() --><!-- /ko -->
-    <!-- ko if: $data !== $parent.selectedGranularity() -->
-    <a class=\\"margin-right-20\\" href=\\"javascript: void(0);\\" data-bind=\\"text: label, click: function () { $parent.selectedGranularity($data); }\\">8 hours</a>
-    <!-- /ko -->
-  
-    <!-- ko if: $data === $parent.selectedGranularity() --><!-- /ko -->
-    <!-- ko if: $data !== $parent.selectedGranularity() -->
-    <a class=\\"margin-right-20\\" href=\\"javascript: void(0);\\" data-bind=\\"text: label, click: function () { $parent.selectedGranularity($data); }\\">1 week</a>
-    <!-- /ko -->
-  </div>
-  <div style=\\"clear: both; height: 500px; width: 1000px;\\" class=\\"performance-graph\\" data-bind=\\"style: { height: graphHeight + 'px', width: graphWidth + 'px' }\\"><svg width=\\"1000\\" height=\\"500\\"><text class=\\"loading-text\\" text-anchor=\\"middle\\" dy=\\"250\\" dx=\\"500\\">Loading metrics...</text></svg></div>
-</div></div>"
-`;

+ 0 - 781
desktop/core/src/desktop/js/ko/components/ko.performanceGraph.js

@@ -1,781 +0,0 @@
-// Licensed to Cloudera, Inc. under one
-// or more contributor license agreements.  See the NOTICE file
-// distributed with this work for additional information
-// regarding copyright ownership.  Cloudera, Inc. licenses this file
-// to you under the Apache License, Version 2.0 (the
-// "License"); you may not use this file except in compliance
-// with the License.  You may obtain a copy of the License at
-//
-//     http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-
-import * as d3 from 'd3';
-import * as ko from 'knockout';
-
-import componentUtils from './componentUtils';
-import apiHelper from 'api/apiHelper';
-import I18n from 'utils/i18n';
-import { getFromLocalStorage, setInLocalStorage } from 'utils/storageUtils';
-
-export const NAME = 'performance-graph';
-
-const TEMPLATE = `
-<script type="text/html" id="performance-graph-d3-template">
-  <div style="position:relative;"
-      data-bind="attr: { 'id': id }, style: { height: graphHeight + 'px', width: graphWidth + 'px' }"></div>
-</script>
-
-<div style="position: relative" data-bind="template: { afterRender: componentRendered }">
-  <div style="padding: 10px; float: right;" data-bind="foreach: availableGranularities">
-    <!-- ko if: $data === $parent.selectedGranularity() -->
-    <span class="margin-right-20" data-bind="text: label"></span>
-    <!-- /ko -->
-    <!-- ko if: $data !== $parent.selectedGranularity() -->
-    <a class="margin-right-20" href="javascript: void(0);" data-bind="text: label, click: function () { $parent.selectedGranularity($data); }"></a>
-    <!-- /ko -->
-  </div>
-  <div style="clear: both;" class="performance-graph" data-bind="style: { height: graphHeight + 'px', width: graphWidth + 'px' }"></div>
-</div>
-`;
-
-class PerformanceGraph {
-  constructor(params) {
-    const self = this;
-
-    self.graphHeight = 500;
-    self.graphWidth = 1000;
-
-    self.data = undefined;
-    self.graphElement = undefined;
-
-    self.availableGranularities = [
-      {
-        label: I18n('1 hour'),
-        totalTime: 1000 * 60 * 60,
-        initialWindow: 1000 * 60 * 10,
-        step: 5 * 1000 // 5 seconds
-      },
-      {
-        label: I18n('8 hours'),
-        totalTime: 1000 * 60 * 60 * 8,
-        initialWindow: 1000 * 60 * 60 * 2,
-        step: 15 * 1000 // 15 seconds
-      },
-      {
-        label: I18n('1 week'),
-        totalTime: 1000 * 60 * 60 * 24 * 7,
-        initialWindow: 1000 * 60 * 60 * 24,
-        step: 5 * 60 * 1000 // Every 5 minutes
-      }
-    ];
-
-    self.selectedGranularity = ko.observable(
-      self.availableGranularities[getFromLocalStorage('warehouses.performanceGraphGranularity', 0)]
-    );
-    self.clusterName = ko.observable(params.clusterName);
-
-    // Load the initial data
-    const initialLoadPromise = self.loadData();
-    self.appendTimeout = -1;
-
-    self.componentRendered = function (elements) {
-      elements.some(element => {
-        if (element.className === 'performance-graph') {
-          self.graphElement = element;
-          return true;
-        }
-      });
-
-      if (!self.data || !self.data.length) {
-        self.showLoadingMessage();
-      }
-
-      initialLoadPromise.done(() => {
-        self.redrawGraph();
-        self.selectedGranularity.subscribe(granularity => {
-          for (let i = 0; i < self.availableGranularities.length; i++) {
-            if (granularity === self.availableGranularities[i]) {
-              setInLocalStorage('warehouses.performanceGraphGranularity', i);
-              break;
-            }
-          }
-          window.clearTimeout(self.appendTimeout);
-          self.data = undefined;
-          self.loadData().done(() => {
-            self.redrawGraph();
-          });
-        });
-      });
-    };
-  }
-
-  showLoadingMessage() {
-    const self = this;
-
-    d3.select(self.graphElement).select('svg').remove();
-
-    const svg = d3
-      .select(self.graphElement)
-      .append('svg')
-      .attr('width', self.graphWidth)
-      .attr('height', self.graphHeight);
-
-    svg
-      .selectAll('.loading-text')
-      .data([I18n('Loading metrics...')])
-      .enter()
-      .append('text', 'rect')
-      .attr('class', 'loading-text')
-      .text(d => {
-        return d;
-      })
-      .attr('text-anchor', 'middle')
-      .attr('dy', self.graphHeight / 2)
-      .attr('dx', self.graphWidth / 2);
-  }
-
-  redrawGraph() {
-    const self = this;
-
-    // Wait for data to appear
-    if (!self.data.length) {
-      self.showLoadingMessage();
-
-      window.setTimeout(() => {
-        self.loadData().done(() => {
-          self.redrawGraph();
-        });
-      }, 3000);
-      return;
-    }
-
-    // Margins and sizes
-    const subTop = self.graphHeight - 150;
-    const legendTop = self.graphHeight - 50;
-
-    const mainMargin = { top: 10, right: 70, left: 70, bottom: self.graphHeight - subTop + 40 };
-    const subMargin = { top: subTop, right: 70, bottom: 40, left: 70 };
-    const legendMargin = { top: legendTop, right: 70, bottom: 10, left: 70 };
-
-    const width = self.graphWidth - mainMargin.left - mainMargin.right;
-    const mainHeight = self.graphHeight - mainMargin.top - mainMargin.bottom;
-    const subHeight = self.graphHeight - subMargin.top - subMargin.bottom - 50;
-
-    // Scales
-    const percentageYScale = d3.scaleLinear().range([mainHeight, 0]);
-    const queryYScale = d3.scaleLinear().range([mainHeight, 0]);
-    const mainXScale = d3.scaleTime().range([0, width]);
-    const subPercentageYScale = d3.scaleLinear().range([subHeight, 0]);
-    const subQueryYScale = d3.scaleLinear().range([subHeight, 0]);
-    const subXScale = d3.scaleTime().range([0, width]);
-
-    // Axes
-    const mainXAxis = d3.axisBottom(mainXScale).tickPadding(7);
-    const subXAxis = d3.axisBottom(subXScale).tickPadding(7).tickSize(0);
-
-    const queryYAxis = d3.axisLeft(queryYScale).tickPadding(7);
-    const percentageYAxis = d3
-      .axisRight(percentageYScale)
-      .tickPadding(7)
-      .tickFormat(y => {
-        return y + '%';
-      });
-
-    // Update scale domains from data
-    mainXScale.domain([self.data[0][0], self.data[self.data.length - 1][0]]);
-    percentageYScale.domain([0, 100]);
-    let queryMax = 15;
-    self.data.forEach(row => {
-      if (row[4] + row[5] > queryMax) {
-        queryMax = row[4] + row[5];
-      }
-    });
-    queryYScale.domain([0, queryMax + 2]);
-
-    subXScale.domain(mainXScale.domain());
-    subPercentageYScale.domain(percentageYScale.domain());
-    subQueryYScale.domain(queryYScale.domain());
-
-    d3.select(self.graphElement).select('svg').remove();
-
-    // Draw the graphs
-    const svg = d3
-      .select(self.graphElement)
-      .append('svg')
-      .attr('width', self.graphWidth)
-      .attr('height', self.graphHeight);
-
-    // Clipping path
-    svg
-      .append('defs')
-      .append('clipPath')
-      .attr('id', 'clip')
-      .append('rect')
-      .attr('width', width)
-      .attr('height', mainHeight);
-
-    // Containers for the graphs and legend
-    const mainGroup = svg
-      .append('g')
-      .attr('class', 'main-group')
-      .attr('transform', 'translate(' + mainMargin.left + ',' + mainMargin.top + ')');
-
-    const subGroup = svg
-      .append('g')
-      .attr('class', 'sub-group')
-      .attr('transform', 'translate(' + subMargin.left + ',' + subMargin.top + ')');
-
-    const legendGroup = svg
-      .append('g')
-      .attr('class', 'legend-group')
-      .attr('transform', 'translate(' + legendMargin.left + ',' + legendMargin.top + ')');
-
-    // Draw the query and resource graphs
-    const createLineGraph = function (options) {
-      let line;
-      let enabled = options.enabled;
-      if (options.area) {
-        line = d3
-          .area()
-          .curve(d3.curveStep)
-          .x(d => {
-            return mainXScale(d[0]);
-          })
-          .y0(mainHeight)
-          .y1(options.y);
-      } else {
-        line = d3
-          .line()
-          .curve(d3.curveMonotoneX)
-          .x(d => {
-            return mainXScale(d[0]);
-          })
-          .y(options.y);
-      }
-
-      const path = mainGroup
-        .append('path')
-        .datum(self.data)
-        .attr('stroke', () => {
-          return options.color;
-        })
-        .attr('stroke-width', options.area ? 0 : 2)
-        .style('opacity', enabled ? 1 : 0)
-        .attr('fill', options.area ? options.color : 'none')
-        .attr('clip-path', 'url(#clip)')
-        .classed('line line-' + options.id, true)
-        .attr('d', line);
-
-      let subRefresh;
-      if (options.subLine) {
-        let subLine;
-        if (options.area) {
-          subLine = d3
-            .area()
-            .curve(d3.curveStep)
-            .x(d => {
-              return subXScale(d[0]);
-            })
-            .y0(subHeight)
-            .y1(options.subY);
-        } else {
-          subLine = d3
-            .line()
-            .curve(d3.curveMonotoneX)
-            .x(d => {
-              return subXScale(d[0]);
-            })
-            .y(options.subY);
-        }
-        const subPath = subGroup
-          .append('path')
-          .datum(self.data)
-          .attr('stroke', () => {
-            return options.subLineColor || options.color;
-          })
-          .style('opacity', enabled ? 1 : 0)
-          .attr('fill', options.area ? options.subLineColor || options.color : 'none')
-          .attr('clip-path', 'url(#clip)')
-          .classed('line line-' + options.id, true)
-          .attr('d', subLine);
-        subRefresh = function () {
-          subPath.datum(self.data);
-          subPath.attr('d', subLine);
-        };
-      }
-
-      let stackedGraph;
-      if (options.stackedGraph) {
-        stackedGraph = options.stackedGraph();
-      }
-
-      return {
-        refresh: function () {
-          path.datum(self.data);
-          path.attr('d', line);
-          if (subRefresh) {
-            subRefresh();
-          }
-          if (stackedGraph) {
-            stackedGraph.refresh();
-          }
-        },
-        id: options.id,
-        enabled: function () {
-          return enabled;
-        },
-        color: options.color,
-        label: options.label,
-        tooltip: options.tooltip,
-        toggle: function () {
-          enabled = !enabled;
-          setInLocalStorage('warehouses.' + options.id + 'GraphEnabled', enabled);
-          mainGroup
-            .select('.highlight-point-' + options.id)
-            .style('display', enabled ? null : 'none');
-          mainGroup
-            .select('.line-' + options.id)
-            .transition()
-            .style('opacity', enabled ? 1 : 0);
-          subGroup
-            .select('.line-' + options.id)
-            .transition()
-            .style('opacity', enabled ? 1 : 0);
-          if (stackedGraph) {
-            stackedGraph.enabled = enabled;
-            mainGroup
-              .select('.highlight-point-' + stackedGraph.id)
-              .style('display', enabled ? null : 'none');
-            mainGroup
-              .select('.line-' + stackedGraph.id)
-              .transition()
-              .style('opacity', enabled ? 1 : 0);
-            subGroup
-              .select('.line-' + stackedGraph.id)
-              .transition()
-              .style('opacity', enabled ? 1 : 0);
-          }
-        },
-        highlightPoint: function (dataPoint) {
-          if (!options.disableHighlight) {
-            mainGroup.select('.highlight-point-' + options.id).remove();
-
-            mainGroup
-              .insert('circle', '.overlay')
-              .attr('class', 'highlight-point highlight-point-' + options.id)
-              .style('display', enabled ? null : 'none')
-              .attr('stroke', '#FFF')
-              .attr('stroke-width', 2)
-              .attr('fill', () => {
-                return options.color;
-              })
-              .attr('r', 4)
-              .attr(
-                'transform',
-                'translate(' + mainXScale(dataPoint[0]) + ',' + options.y(dataPoint) + ')'
-              );
-          }
-        }
-      };
-    };
-
-    const graphs = [
-      createLineGraph({
-        id: 'queries',
-        label: I18n('Queries'),
-        enabled: getFromLocalStorage('warehouses.queriesGraphEnabled', true),
-        color: '#A9DBF1',
-        subLineColor: '#DCDCDC',
-        area: true,
-        subLine: true,
-        tooltip: function (d) {
-          return d[4] + (d[5] ? ' (' + d[5] + ' ' + I18n('queued') : '');
-        },
-        y: function (d) {
-          return queryYScale(d[4]);
-        },
-        subY: function (d) {
-          return subQueryYScale(d[4]);
-        },
-        stackedGraph: function () {
-          return createLineGraph({
-            id: 'query-count-queued',
-            enabled: true,
-            color: '#0B7FAD',
-            area: true,
-            disableHighlight: true,
-            y: function (d) {
-              return queryYScale(d[5]);
-            }
-          });
-        }
-      }),
-      createLineGraph({
-        id: 'cpu',
-        enabled: getFromLocalStorage('warehouses.cpuGraphEnabled', false),
-        label: I18n('CPU'),
-        color: '#654C94',
-        subLine: true,
-        tooltip: function (d) {
-          return d[1] + '%';
-        },
-        y: function (d) {
-          return percentageYScale(d[1]);
-        },
-        subY: function (d) {
-          return subPercentageYScale(d[1]);
-        }
-      }),
-      createLineGraph({
-        id: 'memory',
-        enabled: getFromLocalStorage('warehouses.memoryGraphEnabled', false),
-        label: I18n('Memory'),
-        color: '#83C1B9',
-        subLine: true,
-        tooltip: function (d) {
-          return d[2] + '%';
-        },
-        y: function (d) {
-          return percentageYScale(d[2]);
-        },
-        subY: function (d) {
-          return subPercentageYScale(d[2]);
-        }
-      }),
-      createLineGraph({
-        id: 'io',
-        enabled: getFromLocalStorage('warehouses.ioGraphEnabled', false),
-        label: I18n('IO'),
-        color: '#D4965E',
-        subLine: true,
-        tooltip: function (d) {
-          return d[3] + '%';
-        },
-        y: function (d) {
-          return percentageYScale(d[3]);
-        },
-        subY: function (d) {
-          return subPercentageYScale(d[3]);
-        }
-      })
-    ];
-
-    // Draw the axes
-    mainGroup
-      .append('g')
-      .attr('class', 'main-axis main-axis-x')
-      .attr('transform', 'translate(0,' + mainHeight + ')')
-      .call(mainXAxis);
-
-    mainGroup
-      .append('g')
-      .attr('class', 'main-axis main-axis-y main-axis-query-count')
-      .call(queryYAxis);
-
-    mainGroup
-      .append('g')
-      .attr('class', 'main-axis main-axis-y main-axis-percentage')
-      .attr('transform', 'translate(' + width + ' ,0)')
-      .call(percentageYAxis);
-
-    subGroup
-      .append('g')
-      .attr('class', 'sub-axis sub-axis-x')
-      .attr('transform', 'translate(0,' + subHeight + ')')
-      .call(subXAxis);
-
-    mainGroup
-      .append('text')
-      .attr('class', 'y-label y-label-queries')
-      .attr('transform', 'rotate(-90)')
-      .attr('x', -mainHeight / 2)
-      .attr('y', -45)
-      .attr('dy', '1em')
-      .style('text-anchor', 'middle');
-
-    mainGroup
-      .append('text')
-      .attr('class', 'y-label y-label-resources')
-      .attr('transform', 'rotate(90)')
-      .attr('x', mainHeight / 2)
-      .attr('y', -width - 55)
-      .attr('dy', '1em')
-      .style('text-anchor', 'middle');
-
-    const updateAxesLabels = function () {
-      let queriesLabel = '';
-      let resourcesLabel = '';
-      for (let i = 0; i < graphs.length; i++) {
-        if (i === 0 && graphs[i].enabled()) {
-          queriesLabel = graphs[i].label;
-        } else if (graphs[i].enabled()) {
-          if (resourcesLabel !== '') {
-            resourcesLabel += ' ';
-          }
-          resourcesLabel += graphs[i].label;
-        }
-      }
-      mainGroup.select('.y-label-queries').text(queriesLabel);
-      mainGroup.select('.y-label-resources').text(resourcesLabel);
-      mainGroup
-        .select('.main-axis-query-count')
-        .attr('display', queriesLabel === '' ? 'none' : null);
-      mainGroup
-        .select('.main-axis-percentage')
-        .attr('display', resourcesLabel === '' ? 'none' : null);
-    };
-
-    updateAxesLabels();
-
-    // Add brush
-    const brushed = function () {
-      const s = d3.event.selection || subXScale.range();
-      mainXScale.domain(s.map(subXScale.invert, subXScale));
-
-      graphs.forEach(graph => {
-        graph.refresh();
-      });
-
-      mainGroup.select('.main-axis-x').call(mainXAxis);
-
-      handle.attr('transform', (d, i) => {
-        return 'translate(' + s[i] + ',' + subHeight / 2 + ')';
-      });
-    };
-
-    const brush = d3
-      .brushX()
-      .extent([
-        [0, 0],
-        [width, subHeight]
-      ])
-      .on('start brush end', brushed);
-
-    const brushG = subGroup.append('g').attr('class', 'brush').call(brush);
-
-    const handle = brushG
-      .selectAll('.handle--custom')
-      .data([{ type: 'w' }, { type: 'e' }])
-      .enter()
-      .append('circle')
-      .classed('handle--custom', true)
-      .attr('cursor', 'ew-resize')
-      .attr('fill', '#FFF')
-      .attr('r', 8)
-      .attr('stroke', '#787878')
-      .attr('stroke-width', 7);
-
-    brushG.call(brush.move, [
-      mainXScale(
-        Math.max(
-          self.data[self.data.length - 1][0] - self.selectedGranularity().initialWindow,
-          self.data[0][0]
-        )
-      ),
-      mainXScale(self.data[self.data.length - 1][0])
-    ]);
-
-    // Mouse hover overlay
-    const dateBisector = d3.bisector(d => {
-      return d[0];
-    }).left;
-
-    const pointFocus = function (mouseCoord, focusX) {
-      const x = focusX;
-      const j = dateBisector(self.data, x, 1);
-      const d0 = self.data[j - 1];
-      const d1 = self.data[j];
-      const closest = x - d0[0] > d1[0] - x ? d1 : d0;
-
-      graphs.forEach(graph => {
-        graph.highlightPoint(closest);
-      });
-
-      const generateTooltipHtml = function (dataPoint) {
-        let html =
-          '<div class="performance-tooltip-time">' + moment(dataPoint[0]).toISOString() + '</div>';
-        graphs.forEach(graph => {
-          if (graph.tooltip && graph.enabled()) {
-            html +=
-              '<div><div class="performance-tooltip-indicator"><div style="background-color: ' +
-              graph.color +
-              '">&nbsp;</div></div><span class="performance-tooltip-label">' +
-              graph.label +
-              '</span> ' +
-              graph.tooltip(dataPoint) +
-              '</div>';
-          }
-        });
-        return html;
-      };
-
-      d3.select(self.graphElement)
-        .select('.performance-tooltip')
-        .html(generateTooltipHtml(closest))
-        .style('left', lastMouseCoord[0] + mainMargin.left + 15 + 'px')
-        .style('top', lastMouseCoord[1] + mainMargin.top + 'px');
-    };
-
-    let lastMouseCoord = [0, 0];
-    let lastFocusX = 0;
-    mainGroup
-      .append('rect')
-      .attr('class', 'overlay')
-      .attr('fill-opacity', '0')
-      .attr('fill', 'white')
-      .attr('width', width)
-      .attr('height', mainHeight)
-      .on('mouseout', () => {
-        mainGroup.selectAll('.highlight-point').remove();
-        d3.select(self.graphElement).selectAll('.performance-tooltip').remove();
-      })
-      .on('mouseover', () => {
-        d3.select(self.graphElement).append('div').attr('class', 'performance-tooltip');
-      })
-      .on('mousemove', function () {
-        lastMouseCoord = d3.mouse(this);
-        lastFocusX = mainXScale.invert(lastMouseCoord[0]);
-        pointFocus(lastMouseCoord, lastFocusX);
-      });
-
-    // Add Legend
-    const legendSerie = legendGroup
-      .selectAll('.legend-serie')
-      .data(graphs)
-      .enter()
-      .append('g')
-      .attr('class', 'legend-serie')
-      .on('click', function (d) {
-        d.toggle();
-        d3.select(this)
-          .select('rect')
-          .transition()
-          .attr('fill', d => {
-            return d.enabled() ? d.color : '#FFF';
-          });
-        d3.select(this)
-          .select('path')
-          .transition()
-          .attr('opacity', d => {
-            return d.enabled() ? 1 : 0;
-          });
-        updateAxesLabels();
-      });
-
-    legendSerie
-      .append('rect')
-      .attr('class', 'legend-radio')
-      .attr('fill', d => {
-        return d.enabled() ? d.color : '#FFF';
-      })
-      .attr('stroke', d => {
-        return d.color;
-      })
-      .attr('stroke-width', 2)
-      .attr('rx', 2)
-      .attr('ry', 2)
-      .attr('width', 12)
-      .attr('height', 12)
-      .attr('transform', 'translate(-8, -6)');
-
-    legendSerie
-      .append('path')
-      .attr('d', 'M-6,-1, -2,3, 2,-4')
-      .attr('fill', 'none')
-      .attr('stroke', (d, j) => {
-        return j === 0 || j === 2 ? '#000' : '#FFF';
-      })
-      .transition()
-      .attr('opacity', d => {
-        return d.enabled() ? 1 : 0;
-      })
-      .attr('stroke-width', 2);
-
-    legendSerie
-      .append('text', 'rect')
-      .text(d => {
-        return d.label;
-      })
-      .attr('text-anchor', 'start')
-      .attr('dy', '.32em')
-      .attr('dx', '8');
-
-    legendSerie.append('line');
-
-    const knownLengths = [];
-
-    legendSerie.attr('transform', function (d, j) {
-      knownLengths[j] = d3.select(this).select('text').node().getComputedTextLength() + 28;
-      let x = 5;
-      for (let i = 0; i < j; i++) {
-        x += knownLengths[i];
-      }
-      return 'translate(' + x + ', 5)';
-    });
-
-    // Fetch and append data at set interval
-    const appendData = function () {
-      const currentDomain = mainXScale.domain();
-      const currentSubDomain = subXScale.domain();
-
-      const timeBetweenPoints = self.data[1][0] - self.data[0][0];
-      const startTime = self.data[self.data.length - 1][0];
-      const endTime = startTime + timeBetweenPoints;
-      self.loadData(startTime, endTime, 1).done(() => {
-        const mainStart =
-          currentDomain[0].getTime() !== currentSubDomain[0].getTime()
-            ? currentDomain[0]
-            : self.data[0][0];
-        const mainEnd =
-          currentDomain[1].getTime() !== currentSubDomain[1].getTime()
-            ? currentDomain[1]
-            : self.data[self.data.length - 1][0];
-        mainXScale.domain([mainStart, mainEnd]);
-        subXScale.domain([self.data[0][0], self.data[self.data.length - 1][0]]);
-
-        graphs.forEach(graph => {
-          graph.refresh();
-        });
-
-        // Update highlight points and tip if data is appended when highlight is active
-        if (mainGroup.selectAll('.highlight-point').size()) {
-          pointFocus(lastMouseCoord, lastFocusX);
-        }
-
-        subGroup.select('.sub-axis-x').call(subXAxis);
-        mainGroup.select('.main-axis-x').call(mainXAxis);
-        subGroup.select('.brush').call(brush);
-
-        self.appendTimeout = window.setTimeout(appendData, self.selectedGranularity().step);
-      });
-    };
-    self.appendTimeout = window.setTimeout(appendData, self.selectedGranularity().step);
-  }
-
-  loadData() {
-    const self = this;
-    return apiHelper
-      .fetchResourceStats({
-        clusterName: self.clusterName(),
-        pastMs: self.selectedGranularity().totalTime,
-        stepMs: self.selectedGranularity().step
-      })
-      .done(data => {
-        self.data = data;
-      });
-  }
-
-  dispose() {
-    const self = this;
-    if (self.appendTimeout) {
-      window.clearTimeout(self.appendTimeout);
-    }
-  }
-}
-
-componentUtils.registerComponent(NAME, PerformanceGraph, TEMPLATE);

+ 0 - 35
desktop/core/src/desktop/js/ko/components/ko.performanceGraph.test.js

@@ -1,35 +0,0 @@
-// Licensed to Cloudera, Inc. under one
-// or more contributor license agreements.  See the NOTICE file
-// distributed with this work for additional information
-// regarding copyright ownership.  Cloudera, Inc. licenses this file
-// to you under the Apache License, Version 2.0 (the
-// "License"); you may not use this file except in compliance
-// with the License.  You may obtain a copy of the License at
-//
-//     http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-
-import $ from 'jquery';
-
-import ApiHelper from 'api/apiHelper';
-import { koSetup } from 'jest/koTestUtils';
-import { NAME } from './ko.performanceGraph';
-
-describe('ko.performanceGraph.js', () => {
-  const setup = koSetup();
-
-  it('should render component', async () => {
-    jest
-      .spyOn(ApiHelper, 'fetchResourceStats')
-      .mockImplementation(() => $.Deferred().reject().promise());
-
-    const element = await setup.renderComponent(NAME, {});
-
-    expect(element.innerHTML).toMatchSnapshot();
-  });
-});

+ 0 - 1
desktop/core/src/desktop/js/ko/ko.all.js

@@ -164,7 +164,6 @@ import 'ko/components/ko.inlineAutocomplete';
 import 'ko/components/ko.jobBrowserLinks';
 import 'ko/components/ko.navProperties';
 import 'ko/components/ko.navTags';
-import 'ko/components/ko.performanceGraph';
 import 'ko/components/ko.pollingCatalogEntriesList';
 import 'ko/components/ko.quickQueryAction';
 import 'ko/components/ko.sentryPrivileges';

+ 0 - 82
desktop/core/src/desktop/static/desktop/less/components/hue-performance-graph.less

@@ -1,82 +0,0 @@
-/*
- Licensed to Cloudera, Inc. under one
- or more contributor license agreements.  See the NOTICE file
- distributed with this work for additional information
- regarding copyright ownership.  Cloudera, Inc. licenses this file
- to you under the Apache License, Version 2.0 (the
- "License"); you may not use this file except in compliance
- with the License.  You may obtain a copy of the License at
-
-     http://www.apache.org/licenses/LICENSE-2.0
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
-*/
-
-.performance-graph {
-  position: relative;
-
-  h3 {
-    font-size: 34px;
-    font-weight: 300;
-  }
-
-  .performance-tooltip {
-    border-radius: 3px;
-    position: absolute;
-    padding: 3px;
-    font: 10px @font-family-sans-serif;
-    background: rgba(240, 240, 240, 0.9);
-    pointer-events: none;
-  }
-
-  .performance-tooltip > div {
-    margin: 1px 0;
-  }
-
-  .performance-tooltip .performance-tooltip-label {
-    font-weight: 800;
-  }
-
-  .performance-tooltip .performance-tooltip-indicator {
-    padding-top: 3px;
-    width: 6px;
-    height: 8px;
-    margin-right: 3px;
-    display: inline-block;
-  }
-
-  .performance-tooltip .performance-tooltip-time {
-    color: @cui-blue-gray-700;
-  }
-
-  svg {
-    .nvtooltip {
-      font-family: @font-family-sans-serif;
-    }
-
-    text {
-      font: 400 12px @font-family-sans-serif;
-    }
-
-    .title {
-      font: 700 14px @font-family-sans-serif;
-    }
-
-    .brush .selection {
-      stroke: none;
-      fill: @cui-gray-400;
-      fill-opacity: 0.25;
-      shape-rendering: crispEdges;
-    }
-
-    .y-label {
-      font-size: 10px;
-      fill: @cui-gray-800;
-      word-spacing: 10px;
-    }
-  }
-}

+ 0 - 1
desktop/core/src/desktop/static/desktop/less/hue-cross-version.less

@@ -28,7 +28,6 @@
 @import "components/hue-link-sharing.less";
 @import "components/hue-nav-properties.less";
 @import "components/hue-notify.less";
-@import "components/hue-performance-graph.less";
 @import "components/hue-popover.less";
 @import "components/hue-qq-upload.less";
 @import "components/hue-query-builder.less";

+ 6 - 564
package-lock.json

@@ -16,7 +16,6 @@
         "babel-preset-react-app": "^3.1.2",
         "clipboard": "1.7.1",
         "core-js": "3.19.1",
-        "d3": "5.7.0",
         "d3v3": "1.0.3",
         "dropzone": "5.5.1",
         "file-saver": "^2.0.2",
@@ -6513,286 +6512,6 @@
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.17.tgz",
       "integrity": "sha512-u1wmTI1jJGzCJzWndZo8mk4wnPTZd1eOIYTYvuEyOQGfmDl3TrabCCfKnOC86FZwW/9djqTl933UF/cS425i9A=="
     },
-    "node_modules/d3": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-5.7.0.tgz",
-      "integrity": "sha512-8KEIfx+dFm8PlbJN9PI0suazrZ41QcaAufsKE9PRcqYPWLngHIyWJZX96n6IQKePGgeSu0l7rtlueSSNq8Zc3g==",
-      "dependencies": {
-        "d3-array": "1",
-        "d3-axis": "1",
-        "d3-brush": "1",
-        "d3-chord": "1",
-        "d3-collection": "1",
-        "d3-color": "1",
-        "d3-contour": "1",
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-dsv": "1",
-        "d3-ease": "1",
-        "d3-fetch": "1",
-        "d3-force": "1",
-        "d3-format": "1",
-        "d3-geo": "1",
-        "d3-hierarchy": "1",
-        "d3-interpolate": "1",
-        "d3-path": "1",
-        "d3-polygon": "1",
-        "d3-quadtree": "1",
-        "d3-random": "1",
-        "d3-scale": "2",
-        "d3-scale-chromatic": "1",
-        "d3-selection": "1",
-        "d3-shape": "1",
-        "d3-time": "1",
-        "d3-time-format": "2",
-        "d3-timer": "1",
-        "d3-transition": "1",
-        "d3-voronoi": "1",
-        "d3-zoom": "1"
-      }
-    },
-    "node_modules/d3-array": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz",
-      "integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw=="
-    },
-    "node_modules/d3-axis": {
-      "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-1.0.12.tgz",
-      "integrity": "sha512-ejINPfPSNdGFKEOAtnBtdkpr24c4d4jsei6Lg98mxf424ivoDP2956/5HDpIAtmHo85lqT4pruy+zEgvRUBqaQ=="
-    },
-    "node_modules/d3-brush": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/d3-brush/-/d3-brush-1.1.6.tgz",
-      "integrity": "sha512-7RW+w7HfMCPyZLifTz/UnJmI5kdkXtpCbombUSs8xniAyo0vIbrDzDwUJB6eJOgl9u5DQOt2TQlYumxzD1SvYA==",
-      "dependencies": {
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "1",
-        "d3-transition": "1"
-      }
-    },
-    "node_modules/d3-chord": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-chord/-/d3-chord-1.0.6.tgz",
-      "integrity": "sha512-JXA2Dro1Fxw9rJe33Uv+Ckr5IrAa74TlfDEhE/jfLOaXegMQFQTAgAw9WnZL8+HxVBRXaRGCkrNU7pJeylRIuA==",
-      "dependencies": {
-        "d3-array": "1",
-        "d3-path": "1"
-      }
-    },
-    "node_modules/d3-collection": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-collection/-/d3-collection-1.0.7.tgz",
-      "integrity": "sha512-ii0/r5f4sjKNTfh84Di+DpztYwqKhEyUlKoPrzUFfeSkWxjW49xU2QzO9qrPrNkpdI0XJkfzvmTu8V2Zylln6A=="
-    },
-    "node_modules/d3-color": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-1.4.1.tgz",
-      "integrity": "sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q=="
-    },
-    "node_modules/d3-contour": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/d3-contour/-/d3-contour-1.3.2.tgz",
-      "integrity": "sha512-hoPp4K/rJCu0ladiH6zmJUEz6+u3lgR+GSm/QdM2BBvDraU39Vr7YdDCicJcxP1z8i9B/2dJLgDC1NcvlF8WCg==",
-      "dependencies": {
-        "d3-array": "^1.1.1"
-      }
-    },
-    "node_modules/d3-dispatch": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-1.0.6.tgz",
-      "integrity": "sha512-fVjoElzjhCEy+Hbn8KygnmMS7Or0a9sI2UzGwoB7cCtvI1XpVN9GpoYlnb3xt2YV66oXYb1fLJ8GMvP4hdU1RA=="
-    },
-    "node_modules/d3-drag": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-1.2.5.tgz",
-      "integrity": "sha512-rD1ohlkKQwMZYkQlYVCrSFxsWPzI97+W+PaEIBNTMxRuxz9RF0Hi5nJWHGVJ3Om9d2fRTe1yOBINJyy/ahV95w==",
-      "dependencies": {
-        "d3-dispatch": "1",
-        "d3-selection": "1"
-      }
-    },
-    "node_modules/d3-dsv": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/d3-dsv/-/d3-dsv-1.2.0.tgz",
-      "integrity": "sha512-9yVlqvZcSOMhCYzniHE7EVUws7Fa1zgw+/EAV2BxJoG3ME19V6BQFBwI855XQDsxyOuG7NibqRMTtiF/Qup46g==",
-      "dependencies": {
-        "commander": "2",
-        "iconv-lite": "0.4",
-        "rw": "1"
-      },
-      "bin": {
-        "csv2json": "bin/dsv2json",
-        "csv2tsv": "bin/dsv2dsv",
-        "dsv2dsv": "bin/dsv2dsv",
-        "dsv2json": "bin/dsv2json",
-        "json2csv": "bin/json2dsv",
-        "json2dsv": "bin/json2dsv",
-        "json2tsv": "bin/json2dsv",
-        "tsv2csv": "bin/dsv2dsv",
-        "tsv2json": "bin/dsv2json"
-      }
-    },
-    "node_modules/d3-dsv/node_modules/commander": {
-      "version": "2.20.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
-    },
-    "node_modules/d3-ease": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-1.0.7.tgz",
-      "integrity": "sha512-lx14ZPYkhNx0s/2HX5sLFUI3mbasHjSSpwO/KaaNACweVwxUruKyWVcb293wMv1RqTPZyZ8kSZ2NogUZNcLOFQ=="
-    },
-    "node_modules/d3-fetch": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/d3-fetch/-/d3-fetch-1.2.0.tgz",
-      "integrity": "sha512-yC78NBVcd2zFAyR/HnUiBS7Lf6inSCoWcSxFfw8FYL7ydiqe80SazNwoffcqOfs95XaLo7yebsmQqDKSsXUtvA==",
-      "dependencies": {
-        "d3-dsv": "1"
-      }
-    },
-    "node_modules/d3-force": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-1.2.1.tgz",
-      "integrity": "sha512-HHvehyaiUlVo5CxBJ0yF/xny4xoaxFxDnBXNvNcfW9adORGZfyNF1dj6DGLKyk4Yh3brP/1h3rnDzdIAwL08zg==",
-      "dependencies": {
-        "d3-collection": "1",
-        "d3-dispatch": "1",
-        "d3-quadtree": "1",
-        "d3-timer": "1"
-      }
-    },
-    "node_modules/d3-format": {
-      "version": "1.4.5",
-      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-1.4.5.tgz",
-      "integrity": "sha512-J0piedu6Z8iB6TbIGfZgDzfXxUFN3qQRMofy2oPdXzQibYGqPB/9iMcxr/TGalU+2RsyDO+U4f33id8tbnSRMQ=="
-    },
-    "node_modules/d3-geo": {
-      "version": "1.12.1",
-      "resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-1.12.1.tgz",
-      "integrity": "sha512-XG4d1c/UJSEX9NfU02KwBL6BYPj8YKHxgBEw5om2ZnTRSbIcego6dhHwcxuSR3clxh0EpE38os1DVPOmnYtTPg==",
-      "dependencies": {
-        "d3-array": "1"
-      }
-    },
-    "node_modules/d3-hierarchy": {
-      "version": "1.1.9",
-      "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-1.1.9.tgz",
-      "integrity": "sha512-j8tPxlqh1srJHAtxfvOUwKNYJkQuBFdM1+JAUfq6xqH5eAqf93L7oG1NVqDa4CpFZNvnNKtCYEUC8KY9yEn9lQ=="
-    },
-    "node_modules/d3-interpolate": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-1.4.0.tgz",
-      "integrity": "sha512-V9znK0zc3jOPV4VD2zZn0sDhZU3WAE2bmlxdIwwQPPzPjvyLkd8B3JUVdS1IDUFDkWZ72c9qnv1GK2ZagTZ8EA==",
-      "dependencies": {
-        "d3-color": "1"
-      }
-    },
-    "node_modules/d3-path": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
-      "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg=="
-    },
-    "node_modules/d3-polygon": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-polygon/-/d3-polygon-1.0.6.tgz",
-      "integrity": "sha512-k+RF7WvI08PC8reEoXa/w2nSg5AUMTi+peBD9cmFc+0ixHfbs4QmxxkarVal1IkVkgxVuk9JSHhJURHiyHKAuQ=="
-    },
-    "node_modules/d3-quadtree": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-1.0.7.tgz",
-      "integrity": "sha512-RKPAeXnkC59IDGD0Wu5mANy0Q2V28L+fNe65pOCXVdVuTJS3WPKaJlFHer32Rbh9gIo9qMuJXio8ra4+YmIymA=="
-    },
-    "node_modules/d3-random": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/d3-random/-/d3-random-1.1.2.tgz",
-      "integrity": "sha512-6AK5BNpIFqP+cx/sreKzNjWbwZQCSUatxq+pPRmFIQaWuoD+NrbVWw7YWpHiXpCQ/NanKdtGDuB+VQcZDaEmYQ=="
-    },
-    "node_modules/d3-scale": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-2.2.2.tgz",
-      "integrity": "sha512-LbeEvGgIb8UMcAa0EATLNX0lelKWGYDQiPdHj+gLblGVhGLyNbaCn3EvrJf0A3Y/uOOU5aD6MTh5ZFCdEwGiCw==",
-      "dependencies": {
-        "d3-array": "^1.2.0",
-        "d3-collection": "1",
-        "d3-format": "1",
-        "d3-interpolate": "1",
-        "d3-time": "1",
-        "d3-time-format": "2"
-      }
-    },
-    "node_modules/d3-scale-chromatic": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-1.5.0.tgz",
-      "integrity": "sha512-ACcL46DYImpRFMBcpk9HhtIyC7bTBR4fNOPxwVSl0LfulDAwyiHyPOTqcDG1+t5d4P9W7t/2NAuWu59aKko/cg==",
-      "dependencies": {
-        "d3-color": "1",
-        "d3-interpolate": "1"
-      }
-    },
-    "node_modules/d3-selection": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-1.4.2.tgz",
-      "integrity": "sha512-SJ0BqYihzOjDnnlfyeHT0e30k0K1+5sR3d5fNueCNeuhZTnGw4M4o8mqJchSwgKMXCNFo+e2VTChiSJ0vYtXkg=="
-    },
-    "node_modules/d3-shape": {
-      "version": "1.3.7",
-      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
-      "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
-      "dependencies": {
-        "d3-path": "1"
-      }
-    },
-    "node_modules/d3-time": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.1.0.tgz",
-      "integrity": "sha512-Xh0isrZ5rPYYdqhAVk8VLnMEidhz5aP7htAADH6MfzgmmicPkTo8LhkLxci61/lCB7n7UmE3bN0leRt+qvkLxA=="
-    },
-    "node_modules/d3-time-format": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-2.3.0.tgz",
-      "integrity": "sha512-guv6b2H37s2Uq/GefleCDtbe0XZAuy7Wa49VGkPVPMfLL9qObgBST3lEHJBMUp8S7NdLQAGIvr2KXk8Hc98iKQ==",
-      "dependencies": {
-        "d3-time": "1"
-      }
-    },
-    "node_modules/d3-timer": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-1.0.10.tgz",
-      "integrity": "sha512-B1JDm0XDaQC+uvo4DT79H0XmBskgS3l6Ve+1SBCfxgmtIb1AVrPIoqd+nPSv+loMX8szQ0sVUhGngL7D5QPiXw=="
-    },
-    "node_modules/d3-transition": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-1.3.2.tgz",
-      "integrity": "sha512-sc0gRU4PFqZ47lPVHloMn9tlPcv8jxgOQg+0zjhfZXMQuvppjG6YuwdMBE0TuqCZjeJkLecku/l9R0JPcRhaDA==",
-      "dependencies": {
-        "d3-color": "1",
-        "d3-dispatch": "1",
-        "d3-ease": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "^1.1.0",
-        "d3-timer": "1"
-      }
-    },
-    "node_modules/d3-voronoi": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/d3-voronoi/-/d3-voronoi-1.1.4.tgz",
-      "integrity": "sha512-dArJ32hchFsrQ8uMiTBLq256MpnZjeuBtdHpaDlYuQyjU0CVzCJl/BVW+SkszaAeH95D/8gxqAhgx0ouAWAfRg=="
-    },
-    "node_modules/d3-zoom": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-1.8.3.tgz",
-      "integrity": "sha512-VoLXTK4wvy1a0JpH2Il+F2CiOhVu7VRXWF5M/LroMIh3/zBAC3WAt7QoIvPibOavVo20hN6/37vwAsdBejLyKQ==",
-      "dependencies": {
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "1",
-        "d3-transition": "1"
-      }
-    },
     "node_modules/d3v3": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/d3v3/-/d3v3-1.0.3.tgz",
@@ -9341,6 +9060,7 @@
       "version": "0.4.24",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
       "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "dev": true,
       "dependencies": {
         "safer-buffer": ">= 2.1.2 < 3"
       },
@@ -15039,11 +14759,6 @@
         "queue-microtask": "^1.2.2"
       }
     },
-    "node_modules/rw": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
-      "integrity": "sha1-P4Yt+pGrdmsUiF700BEkv9oHT7Q="
-    },
     "node_modules/safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -15059,7 +14774,8 @@
     "node_modules/safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true
     },
     "node_modules/sanitize-html": {
       "version": "2.7.2",
@@ -22838,277 +22554,6 @@
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.17.tgz",
       "integrity": "sha512-u1wmTI1jJGzCJzWndZo8mk4wnPTZd1eOIYTYvuEyOQGfmDl3TrabCCfKnOC86FZwW/9djqTl933UF/cS425i9A=="
     },
-    "d3": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-5.7.0.tgz",
-      "integrity": "sha512-8KEIfx+dFm8PlbJN9PI0suazrZ41QcaAufsKE9PRcqYPWLngHIyWJZX96n6IQKePGgeSu0l7rtlueSSNq8Zc3g==",
-      "requires": {
-        "d3-array": "1",
-        "d3-axis": "1",
-        "d3-brush": "1",
-        "d3-chord": "1",
-        "d3-collection": "1",
-        "d3-color": "1",
-        "d3-contour": "1",
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-dsv": "1",
-        "d3-ease": "1",
-        "d3-fetch": "1",
-        "d3-force": "1",
-        "d3-format": "1",
-        "d3-geo": "1",
-        "d3-hierarchy": "1",
-        "d3-interpolate": "1",
-        "d3-path": "1",
-        "d3-polygon": "1",
-        "d3-quadtree": "1",
-        "d3-random": "1",
-        "d3-scale": "2",
-        "d3-scale-chromatic": "1",
-        "d3-selection": "1",
-        "d3-shape": "1",
-        "d3-time": "1",
-        "d3-time-format": "2",
-        "d3-timer": "1",
-        "d3-transition": "1",
-        "d3-voronoi": "1",
-        "d3-zoom": "1"
-      }
-    },
-    "d3-array": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz",
-      "integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw=="
-    },
-    "d3-axis": {
-      "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-1.0.12.tgz",
-      "integrity": "sha512-ejINPfPSNdGFKEOAtnBtdkpr24c4d4jsei6Lg98mxf424ivoDP2956/5HDpIAtmHo85lqT4pruy+zEgvRUBqaQ=="
-    },
-    "d3-brush": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/d3-brush/-/d3-brush-1.1.6.tgz",
-      "integrity": "sha512-7RW+w7HfMCPyZLifTz/UnJmI5kdkXtpCbombUSs8xniAyo0vIbrDzDwUJB6eJOgl9u5DQOt2TQlYumxzD1SvYA==",
-      "requires": {
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "1",
-        "d3-transition": "1"
-      }
-    },
-    "d3-chord": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-chord/-/d3-chord-1.0.6.tgz",
-      "integrity": "sha512-JXA2Dro1Fxw9rJe33Uv+Ckr5IrAa74TlfDEhE/jfLOaXegMQFQTAgAw9WnZL8+HxVBRXaRGCkrNU7pJeylRIuA==",
-      "requires": {
-        "d3-array": "1",
-        "d3-path": "1"
-      }
-    },
-    "d3-collection": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-collection/-/d3-collection-1.0.7.tgz",
-      "integrity": "sha512-ii0/r5f4sjKNTfh84Di+DpztYwqKhEyUlKoPrzUFfeSkWxjW49xU2QzO9qrPrNkpdI0XJkfzvmTu8V2Zylln6A=="
-    },
-    "d3-color": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-1.4.1.tgz",
-      "integrity": "sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q=="
-    },
-    "d3-contour": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/d3-contour/-/d3-contour-1.3.2.tgz",
-      "integrity": "sha512-hoPp4K/rJCu0ladiH6zmJUEz6+u3lgR+GSm/QdM2BBvDraU39Vr7YdDCicJcxP1z8i9B/2dJLgDC1NcvlF8WCg==",
-      "requires": {
-        "d3-array": "^1.1.1"
-      }
-    },
-    "d3-dispatch": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-1.0.6.tgz",
-      "integrity": "sha512-fVjoElzjhCEy+Hbn8KygnmMS7Or0a9sI2UzGwoB7cCtvI1XpVN9GpoYlnb3xt2YV66oXYb1fLJ8GMvP4hdU1RA=="
-    },
-    "d3-drag": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-1.2.5.tgz",
-      "integrity": "sha512-rD1ohlkKQwMZYkQlYVCrSFxsWPzI97+W+PaEIBNTMxRuxz9RF0Hi5nJWHGVJ3Om9d2fRTe1yOBINJyy/ahV95w==",
-      "requires": {
-        "d3-dispatch": "1",
-        "d3-selection": "1"
-      }
-    },
-    "d3-dsv": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/d3-dsv/-/d3-dsv-1.2.0.tgz",
-      "integrity": "sha512-9yVlqvZcSOMhCYzniHE7EVUws7Fa1zgw+/EAV2BxJoG3ME19V6BQFBwI855XQDsxyOuG7NibqRMTtiF/Qup46g==",
-      "requires": {
-        "commander": "2",
-        "iconv-lite": "0.4",
-        "rw": "1"
-      },
-      "dependencies": {
-        "commander": {
-          "version": "2.20.3",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-          "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
-        }
-      }
-    },
-    "d3-ease": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-1.0.7.tgz",
-      "integrity": "sha512-lx14ZPYkhNx0s/2HX5sLFUI3mbasHjSSpwO/KaaNACweVwxUruKyWVcb293wMv1RqTPZyZ8kSZ2NogUZNcLOFQ=="
-    },
-    "d3-fetch": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/d3-fetch/-/d3-fetch-1.2.0.tgz",
-      "integrity": "sha512-yC78NBVcd2zFAyR/HnUiBS7Lf6inSCoWcSxFfw8FYL7ydiqe80SazNwoffcqOfs95XaLo7yebsmQqDKSsXUtvA==",
-      "requires": {
-        "d3-dsv": "1"
-      }
-    },
-    "d3-force": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-1.2.1.tgz",
-      "integrity": "sha512-HHvehyaiUlVo5CxBJ0yF/xny4xoaxFxDnBXNvNcfW9adORGZfyNF1dj6DGLKyk4Yh3brP/1h3rnDzdIAwL08zg==",
-      "requires": {
-        "d3-collection": "1",
-        "d3-dispatch": "1",
-        "d3-quadtree": "1",
-        "d3-timer": "1"
-      }
-    },
-    "d3-format": {
-      "version": "1.4.5",
-      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-1.4.5.tgz",
-      "integrity": "sha512-J0piedu6Z8iB6TbIGfZgDzfXxUFN3qQRMofy2oPdXzQibYGqPB/9iMcxr/TGalU+2RsyDO+U4f33id8tbnSRMQ=="
-    },
-    "d3-geo": {
-      "version": "1.12.1",
-      "resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-1.12.1.tgz",
-      "integrity": "sha512-XG4d1c/UJSEX9NfU02KwBL6BYPj8YKHxgBEw5om2ZnTRSbIcego6dhHwcxuSR3clxh0EpE38os1DVPOmnYtTPg==",
-      "requires": {
-        "d3-array": "1"
-      }
-    },
-    "d3-hierarchy": {
-      "version": "1.1.9",
-      "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-1.1.9.tgz",
-      "integrity": "sha512-j8tPxlqh1srJHAtxfvOUwKNYJkQuBFdM1+JAUfq6xqH5eAqf93L7oG1NVqDa4CpFZNvnNKtCYEUC8KY9yEn9lQ=="
-    },
-    "d3-interpolate": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-1.4.0.tgz",
-      "integrity": "sha512-V9znK0zc3jOPV4VD2zZn0sDhZU3WAE2bmlxdIwwQPPzPjvyLkd8B3JUVdS1IDUFDkWZ72c9qnv1GK2ZagTZ8EA==",
-      "requires": {
-        "d3-color": "1"
-      }
-    },
-    "d3-path": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
-      "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg=="
-    },
-    "d3-polygon": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/d3-polygon/-/d3-polygon-1.0.6.tgz",
-      "integrity": "sha512-k+RF7WvI08PC8reEoXa/w2nSg5AUMTi+peBD9cmFc+0ixHfbs4QmxxkarVal1IkVkgxVuk9JSHhJURHiyHKAuQ=="
-    },
-    "d3-quadtree": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-1.0.7.tgz",
-      "integrity": "sha512-RKPAeXnkC59IDGD0Wu5mANy0Q2V28L+fNe65pOCXVdVuTJS3WPKaJlFHer32Rbh9gIo9qMuJXio8ra4+YmIymA=="
-    },
-    "d3-random": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/d3-random/-/d3-random-1.1.2.tgz",
-      "integrity": "sha512-6AK5BNpIFqP+cx/sreKzNjWbwZQCSUatxq+pPRmFIQaWuoD+NrbVWw7YWpHiXpCQ/NanKdtGDuB+VQcZDaEmYQ=="
-    },
-    "d3-scale": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-2.2.2.tgz",
-      "integrity": "sha512-LbeEvGgIb8UMcAa0EATLNX0lelKWGYDQiPdHj+gLblGVhGLyNbaCn3EvrJf0A3Y/uOOU5aD6MTh5ZFCdEwGiCw==",
-      "requires": {
-        "d3-array": "^1.2.0",
-        "d3-collection": "1",
-        "d3-format": "1",
-        "d3-interpolate": "1",
-        "d3-time": "1",
-        "d3-time-format": "2"
-      }
-    },
-    "d3-scale-chromatic": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-1.5.0.tgz",
-      "integrity": "sha512-ACcL46DYImpRFMBcpk9HhtIyC7bTBR4fNOPxwVSl0LfulDAwyiHyPOTqcDG1+t5d4P9W7t/2NAuWu59aKko/cg==",
-      "requires": {
-        "d3-color": "1",
-        "d3-interpolate": "1"
-      }
-    },
-    "d3-selection": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-1.4.2.tgz",
-      "integrity": "sha512-SJ0BqYihzOjDnnlfyeHT0e30k0K1+5sR3d5fNueCNeuhZTnGw4M4o8mqJchSwgKMXCNFo+e2VTChiSJ0vYtXkg=="
-    },
-    "d3-shape": {
-      "version": "1.3.7",
-      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
-      "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
-      "requires": {
-        "d3-path": "1"
-      }
-    },
-    "d3-time": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.1.0.tgz",
-      "integrity": "sha512-Xh0isrZ5rPYYdqhAVk8VLnMEidhz5aP7htAADH6MfzgmmicPkTo8LhkLxci61/lCB7n7UmE3bN0leRt+qvkLxA=="
-    },
-    "d3-time-format": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-2.3.0.tgz",
-      "integrity": "sha512-guv6b2H37s2Uq/GefleCDtbe0XZAuy7Wa49VGkPVPMfLL9qObgBST3lEHJBMUp8S7NdLQAGIvr2KXk8Hc98iKQ==",
-      "requires": {
-        "d3-time": "1"
-      }
-    },
-    "d3-timer": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-1.0.10.tgz",
-      "integrity": "sha512-B1JDm0XDaQC+uvo4DT79H0XmBskgS3l6Ve+1SBCfxgmtIb1AVrPIoqd+nPSv+loMX8szQ0sVUhGngL7D5QPiXw=="
-    },
-    "d3-transition": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-1.3.2.tgz",
-      "integrity": "sha512-sc0gRU4PFqZ47lPVHloMn9tlPcv8jxgOQg+0zjhfZXMQuvppjG6YuwdMBE0TuqCZjeJkLecku/l9R0JPcRhaDA==",
-      "requires": {
-        "d3-color": "1",
-        "d3-dispatch": "1",
-        "d3-ease": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "^1.1.0",
-        "d3-timer": "1"
-      }
-    },
-    "d3-voronoi": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/d3-voronoi/-/d3-voronoi-1.1.4.tgz",
-      "integrity": "sha512-dArJ32hchFsrQ8uMiTBLq256MpnZjeuBtdHpaDlYuQyjU0CVzCJl/BVW+SkszaAeH95D/8gxqAhgx0ouAWAfRg=="
-    },
-    "d3-zoom": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-1.8.3.tgz",
-      "integrity": "sha512-VoLXTK4wvy1a0JpH2Il+F2CiOhVu7VRXWF5M/LroMIh3/zBAC3WAt7QoIvPibOavVo20hN6/37vwAsdBejLyKQ==",
-      "requires": {
-        "d3-dispatch": "1",
-        "d3-drag": "1",
-        "d3-interpolate": "1",
-        "d3-selection": "1",
-        "d3-transition": "1"
-      }
-    },
     "d3v3": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/d3v3/-/d3v3-1.0.3.tgz",
@@ -24993,6 +24438,7 @@
       "version": "0.4.24",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
       "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
+      "dev": true,
       "requires": {
         "safer-buffer": ">= 2.1.2 < 3"
       }
@@ -29278,11 +28724,6 @@
         "queue-microtask": "^1.2.2"
       }
     },
-    "rw": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
-      "integrity": "sha1-P4Yt+pGrdmsUiF700BEkv9oHT7Q="
-    },
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -29298,7 +28739,8 @@
     "safer-buffer": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true
     },
     "sanitize-html": {
       "version": "2.7.2",

+ 1 - 2
package.json

@@ -37,7 +37,6 @@
     "babel-preset-react-app": "^3.1.2",
     "clipboard": "1.7.1",
     "core-js": "3.19.1",
-    "d3": "5.7.0",
     "d3v3": "1.0.3",
     "dropzone": "5.5.1",
     "file-saver": "^2.0.2",
@@ -69,7 +68,7 @@
     "regenerator-runtime": "^0.13.3",
     "removeNPMAbsolutePaths": "^1.0.4",
     "sanitize-html": "^2.7.2",
-    "select2": "4.0.13",    
+    "select2": "4.0.13",
     "selectize-plugin-clear": "0.0.3",
     "sprintf-js": "1.1.2",
     "vue": "3.2.0",