From c03f7ec5ce6621f9e8bb2bbc2e50e74c30049b7c Mon Sep 17 00:00:00 2001
From: Brandon Farmer <bthesorceror@gmail.com>
Date: Tue, 17 Apr 2018 11:58:36 -0700
Subject: [PATCH] Add error handling to dashboard components

---
 ui/src/alerts/components/AlertsTable.js                        | 3 +++
 ui/src/alerts/containers/AlertsApp.js                          | 2 ++
 ui/src/dashboards/components/AxesOptions.js                    | 2 ++
 ui/src/dashboards/components/CellEditorOverlay.tsx             | 2 ++
 ui/src/dashboards/components/DashboardHeaderEdit.js            | 2 ++
 ui/src/dashboards/components/DashboardSwitcher.js              | 2 ++
 ui/src/dashboards/components/DashboardsPageContents.js         | 2 ++
 ui/src/dashboards/components/DisplayOptions.js                 | 2 ++
 ui/src/dashboards/components/GaugeOptions.js                   | 2 ++
 ui/src/dashboards/components/GraphOptionsCustomizableField.tsx | 2 ++
 ui/src/dashboards/components/GraphOptionsTimeFormat.tsx        | 2 ++
 ui/src/dashboards/components/MeasurementDropdown.js            | 2 ++
 ui/src/dashboards/components/QueryTextArea.js                  | 2 ++
 ui/src/dashboards/components/SingleStatOptions.js              | 2 ++
 ui/src/dashboards/components/TableOptions.tsx                  | 2 ++
 ui/src/dashboards/components/TagKeyDropdown.js                 | 2 ++
 ui/src/dashboards/components/Threshold.tsx                     | 2 ++
 ui/src/dashboards/components/VisualizationName.js              | 2 ++
 ui/src/dashboards/components/template_variables/Row.js         | 2 ++
 ui/src/dashboards/containers/DashboardPage.js                  | 2 ++
 ui/src/dashboards/containers/DashboardsPage.js                 | 2 ++
 21 files changed, 43 insertions(+)

diff --git a/ui/src/alerts/components/AlertsTable.js b/ui/src/alerts/components/AlertsTable.js
index f8fbc1f443..82e0297b91 100644
--- a/ui/src/alerts/components/AlertsTable.js
+++ b/ui/src/alerts/components/AlertsTable.js
@@ -7,9 +7,11 @@ import {Link} from 'react-router'
 import uuid from 'uuid'
 
 import InfiniteScroll from 'shared/components/InfiniteScroll'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 import {ALERTS_TABLE} from 'src/alerts/constants/tableSizing'
 
