Use ColorScale type consistently

ui/src/shared/components/HistogramChart.tsx

@@ -16,6 +16,7 @@ import {
   HistogramData,
   Margins,
   HoverData,
+  ColorScale,
 } from 'src/types/histogram'
 
 const PADDING_TOP = 0.2
@@ -31,7 +32,7 @@ interface Props {
   dataStatus: RemoteDataState
   width: number
   height: number
-  colorScale: (group: string) => string
+  colorScale: ColorScale
   onZoom: (TimePeriod) => void
 }
 

ui/src/shared/components/HistogramChartBars.tsx

@@ -10,6 +10,7 @@ import {
   HistogramDatum,
   HoverData,
   TooltipAnchor,
+  ColorScale,
 } from 'src/types/histogram'
 
 const BAR_BORDER_RADIUS = 4
@@ -139,7 +140,7 @@ interface Props {
   data: HistogramData
   xScale: ScaleTime<number, number>
   yScale: ScaleLinear<number, number>
-  colorScale: (group: string) => string
+  colorScale: ColorScale
   hoverData?: HoverData
   onHover: (h: HoverData) => void
 }