fixed imports and fixed bug with default printer code

Author: jaredpetersen

src/editor/document/index.js

@@ -35,19 +35,22 @@ class Document extends Component {
   constructor(props) {
     super(props);
 
+    this.defaultCode =
+      '// Welcome to codeprinter!\n' +
+      'const foo = () => {\n' +
+      "  console.log('This is where your code will be printed out!');\n" +
+      '};';
+
     this.state = {
-      code:
-        '// Welcome to codeprinter!\n' +
-        'const foo = () => {\n' +
-        "  console.log('This is where your code will be printed out!');\n" +
-        '};'
+      code: this.defaultCode
     };
 
     this.onChange = this.onChange.bind(this);
   }
 
   onChange(event) {
-    this.setState({ code: event.target.value });
+    const code = event.target.value === '' ? this.defaultCode : event.target.value;
+    this.setState({ code });
   }
 
   render() {

src/editor/document/index.story.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import 'bootstrap/dist/css/bootstrap.css';
-import Document from './index.js';
+import Document from './index';
 
 storiesOf('Editor/Document', module).add('default', () => (
   <Document font={'Anonymous Pro'} size={12} theme={'GitHub'} numbers={true} />

src/editor/document/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { shallow } from 'enzyme';
-import { Document, themes } from './index.js';
+import { Document, themes } from './index';
 import { Input } from 'reactstrap';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 

src/editor/index.story.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import 'bootstrap/dist/css/bootstrap.css';
-import Editor from './index.js';
+import Editor from './index';
 
 storiesOf('Editor', module).add('default', () => <Editor />);

src/editor/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { shallow, mount } from 'enzyme';
-import Editor from './index.js';
+import Editor from './index';
 import Toolbar from './toolbar';
 import Document from './document';
 import FontDropdown from './toolbar/font-dropdown';

src/editor/toolbar/font-dropdown/index.story.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
 import 'bootstrap/dist/css/bootstrap.css';
-import FontDropdown from './index.js';
+import FontDropdown from './index';
 
 storiesOf('Editor/Toolbar/FontDropdown', module).add('default', () => {
   const fonts = ['Anonymous Pro', 'Cousine', 'Cutive Mono'];

src/editor/toolbar/font-dropdown/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { shallow } from 'enzyme';
-import FontDropdown from './index.js';
+import FontDropdown from './index';
 import { DropdownItem } from 'reactstrap';
 
 describe('Editor Toolbar FontDropdown', () => {

src/editor/toolbar/index.story.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
 import 'bootstrap/dist/css/bootstrap.css';
-import Toolbar from './index.js';
+import Toolbar from './index';
 
 storiesOf('Editor/Toolbar', module).add('default', () => {
   const fonts = ['Anonymous Pro', 'Cousine', 'Cutive Mono'];

src/editor/toolbar/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { shallow } from 'enzyme';
-import Toolbar from './index.js';
+import Toolbar from './index';
 import FontDropdown from './font-dropdown';
 import SizeDropdown from './size-dropdown';
 import ThemeDropdown from './theme-dropdown';

src/editor/toolbar/size-dropdown/index.story.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
 import 'bootstrap/dist/css/bootstrap.css';
-import SizeDropdown from './index.js';
+import SizeDropdown from './index';
 
 storiesOf('Editor/Toolbar/SizeDropdown', module).add('default', () => {
   const sizes = [8, 9, 10, 11, 12];