diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4480991e8..f71bd1195 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 
 1.  [#3252](https://github.com/influxdata/chronograf/pull/3252): Allows users to select tickscript editor with mouse
 1.  [#3279](https://github.com/influxdata/chronograf/pull/3279): Change color when value is equal to or greater than threshold value
+1.  [#3281](https://github.com/influxdata/chronograf/pull/3281): Fix base path for kapacitor logs
 
 ## v1.4.4.1 [2018-04-16]
 
diff --git a/ui/src/dashboards/constants/templateControlBar.js b/ui/src/dashboards/constants/templateControlBar.js
index fd013d0eb..5a8f3eea8 100644
--- a/ui/src/dashboards/constants/templateControlBar.js
+++ b/ui/src/dashboards/constants/templateControlBar.js
@@ -1,16 +1,21 @@
 import _ from 'lodash'
 import calculateSize from 'calculate-size'
 
-export const minDropdownWidth = 146
-export const maxDropdownWidth = 300
+export const minDropdownWidth = 120
+export const maxDropdownWidth = 330
 export const dropdownPadding = 30
 
 const valueLength = a => _.size(a.value)
 
-export const calculateDropdownWidth = (values = []) => {
-  const longestValue = _.maxBy(values, valueLength)
+export const calculateDropdownWidth = values => {
+  if (!values || !values.length) {
+    return minDropdownWidth
+  }
+
+  const longest = _.maxBy(values, valueLength)
+
   const longestValuePixels =
-    calculateSize(longestValue, {
+    calculateSize(longest.value, {
       font: 'Monospace',
       fontSize: '12px',
     }).width + dropdownPadding
diff --git a/ui/src/kapacitor/apis/index.js b/ui/src/kapacitor/apis/index.js
index 01155b43d..984e714e4 100644
--- a/ui/src/kapacitor/apis/index.js
+++ b/ui/src/kapacitor/apis/index.js
@@ -107,21 +107,22 @@ const kapacitorLogHeaders = {
 }
 
 export const getLogStream = kapacitor =>
-  fetch(`${kapacitor.links.proxy}?path=/kapacitor/v1preview/logs`, {
+  AJAX({
+    url: `${kapacitor.links.proxy}?path=/kapacitor/v1preview/logs`,
     method: 'GET',
     headers: kapacitorLogHeaders,
     credentials: 'include',
   })
 
 export const getLogStreamByRuleID = (kapacitor, ruleID) =>
-  fetch(
-    `${kapacitor.links.proxy}?path=/kapacitor/v1preview/logs?task=${ruleID}`,
-    {
-      method: 'GET',
-      headers: kapacitorLogHeaders,
-      credentials: 'include',
-    }
-  )
+  AJAX({
+    url: `${
+      kapacitor.links.proxy
+    }?path=/kapacitor/v1preview/logs?task=${ruleID}`,
+    method: 'GET',
+    headers: kapacitorLogHeaders,
+    credentials: 'include',
+  })
 
 export const pingKapacitorVersion = async kapacitor => {
   try {
diff --git a/ui/src/shared/decorators/errors.tsx b/ui/src/shared/decorators/errors.tsx
index 5d1d384d1..2f6ddff72 100644
--- a/ui/src/shared/decorators/errors.tsx
+++ b/ui/src/shared/decorators/errors.tsx
@@ -1,38 +1,53 @@
-/* tslint:disable no-console */
-import React from 'react'
+/* 
+tslint:disable no-console 
+tslint:disable max-classes-per-file
+*/
 
-export function ErrorHandling<
-  P,
-  S,
-  T extends {new (...args: any[]): React.Component<P, S>}
->(constructor: T) {
-  class Wrapped extends constructor {
-    public static get displayName(): string {
-      return constructor.name
-    }
+import React, {ComponentClass, Component} from 'react'
 
-    private error: boolean = false
+class DefaultError extends Component {
+  public render() {
+    return (
+      <p className="error">
+        A Chronograf error has occurred. Please report the issue&nbsp;
+        <a href="https://github.com/influxdata/chronograf/issues">here</a>.
+      </p>
+    )
+  }
+}
 
-    public componentDidCatch(error, info) {
-      console.error(error)
-      console.warn(info)
-      this.error = true
-      this.forceUpdate()
-    }
-
-    public render() {
-      if (this.error) {
-        return (
-          <p className="error">
-            A Chronograf error has occurred. Please report the issue&nbsp;
-            <a href="https://github.com/influxdata/chronograf/issues">here</a>.
-          </p>
-        )
+export function ErrorHandlingWith(
+  Error: ComponentClass, // Must be a class based component and not an SFC
+  alwaysDisplay = false
+) {
+  return <P, S, T extends {new (...args: any[]): Component<P, S>}>(
+    constructor: T
+  ) => {
+    class Wrapped extends constructor {
+      public static get displayName(): string {
+        return constructor.name
       }
 
-      return super.render()
-    }
-  }
+      private error: boolean = false
 
-  return Wrapped
+      public componentDidCatch(err, info) {
+        console.error(err)
+        console.warn(info)
+        this.error = true
+        this.forceUpdate()
+      }
+
+      public render() {
+        if (this.error || alwaysDisplay) {
+          return <Error />
+        }
+
+        return super.render()
+      }
+    }
+
+    return Wrapped
+  }
 }
+
+export const ErrorHandling = ErrorHandlingWith(DefaultError)