diff --git a/ui/src/alerts/containers/AlertsApp.tsx b/ui/src/alerts/containers/AlertsApp.tsx
index 1a6b22548..35c8fd6a1 100644
--- a/ui/src/alerts/containers/AlertsApp.tsx
+++ b/ui/src/alerts/containers/AlertsApp.tsx
@@ -111,7 +111,7 @@ class AlertsApp extends PureComponent<Props, State> {
     )
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     const {timeRange} = this.state
 
     return (
diff --git a/ui/src/dashboards/components/DashboardHeader.tsx b/ui/src/dashboards/components/DashboardHeader.tsx
index 4f1c76413..aae70d65e 100644
--- a/ui/src/dashboards/components/DashboardHeader.tsx
+++ b/ui/src/dashboards/components/DashboardHeader.tsx
@@ -59,7 +59,7 @@ class DashboardHeader extends Component<Props> {
     )
   }
 
-  private renderPageTitle = (): JSX.Element => {
+  private get renderPageTitle(): JSX.Element {
     return (
       <>
         {this.dashboardSwitcher}
@@ -68,7 +68,7 @@ class DashboardHeader extends Component<Props> {
     )
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     const {
       handleChooseAutoRefresh,
       onManualRefresh,
diff --git a/ui/src/data_explorer/containers/DataExplorer.tsx b/ui/src/data_explorer/containers/DataExplorer.tsx
index 0ffc02c85..c751b50e3 100644
--- a/ui/src/data_explorer/containers/DataExplorer.tsx
+++ b/ui/src/data_explorer/containers/DataExplorer.tsx
@@ -186,7 +186,7 @@ export class DataExplorer extends PureComponent<Props, State> {
     return buildRawText(this.activeQuery, timeRange)
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     const {
       timeRange,
       autoRefresh,
diff --git a/ui/src/flux/components/FluxHeader.tsx b/ui/src/flux/components/FluxHeader.tsx
index b9f381efd..ee9c20aed 100644
--- a/ui/src/flux/components/FluxHeader.tsx
+++ b/ui/src/flux/components/FluxHeader.tsx
@@ -27,7 +27,7 @@ class FluxHeader extends PureComponent<Props> {
     )
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     return (
       <button onClick={this.overlay} className="btn btn-sm btn-default">
         Edit Connection
diff --git a/ui/src/kapacitor/components/TickscriptHeader.tsx b/ui/src/kapacitor/components/TickscriptHeader.tsx
index 2cb8db981..167c7ce58 100644
--- a/ui/src/kapacitor/components/TickscriptHeader.tsx
+++ b/ui/src/kapacitor/components/TickscriptHeader.tsx
@@ -28,7 +28,7 @@ class TickscriptHeader extends Component<Props> {
     )
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     const {
       task,
       onSave,
diff --git a/ui/src/kapacitor/containers/KapacitorRulesPage.tsx b/ui/src/kapacitor/containers/KapacitorRulesPage.tsx
index 1d602440a..92e9e3b1f 100644
--- a/ui/src/kapacitor/containers/KapacitorRulesPage.tsx
+++ b/ui/src/kapacitor/containers/KapacitorRulesPage.tsx
@@ -91,7 +91,7 @@ const PageContents: SFC<PageContentsProps> = ({children}) => (
   <div className="page">
     <PageHeader
       title="Manage Tasks"
-      renderPageControls={renderPageControls}
+      renderPageControls={renderHeaderOptions()}
       sourceIndicator={true}
     />
     <FancyScrollbar className="page-contents fancy-scroll--kapacitor">
@@ -104,7 +104,7 @@ const PageContents: SFC<PageContentsProps> = ({children}) => (
   </div>
 )
 
-const renderPageControls = (): JSX.Element => {
+const renderHeaderOptions = (): JSX.Element => {
   return (
     <QuestionMarkTooltip
       tipID="manage-tasks--tooltip"
diff --git a/ui/src/logs/components/LogViewerHeader.tsx b/ui/src/logs/components/LogViewerHeader.tsx
index fa0706d1d..7b8ef3190 100644
--- a/ui/src/logs/components/LogViewerHeader.tsx
+++ b/ui/src/logs/components/LogViewerHeader.tsx
@@ -38,7 +38,7 @@ class LogViewerHeader extends PureComponent<Props> {
     )
   }
 
-  private renderHeaderTitle = (): JSX.Element => {
+  private get renderHeaderTitle(): JSX.Element {
     return (
       <>
         {this.status}
@@ -47,7 +47,7 @@ class LogViewerHeader extends PureComponent<Props> {
     )
   }
 
-  private renderPageControls = (): JSX.Element => {
+  private get renderPageControls(): JSX.Element {
     const {timeRange} = this.props
 
     return (
diff --git a/ui/src/shared/components/PageHeader.tsx b/ui/src/shared/components/PageHeader.tsx
index 9b11b327d..6fad2f5d4 100644
--- a/ui/src/shared/components/PageHeader.tsx
+++ b/ui/src/shared/components/PageHeader.tsx
@@ -6,8 +6,8 @@ import SourceIndicator from 'src/shared/components/SourceIndicator'
 
 interface Props {
   title?: string
-  renderTitle?: () => ReactElement<any>
-  renderPageControls?: () => ReactElement<any>
+  renderTitle?: ReactElement<any>
+  renderPageControls?: ReactElement<any>
   fullWidth?: boolean
   sourceIndicator?: boolean
   inPresentationMode?: boolean
@@ -55,7 +55,7 @@ class PageHeader extends Component<Props> {
       return <Title title={title} />
     }
 
-    return renderTitle()
+    return renderTitle
   }
 
   private get renderRight(): JSX.Element {
@@ -65,7 +65,7 @@ class PageHeader extends Component<Props> {
       return
     }
 
-    return renderPageControls()
+    return renderPageControls
   }
 
   private get className(): string {
diff --git a/ui/src/status/containers/StatusPage.js b/ui/src/status/containers/StatusPage.js
index 02c528dfb..f48686270 100644
--- a/ui/src/status/containers/StatusPage.js
+++ b/ui/src/status/containers/StatusPage.js
@@ -61,7 +61,7 @@ class StatusPage extends Component {
         <PageHeader
           title="Status"
           fullWidth={true}
-          renderPageControls={this.renderPageControls}
+          renderPageControls={this.renderPageControls()}
         />
         <FancyScrollbar className="page-contents">
           <div className="dashboard container-fluid full-width">