From 261fecf8adb8794e592399962478c92eb3631acf Mon Sep 17 00:00:00 2001
From: Alex P <thealexpaxton@gmail.com>
Date: Wed, 27 Jun 2018 10:50:43 -0700
Subject: [PATCH] Improve names of states and getters

---
 .../components/DashboardsPageContents.tsx          | 10 +++++-----
 ui/src/data_explorer/containers/DataExplorer.tsx   | 12 ++++++------
 ui/src/flux/components/FluxHeader.tsx              | 14 +++++++-------
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/ui/src/dashboards/components/DashboardsPageContents.tsx b/ui/src/dashboards/components/DashboardsPageContents.tsx
index f9a73acfeb..c09b14dfcf 100644
--- a/ui/src/dashboards/components/DashboardsPageContents.tsx
+++ b/ui/src/dashboards/components/DashboardsPageContents.tsx
@@ -27,7 +27,7 @@ interface Props {
 
 interface State {
   searchTerm: string
-  showOverlay: boolean
+  isOverlayVisible: boolean
 }
 
 @ErrorHandling
@@ -37,7 +37,7 @@ class DashboardsPageContents extends Component<Props, State> {
 
     this.state = {
       searchTerm: '',
-      showOverlay: false,
+      isOverlayVisible: false,
     }
   }
 
@@ -136,15 +136,15 @@ class DashboardsPageContents extends Component<Props, State> {
   }
 
   private handleToggleOverlay = (): void => {
-    this.setState({showOverlay: !this.state.showOverlay})
+    this.setState({isOverlayVisible: !this.state.isOverlayVisible})
   }
 
   private get renderImportOverlay(): JSX.Element {
     const {onImportDashboard, notify} = this.props
-    const {showOverlay} = this.state
+    const {isOverlayVisible} = this.state
 
     return (
-      <OverlayTechnology visible={showOverlay}>
+      <OverlayTechnology visible={isOverlayVisible}>
         <ImportDashboardOverlay
           onDismissOverlay={this.handleToggleOverlay}
           onImportDashboard={onImportDashboard}
diff --git a/ui/src/data_explorer/containers/DataExplorer.tsx b/ui/src/data_explorer/containers/DataExplorer.tsx
index 5518fd0fd8..18e87ce439 100644
--- a/ui/src/data_explorer/containers/DataExplorer.tsx
+++ b/ui/src/data_explorer/containers/DataExplorer.tsx
@@ -49,7 +49,7 @@ interface Props {
 }
 
 interface State {
-  showWriteForm: boolean
+  isWriteFormVisible: boolean
 }
 
 @ErrorHandling
@@ -58,7 +58,7 @@ export class DataExplorer extends PureComponent<Props, State> {
     super(props)
 
     this.state = {
-      showWriteForm: false,
+      isWriteFormVisible: false,
     }
   }
 
@@ -101,11 +101,11 @@ export class DataExplorer extends PureComponent<Props, State> {
       queryConfigActions,
     } = this.props
 
-    const {showWriteForm} = this.state
+    const {isWriteFormVisible} = this.state
 
     return (
       <>
-        <OverlayTechnology visible={showWriteForm}>
+        <OverlayTechnology visible={isWriteFormVisible}>
           <WriteDataForm
             source={source}
             errorThrown={errorThrownAction}
@@ -152,11 +152,11 @@ export class DataExplorer extends PureComponent<Props, State> {
   }
 
   private handleCloseWriteData = (): void => {
-    this.setState({showWriteForm: false})
+    this.setState({isWriteFormVisible: false})
   }
 
   private handleOpenWriteData = (): void => {
-    this.setState({showWriteForm: true})
+    this.setState({isWriteFormVisible: true})
   }
 
   private handleChooseTimeRange = (timeRange: TimeRange): void => {
diff --git a/ui/src/flux/components/FluxHeader.tsx b/ui/src/flux/components/FluxHeader.tsx
index 7df444c17d..d6ac9769da 100644
--- a/ui/src/flux/components/FluxHeader.tsx
+++ b/ui/src/flux/components/FluxHeader.tsx
@@ -11,7 +11,7 @@ interface Props {
 }
 
 interface State {
-  showOverlay: boolean
+  isOverlayVisible: boolean
 }
 
 class FluxHeader extends PureComponent<Props, State> {
@@ -19,7 +19,7 @@ class FluxHeader extends PureComponent<Props, State> {
     super(props)
 
     this.state = {
-      showOverlay: false,
+      isOverlayVisible: false,
     }
   }
 
@@ -31,13 +31,13 @@ class FluxHeader extends PureComponent<Props, State> {
           fullWidth={true}
           optionsComponents={this.optionsComponents}
         />
-        {this.renderOverlay}
+        {this.overlay}
       </>
     )
   }
 
   private handleToggleOverlay = (): void => {
-    this.setState({showOverlay: !this.state.showOverlay})
+    this.setState({isOverlayVisible: !this.state.isOverlayVisible})
   }
 
   private get optionsComponents(): JSX.Element {
@@ -51,12 +51,12 @@ class FluxHeader extends PureComponent<Props, State> {
     )
   }
 
-  private get renderOverlay(): JSX.Element {
+  private get overlay(): JSX.Element {
     const {service} = this.props
-    const {showOverlay} = this.state
+    const {isOverlayVisible} = this.state
 
     return (
-      <OverlayTechnology visible={showOverlay}>
+      <OverlayTechnology visible={isOverlayVisible}>
         <FluxOverlay
           mode="edit"
           service={service}