diff --git a/ui/src/types/index.ts b/ui/src/types/index.ts
index 76870d39db..f3c23aa001 100644
--- a/ui/src/types/index.ts
+++ b/ui/src/types/index.ts
@@ -1,3 +1,4 @@
+import {LayoutCell, LayoutQuery} from './layouts'
 import {Service, NewService} from './services'
 import {AuthLinks, Organization, Role, User, Me} from './auth'
 import {Template, Cell, CellQuery, Legend, Axes} from './dashboard'
@@ -58,4 +59,6 @@ export {
   Axes,
   Service,
   NewService,
+  LayoutCell,
+  LayoutQuery,
 }
diff --git a/ui/src/types/layouts.ts b/ui/src/types/layouts.ts
new file mode 100644
index 0000000000..f33df0c2f6
--- /dev/null
+++ b/ui/src/types/layouts.ts
@@ -0,0 +1,16 @@
+export interface LayoutCell {
+  x: number
+  y: number
+  w: number
+  h: number
+  i: string
+  name: string
+  queries: LayoutQuery[]
+}
+
+export interface LayoutQuery {
+  query: string
+  label: string
+  wheres: string[]
+  groupbys: string[]
+}
diff --git a/ui/src/utils/buildQueriesForLayouts.js b/ui/src/utils/buildQueriesForLayouts.ts
similarity index 82%
rename from ui/src/utils/buildQueriesForLayouts.js
rename to ui/src/utils/buildQueriesForLayouts.ts
index 91f0af19fe..cb13fc8b9d 100644
--- a/ui/src/utils/buildQueriesForLayouts.js
+++ b/ui/src/utils/buildQueriesForLayouts.ts
@@ -1,18 +1,23 @@
-import {buildQuery} from 'utils/influxql'
+import {buildQuery} from 'src/utils/influxql'
 import {TYPE_SHIFTED, TYPE_QUERY_CONFIG} from 'src/dashboards/constants'
 import {
   TEMP_VAR_DASHBOARD_TIME,
   TEMP_VAR_UPPER_DASHBOARD_TIME,
 } from 'src/shared/constants'
-import {timeRanges} from 'shared/data/timeRanges'
+import {timeRanges} from 'src/shared/data/timeRanges'
+import {Source, LayoutQuery, TimeRange} from 'src/types'
 
-const buildCannedDashboardQuery = (query, {lower, upper}, host) => {
+const buildCannedDashboardQuery = (
+  query: LayoutQuery,
+  {lower, upper}: TimeRange,
+  host: string
+): string => {
   const {defaultGroupBy} = timeRanges.find(range => range.lower === lower) || {
     defaultGroupBy: '5m',
   }
   const {wheres, groupbys} = query
 
-  let text = query.text
+  let text = query.query
 
   if (upper) {
     text += ` where time > '${lower}' AND time < '${upper}'`
@@ -43,7 +48,12 @@ const buildCannedDashboardQuery = (query, {lower, upper}, host) => {
   return text
 }
 
-export const buildQueriesForLayouts = (cell, source, timeRange, host) => {
+export const buildQueriesForLayouts = (
+  cell,
+  source: Source,
+  timeRange: TimeRange,
+  host: string
+) => {
   return cell.queries.map(query => {
     let queryText
     // Canned dashboards use an different a schema different from queryConfig.