+@ErrorHandling
 class AlertsTable extends Component {
   constructor(props) {
     super(props)
@@ -239,6 +241,7 @@ class AlertsTable extends Component {
   }
 }
 
+@ErrorHandling
 class SearchBar extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/alerts/containers/AlertsApp.js b/ui/src/alerts/containers/AlertsApp.js
index ed90e01b77..31af501a32 100644
--- a/ui/src/alerts/containers/AlertsApp.js
+++ b/ui/src/alerts/containers/AlertsApp.js
@@ -5,6 +5,7 @@ import SourceIndicator from 'shared/components/SourceIndicator'
 import AlertsTable from 'src/alerts/components/AlertsTable'
 import NoKapacitorError from 'shared/components/NoKapacitorError'
 import CustomTimeRangeDropdown from 'shared/components/CustomTimeRangeDropdown'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 import {getAlerts} from 'src/alerts/apis'
 import AJAX from 'utils/ajax'
@@ -14,6 +15,7 @@ import moment from 'moment'
 
 import {timeRanges} from 'shared/data/timeRanges'
 
+@ErrorHandling
 class AlertsApp extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/AxesOptions.js b/ui/src/dashboards/components/AxesOptions.js
index 9b04de4659..6d1f95698b 100644
--- a/ui/src/dashboards/components/AxesOptions.js
+++ b/ui/src/dashboards/components/AxesOptions.js
@@ -16,10 +16,12 @@ import {
 import {GRAPH_TYPES} from 'src/dashboards/graphics/graph'
 
 import {updateAxes} from 'src/dashboards/actions/cellEditorOverlay'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 const {LINEAR, LOG, BASE_2, BASE_10} = AXES_SCALE_OPTIONS
 const getInputMin = scale => (scale === LOG ? '0' : null)
 
+@ErrorHandling
 class AxesOptions extends Component {
   handleSetPrefixSuffix = e => {
     const {handleUpdateAxes, axes} = this.props
diff --git a/ui/src/dashboards/components/CellEditorOverlay.tsx b/ui/src/dashboards/components/CellEditorOverlay.tsx
index 2425eea3ce..ce01274733 100644
--- a/ui/src/dashboards/components/CellEditorOverlay.tsx
+++ b/ui/src/dashboards/components/CellEditorOverlay.tsx
@@ -30,6 +30,7 @@ import {getCellTypeColors} from 'src/dashboards/constants/cellEditor'
 import {TimeRange, Source, Query} from 'src/types'
 import {Status} from 'src/types/query'
 import {Cell, CellQuery, Legend} from 'src/types/dashboard'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 const staticLegend: Legend = {
   type: 'static',
@@ -86,6 +87,7 @@ const createWorkingDrafts = (source: string, queries: CellQuery[]): Query[] =>
     queries.map((query: CellQuery) => createWorkingDraft(source, query))
   )
 
+@ErrorHandling
 class CellEditorOverlay extends Component<Props, State> {
   private overlayRef: HTMLDivElement
 
diff --git a/ui/src/dashboards/components/DashboardHeaderEdit.js b/ui/src/dashboards/components/DashboardHeaderEdit.js
index a9a5eaad9e..66f43f0665 100644
--- a/ui/src/dashboards/components/DashboardHeaderEdit.js
+++ b/ui/src/dashboards/components/DashboardHeaderEdit.js
@@ -4,7 +4,9 @@ import {
   DASHBOARD_NAME_MAX_LENGTH,
   NEW_DASHBOARD,
 } from 'src/dashboards/constants/index'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class DashboardEditHeader extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/DashboardSwitcher.js b/ui/src/dashboards/components/DashboardSwitcher.js
index 58153bf86a..ce2a56fd06 100644
--- a/ui/src/dashboards/components/DashboardSwitcher.js
+++ b/ui/src/dashboards/components/DashboardSwitcher.js
@@ -4,7 +4,9 @@ import {Link} from 'react-router'
 import _ from 'lodash'
 import classnames from 'classnames'
 import OnClickOutside from 'shared/components/OnClickOutside'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class DashboardSwitcher extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/DashboardsPageContents.js b/ui/src/dashboards/components/DashboardsPageContents.js
index 29d4f99909..80cdf617af 100644
--- a/ui/src/dashboards/components/DashboardsPageContents.js
+++ b/ui/src/dashboards/components/DashboardsPageContents.js
@@ -6,7 +6,9 @@ import Authorized, {EDITOR_ROLE} from 'src/auth/Authorized'
 import DashboardsTable from 'src/dashboards/components/DashboardsTable'
 import SearchBar from 'src/hosts/components/SearchBar'
 import FancyScrollbar from 'shared/components/FancyScrollbar'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class DashboardsPageContents extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/DisplayOptions.js b/ui/src/dashboards/components/DisplayOptions.js
index 8c08f21eca..ec3c47cf3b 100644
--- a/ui/src/dashboards/components/DisplayOptions.js
+++ b/ui/src/dashboards/components/DisplayOptions.js
@@ -9,7 +9,9 @@ import AxesOptions from 'src/dashboards/components/AxesOptions'
 import TableOptions from 'src/dashboards/components/TableOptions'
 
 import {buildDefaultYLabel} from 'shared/presenters'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class DisplayOptions extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/GaugeOptions.js b/ui/src/dashboards/components/GaugeOptions.js
index fec0820815..2a6c29b0bc 100644
--- a/ui/src/dashboards/components/GaugeOptions.js
+++ b/ui/src/dashboards/components/GaugeOptions.js
@@ -21,7 +21,9 @@ import {
   updateAxes,
 } from 'src/dashboards/actions/cellEditorOverlay'
 import {colorsNumberSchema} from 'shared/schemas'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class GaugeOptions extends Component {
   handleAddThreshold = () => {
     const {gaugeColors, handleUpdateGaugeColors, onResetFocus} = this.props
diff --git a/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx b/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx
index c19f628713..03efd2fdbe 100644
--- a/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx
+++ b/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx
@@ -11,6 +11,7 @@ import {
   ConnectDropTarget,
   ConnectDragPreview,
 } from 'react-dnd'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 const fieldType = 'field'
 
@@ -98,6 +99,7 @@ function MyDragSource(dragv1, dragv2, dragfunc1) {
   return target => DragSource(dragv1, dragv2, dragfunc1)(target) as any
 }
 
+@ErrorHandling
 @MyDropTarget(fieldType, fieldTarget, (connect: DropTargetConnector) => ({
   connectDropTarget: connect.dropTarget(),
 }))
diff --git a/ui/src/dashboards/components/GraphOptionsTimeFormat.tsx b/ui/src/dashboards/components/GraphOptionsTimeFormat.tsx
index 9ff896b377..7c6ad9f966 100644
--- a/ui/src/dashboards/components/GraphOptionsTimeFormat.tsx
+++ b/ui/src/dashboards/components/GraphOptionsTimeFormat.tsx
@@ -7,6 +7,7 @@ import {
   TIME_FORMAT_DEFAULT,
   TIME_FORMAT_TOOLTIP_LINK,
 } from 'src/shared/constants/tableGraph'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 interface TimeFormatOptions {
   text: string
@@ -22,6 +23,7 @@ interface State {
   format: string
 }
 
+@ErrorHandling
 class GraphOptionsTimeFormat extends PureComponent<Props, State> {
   constructor(props: Props) {
     super(props)
diff --git a/ui/src/dashboards/components/MeasurementDropdown.js b/ui/src/dashboards/components/MeasurementDropdown.js
index 47be635b2b..0ab2d9c86f 100644
--- a/ui/src/dashboards/components/MeasurementDropdown.js
+++ b/ui/src/dashboards/components/MeasurementDropdown.js
@@ -4,8 +4,10 @@ import PropTypes from 'prop-types'
 import Dropdown from 'shared/components/Dropdown'
 import {showMeasurements} from 'shared/apis/metaQuery'
 import parsers from 'shared/parsing'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 const {measurements: showMeasurementsParser} = parsers
 
+@ErrorHandling
 class MeasurementDropdown extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/QueryTextArea.js b/ui/src/dashboards/components/QueryTextArea.js
index e16bc25065..1e94bd83f1 100644
--- a/ui/src/dashboards/components/QueryTextArea.js
+++ b/ui/src/dashboards/components/QueryTextArea.js
@@ -5,6 +5,7 @@ import classnames from 'classnames'
 
 import TemplateDrawer from 'shared/components/TemplateDrawer'
 import QueryStatus from 'shared/components/QueryStatus'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 import {
   MATCH_INCOMPLETE_TEMPLATES,
@@ -13,6 +14,7 @@ import {
   unMask,
 } from 'src/dashboards/constants'
 
+@ErrorHandling
 class QueryTextArea extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/SingleStatOptions.js b/ui/src/dashboards/components/SingleStatOptions.js
index 5909d9fd51..c1beac6e62 100644
--- a/ui/src/dashboards/components/SingleStatOptions.js
+++ b/ui/src/dashboards/components/SingleStatOptions.js
@@ -8,7 +8,9 @@ import ThresholdsList from 'shared/components/ThresholdsList'
 import ThresholdsListTypeToggle from 'shared/components/ThresholdsListTypeToggle'
 
 import {updateAxes} from 'src/dashboards/actions/cellEditorOverlay'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class SingleStatOptions extends Component {
   handleUpdatePrefix = e => {
     const {handleUpdateAxes, axes} = this.props
diff --git a/ui/src/dashboards/components/TableOptions.tsx b/ui/src/dashboards/components/TableOptions.tsx
index 6511e43bd5..eb4f872c32 100644
--- a/ui/src/dashboards/components/TableOptions.tsx
+++ b/ui/src/dashboards/components/TableOptions.tsx
@@ -17,6 +17,7 @@ import ThresholdsListTypeToggle from 'src/shared/components/ThresholdsListTypeTo
 import {updateTableOptions} from 'src/dashboards/actions/cellEditorOverlay'
 import {TIME_FIELD_DEFAULT} from 'src/shared/constants/tableGraph'
 import {QueryConfig} from 'src/types/query'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 interface Option {
   text: string
@@ -44,6 +45,7 @@ interface Props {
   onResetFocus: () => void
 }
 
+@ErrorHandling
 export class TableOptions extends PureComponent<Props, {}> {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/TagKeyDropdown.js b/ui/src/dashboards/components/TagKeyDropdown.js
index 6c9c19f399..afa71a3a34 100644
--- a/ui/src/dashboards/components/TagKeyDropdown.js
+++ b/ui/src/dashboards/components/TagKeyDropdown.js
@@ -4,8 +4,10 @@ import PropTypes from 'prop-types'
 import Dropdown from 'shared/components/Dropdown'
 import {showTagKeys} from 'shared/apis/metaQuery'
 import parsers from 'shared/parsing'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 const {tagKeys: showTagKeysParser} = parsers
 
+@ErrorHandling
 class TagKeyDropdown extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/Threshold.tsx b/ui/src/dashboards/components/Threshold.tsx
index 86487b9459..28d650943c 100644
--- a/ui/src/dashboards/components/Threshold.tsx
+++ b/ui/src/dashboards/components/Threshold.tsx
@@ -2,6 +2,7 @@ import React, {PureComponent, ChangeEvent, KeyboardEvent} from 'react'
 
 import ColorDropdown from 'src/shared/components/ColorDropdown'
 import {THRESHOLD_COLORS} from 'src/shared/constants/thresholds'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 interface SelectedColor {
   hex: string
@@ -35,6 +36,7 @@ interface State {
   valid: boolean
 }
 
+@ErrorHandling
 class Threshold extends PureComponent<Props, State> {
   private thresholdInputRef: HTMLInputElement
 
diff --git a/ui/src/dashboards/components/VisualizationName.js b/ui/src/dashboards/components/VisualizationName.js
index 26b37477d3..34928e36de 100644
--- a/ui/src/dashboards/components/VisualizationName.js
+++ b/ui/src/dashboards/components/VisualizationName.js
@@ -4,7 +4,9 @@ import {connect} from 'react-redux'
 import {bindActionCreators} from 'redux'
 
 import {renameCell} from 'src/dashboards/actions/cellEditorOverlay'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class VisualizationName extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/components/template_variables/Row.js b/ui/src/dashboards/components/template_variables/Row.js
index 3be354f73e..e4aa077311 100644
--- a/ui/src/dashboards/components/template_variables/Row.js
+++ b/ui/src/dashboards/components/template_variables/Row.js
@@ -25,6 +25,7 @@ import {errorThrown as errorThrownAction} from 'shared/actions/errors'
 import {notify as notifyAction} from 'shared/actions/notifications'
 
 import {notifyTempVarAlreadyExists} from 'shared/copy/notifications'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 const compact = values => uniq(values).filter(value => /\S/.test(value))
 
@@ -124,6 +125,7 @@ const TemplateVariableRow = ({
   </form>
 )
 
+@ErrorHandling
 class RowWrapper extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/containers/DashboardPage.js b/ui/src/dashboards/containers/DashboardPage.js
index a8dcdbdfe5..56b717b41e 100644
--- a/ui/src/dashboards/containers/DashboardPage.js
+++ b/ui/src/dashboards/containers/DashboardPage.js
@@ -38,6 +38,7 @@ import {presentationButtonDispatcher} from 'shared/dispatchers'
 import {interval, DASHBOARD_LAYOUT_ROW_HEIGHT} from 'shared/constants'
 import {notifyDashboardNotFound} from 'shared/copy/notifications'
 import {colorsStringSchema, colorsNumberSchema} from 'shared/schemas'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
 const FORMAT_INFLUXQL = 'influxql'
 const defaultTimeRange = {
@@ -47,6 +48,7 @@ const defaultTimeRange = {
   format: FORMAT_INFLUXQL,
 }
 
+@ErrorHandling
 class DashboardPage extends Component {
   constructor(props) {
     super(props)
diff --git a/ui/src/dashboards/containers/DashboardsPage.js b/ui/src/dashboards/containers/DashboardsPage.js
index 674944398b..1e30be0f92 100644
--- a/ui/src/dashboards/containers/DashboardsPage.js
+++ b/ui/src/dashboards/containers/DashboardsPage.js
@@ -11,7 +11,9 @@ import {createDashboard} from 'src/dashboards/apis'
 import {getDashboardsAsync, deleteDashboardAsync} from 'src/dashboards/actions'
 
 import {NEW_DASHBOARD} from 'src/dashboards/constants'
+import {ErrorHandling} from 'src/shared/decorators/errors'
 
+@ErrorHandling
 class DashboardsPage extends Component {
   componentDidMount() {
     this.props.handleGetDashboards()