grafana/ui: Fix value time zone names to be capitalized (#19417)

(cherry picked from commit 8024c39435)
2019-10-01 02:37:48 -07:00
parent 052ea8f63b
commit b2c1473e59
1 changed files with 41 additions and 0 deletions
@@ -0,0 +1,41 @@
+import React, { FC } from 'react';
+import { getTimeZoneGroups, SelectableValue } from '@grafana/data';
+import { Select } from '..';
+
+interface Props {
+  value: string;
+  width?: number;
+
+  onChange: (newValue: string) => void;
+}
+
+export const TimeZonePicker: FC<Props> = ({ onChange, value, width }) => {
+  const timeZoneGroups = getTimeZoneGroups();
+
+  const groupOptions = timeZoneGroups.map(group => {
+    const options = group.options.map(timeZone => {
+      return {
+        label: timeZone,
+        value: timeZone,
+      };
+    });
+
+    return {
+      label: group.label,
+      options,
+    };
+  });
+
+  const selectedValue = groupOptions.map(group => {
+    return group.options.find(option => option.value === value);
+  });
+
+  return (
+    <Select
+      options={groupOptions}
+      value={selectedValue}
+      onChange={(newValue: SelectableValue) => onChange(newValue.value)}
+      width={width}
+    />
+  );
+};