Fixed circular dependency warnings

Summary:
Nobody moves the hackathon!

Fixed some circular deps warnings while waiting for another Diff to land

Reviewed By: priteshrnandgaonkar

Differential Revision: D18749645

fbshipit-source-id: 225fbea428dca02f0f4c920ee47b4ece3c3e370b

src/ui/components/StatusIndicator.tsx

@@ -7,7 +7,9 @@
  * @format
  */
 
-import {colors, styled} from 'flipper';
+import styled from 'react-emotion';
+import {colors} from './colors';
+
 import {BackgroundColorProperty, HeightProperty} from 'csstype';
 
 type Props = {

src/ui/components/data-inspector/DataInspector.tsx

@@ -15,7 +15,7 @@ import Tooltip from '../Tooltip';
 import styled from 'react-emotion';
 import createPaste from '../../../fb-stubs/createPaste';
 import {reportInteraction} from '../../../utils/InteractionTracker';
-import DataPreview from './DataPreview';
+import DataPreview, {DataValueExtractor, InspectorName} from './DataPreview';
 import {getSortedKeys} from './utils';
 import {colors} from '../colors';
 import {clipboard} from 'electron';
@@ -23,6 +23,8 @@ import deepEqual from 'deep-equal';
 import React from 'react';
 import {TooltipOptions} from '../TooltipProvider.js';
 
+export {DataValueExtractor} from './DataPreview';
+
 const BaseContainer = styled('div')(
   (props: {depth?: number; disabled?: boolean}) => ({
     fontFamily: 'Menlo, monospace',
@@ -60,28 +62,11 @@ const ExpandControl = styled('span')({
 });
 ExpandControl.displayName = 'DataInspector:ExpandControl';
 
-export const InspectorName = styled('span')({
-  color: colors.grapeDark1,
-});
-InspectorName.displayName = 'DataInspector:InspectorName';
-
 const nameTooltipOptions: TooltipOptions = {
   position: 'toLeft',
   showTail: true,
 };
 
-export type DataValueExtractor = (
-  value: any,
-  depth: number,
-) =>
-  | {
-      mutable: boolean;
-      type: string;
-      value: any;
-    }
-  | undefined
-  | null;
-
 export type DataInspectorSetValue = (path: Array<string>, val: any) => void;
 
 export type DataInspectorExpanded = {

src/ui/components/data-inspector/DataPreview.tsx

@@ -7,12 +7,29 @@
  * @format
  */
 
-import {DataValueExtractor, InspectorName} from './DataInspector';
 import DataDescription from './DataDescription';
 import styled from 'react-emotion';
 import {getSortedKeys} from './utils';
 import {PureComponent} from 'react';
 import React from 'react';
+import {colors} from '../colors';
+
+export type DataValueExtractor = (
+  value: any,
+  depth: number,
+) =>
+  | {
+      mutable: boolean;
+      type: string;
+      value: any;
+    }
+  | undefined
+  | null;
+
+export const InspectorName = styled('span')({
+  color: colors.grapeDark1,
+});
+InspectorName.displayName = 'DataInspector:InspectorName';
 
 const PreviewContainer = styled('span')({
   fontStyle: 'italic',

src/ui/components/data-inspector/ManagedDataInspector.tsx

@@ -7,10 +7,11 @@
  * @format
  */
 
-import {DataValueExtractor, DataInspectorExpanded} from './DataInspector';
+import {DataInspectorExpanded} from './DataInspector';
 import {PureComponent} from 'react';
 import DataInspector from './DataInspector';
 import React from 'react';
+import {DataValueExtractor} from './DataPreview';
 
 type ManagedDataInspectorProps = {
   /**