[TEST] Update vim- DO NOT MERGE

packages/app/src/app/components/CodeEditor/Configuration/index.tsx

@@ -17,7 +17,8 @@ type Props = EditorProps & {
   toggleConfigUI: () => void;
 };
 
-export class Configuration extends React.PureComponent<Props>
+export class Configuration
+  extends React.PureComponent<Props>
   implements Editor {
   disposeInitializer?: Function;
 

packages/app/src/app/components/CodeEditor/VSCode/Configuration/index.tsx

@@ -26,9 +26,11 @@ type Props = EditorProps & {
   onDispose: (cb: () => void) => void;
   openText: () => void;
   theme: any;
+  createFile: () => void;
 };
 
-export class ConfigurationComponent extends React.PureComponent<Props>
+export class ConfigurationComponent
+  extends React.PureComponent<Props>
   implements Editor {
   disposeInitializer: Function;
   currentModule: Module;
@@ -155,6 +157,7 @@ export class ConfigurationComponent extends React.PureComponent<Props>
             sandbox={sandbox}
             updateFile={this.updateFile}
             file={this.props.getCode()}
+            updateFaker={this.props.updateFaker}
           />
         </ThemeProvider>
       </Container>

packages/app/src/app/components/CodeEditor/VSCode/index.tsx

@@ -44,6 +44,7 @@ export const VSCode: React.FunctionComponent = () => {
                   onChange={(code, moduleShortid) =>
                     actions.editor.codeChanged({ code, moduleShortid })
                   }
+                  updateFaker={actions.files.updateFakerDataFile}
                   // Copy the object, we don't want mutations in the component
                   currentModule={json(getCurrentModule())}
                   config={config}

packages/app/src/app/overmind/effects/api/index.ts

@@ -176,6 +176,9 @@ export default {
       id: sandboxId,
     });
   },
+  generateFakerData(fakerConfig: object) {
+    return api.post<object>(`/faker`, fakerConfig);
+  },
   savePrivacy(sandboxId: string, privacy: 0 | 1 | 2) {
     return api.patch<SandboxAPIResponse>(`/sandboxes/${sandboxId}/privacy`, {
       sandbox: {

packages/app/src/app/overmind/namespaces/files/actions.ts

@@ -890,3 +890,28 @@ export const syncSandbox: AsyncAction<any[]> = async (
       state.editor.currentSandbox
     );
 };
+
+export const updateFakerDataFile: AsyncAction<object> = async (
+  { state, actions, effects },
+  fakerConfig
+) => {
+  if (!fakerConfig) return;
+
+  const json = await effects.api.generateFakerData(fakerConfig);
+
+  const jsonFile = state.editor.modulesByPath['/data.json'];
+  const code = JSON.stringify(json, null, 2);
+  if (jsonFile) {
+    actions.editor.codeSaved({
+      moduleShortid: jsonFile.shortid,
+      code,
+      cbID: null,
+    });
+  } else {
+    actions.files.moduleCreated({
+      title: 'data.json',
+      code,
+      directoryShortid: null,
+    });
+  }
+};

packages/app/src/app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/Entry/EntryIcons/getIconURL.ts

@@ -4,6 +4,7 @@ import folderSvg from '@codesandbox/common/lib/icons/folder.svg';
 import folderOpenSvg from '@codesandbox/common/lib/icons/folder-open.svg';
 import imageSvg from '@codesandbox/common/lib/icons/image.svg';
 import nowSvg from '@codesandbox/common/lib/icons/now.svg';
+import fakerSVG from '@codesandbox/common/lib/icons/faker.svg';
 
 const imageExists = async (url: string): Promise<boolean> =>
   new Promise((resolve, reject) => {
@@ -21,6 +22,7 @@ export const getIconURL = async (type: string): Promise<string> => {
   const defaultURL = `${base}/${type}.svg`;
   const URLByType = {
     codesandbox: CodeSandboxSvg,
+    faker: fakerSVG,
     image: imageSvg,
     now: nowSvg,
     directory: folderSvg,

packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/ConfigurationFiles/Icons.tsx

@@ -125,6 +125,32 @@ export const JSIcon = props => (
   </svg>
 );
 
+export const FakerIcon = props => (
+  <svg width={16} height={16} fill="none" viewBox="0 0 100 100" {...props}>
+    <path fill="#fff" d="M0 0H100V100H0z" />
+    <path fill="url(#pattern0)" d="M27 4H70V96H27z" />
+    <defs>
+      <pattern
+        id="pattern0"
+        width={1}
+        height={1}
+        patternContentUnits="objectBoundingBox"
+      >
+        <use
+          transform="matrix(.02326 0 0 .01087 -.302 -.087)"
+          xlinkHref="#image0"
+        />
+      </pattern>
+      <image
+        id="image0"
+        width={394}
+        height={128}
+        xlinkHref="data:image/png;base64,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"
+      />
+    </defs>
+  </svg>
+);
+
 export const CodeSandboxIcon = props => (
   <svg width={16} height={16} viewBox="0 0 16 16" {...props}>
     <g id="Page-1" fill="none" fillRule="evenodd" stroke="none" strokeWidth={1}>

packages/app/src/app/pages/Sandbox/Editor/Workspace/screens/ConfigurationFiles/index.tsx

@@ -21,6 +21,7 @@ import {
   VercelIcon,
   JSIcon,
   CodeSandboxIcon,
+  FakerIcon,
 } from './Icons';
 
 const getIcon = name => {
@@ -32,6 +33,7 @@ const getIcon = name => {
     'jsconfig.json': JSIcon,
     'tsconfig.json': TypescriptIcon,
     'sandbox.config.json': CodeSandboxIcon,
+    'faker-config.codesandbox.json': FakerIcon,
   };
 
   return icons[name] || JSIcon;

packages/app/src/app/utils/get-type.ts

@@ -22,6 +22,7 @@ const specialCasesMap = {
   'yarn.lock': 'yarn',
   'package.json': 'npm',
   'sandbox.config.json': 'codesandbox',
+  'faker-config.codesandbox.json': 'faker',
   'now.json': 'now',
   prisma: 'prisma',
   'netlify.toml': 'netlify',

packages/common/src/components/Preference/index.tsx

@@ -24,6 +24,7 @@ type PreferenceProps<TString extends PreferenceType> = {
   tooltip?: string;
   options?: any[];
   type: TString;
+  onChange?: any;
 };
 
 export type BooleanPreference = PreferenceProps<'boolean'> &