chore: reorganize file structure

src/__stories__/JsonSchemaViewer.tsx

@@ -4,7 +4,7 @@ import { State, Store } from '@sambego/storybook-state';
 import { action } from '@storybook/addon-actions';
 import { boolean, number, object, text, withKnobs } from '@storybook/addon-knobs';
 import { storiesOf } from '@storybook/react';
-import { JsonSchemaViewer } from '../JsonSchemaViewer';
+import { JsonSchemaViewer } from '../components/JsonSchemaViewer';
 
 import * as schema from '../__fixtures__/default-schema.json';
 import * as schemaWithRefs from '../__fixtures__/ref/original.json';

src/JsonSchemaViewer.tsx → src/components/JsonSchemaViewer.tsx

@@ -2,14 +2,13 @@ import { TreeStore } from '@stoplight/tree-list';
 import { Omit } from '@stoplight/types';
 import { runInAction } from 'mobx';
 import * as React from 'react';
-import { ErrorMessage } from './components/common/ErrorMessage';
-import { MutedText } from './components/common/MutedText';
-import { ISchemaView, SchemaView } from './SchemaView';
-import { ThemeZone } from './theme';
-import { isSchemaViewerEmpty } from './utils/isSchemaViewerEmpty';
-import { renderSchema } from './utils/renderSchema';
-
-export interface IJsonSchemaViewer extends Omit<ISchemaView, 'emptyText' | 'treeStore'> {
+import { ThemeZone } from '../theme';
+import { isSchemaViewerEmpty, renderSchema } from '../utils';
+import { ErrorMessage } from './common/ErrorMessage';
+import { MutedText } from './common/MutedText';
+import { ISchemaTree, SchemaTree } from './SchemaTree';
+
+export interface IJsonSchemaViewer extends Omit<ISchemaTree, 'emptyText' | 'treeStore'> {
   emptyText?: string;
   defaultExpandedDepth?: number;
 }
@@ -90,7 +89,7 @@ export class JsonSchemaViewer extends React.PureComponent<IJsonSchemaViewer, IJs
 
     return (
       <ThemeZone name="json-schema-viewer">
-        <SchemaView expanded={expanded} name={name} schema={schema} treeStore={this.treeStore} {...props} />
+        <SchemaTree expanded={expanded} name={name} schema={schema} treeStore={this.treeStore} {...props} />
       </ThemeZone>
     );
   }

src/components/MaskedSchema.tsx

@@ -1,6 +1,6 @@
 import { Dialog } from '@stoplight/ui-kit';
 import * as React from 'react';
-import { IJsonSchemaViewer, JsonSchemaViewer } from '../JsonSchemaViewer';
+import { IJsonSchemaViewer, JsonSchemaViewer } from './JsonSchemaViewer';
 
 export interface IMaskedSchema extends IJsonSchemaViewer {
   onClose(): void;

src/components/Property.tsx → src/components/SchemaRow.tsx

@@ -2,10 +2,7 @@ import { Omit } from '@stoplight/types';
 import { Box, Button, Checkbox, Flex, IBox } from '@stoplight/ui-kit';
 import * as React from 'react';
 import { IMasking, SchemaNodeWithMeta } from '../types';
-import { formatRef } from '../utils/formatRef';
-import { isCombiner } from '../utils/isCombiner';
-import { isRef } from '../utils/isRef';
-import { pathToString } from '../utils/pathToString';
+import { formatRef, isCombiner, isRef, pathToString } from '../utils';
 import { Additional } from './Additional';
 import { MutedText } from './common/MutedText';
 import { Divider } from './Divider';
@@ -14,12 +11,12 @@ import { Type } from './Type';
 import { Types } from './Types';
 import { Validations } from './Validations';
 
-export interface IProperty extends Omit<IBox, 'onClick'>, IMasking {
+export interface ISchemaRow extends Omit<IBox, 'onClick'>, IMasking {
   node: SchemaNodeWithMeta;
   onMaskEdit(node: SchemaNodeWithMeta): void;
 }
 
-export const Property: React.FunctionComponent<IProperty> = ({
+export const SchemaRow: React.FunctionComponent<ISchemaRow> = ({
   node,
   canSelect,
   onSelect,

src/SchemaView.tsx → src/components/SchemaTree.tsx

@@ -4,18 +4,18 @@ import { Box, IBox, ThemeZone } from '@stoplight/ui-kit';
 import { JSONSchema4 } from 'json-schema';
 import _isEmpty = require('lodash/isEmpty');
 import * as React from 'react';
-import { MaskedSchema } from './components/MaskedSchema';
-import { IProperty, Property } from './components/Property';
-import { TopBar } from './components/TopBar';
-import { useMetadata } from './hooks/useMetadata';
+import { useMetadata } from '../hooks';
+import { useTheme } from '../theme';
+import { IMasking, SchemaNodeWithMeta } from '../types';
+import { lookupRef } from '../utils';
 import { IJsonSchemaViewer } from './JsonSchemaViewer';
-import { useTheme } from './theme';
-import { IMasking, SchemaNodeWithMeta } from './types';
-import { lookupRef } from './utils/lookupRef';
+import { MaskedSchema } from './MaskedSchema';
+import { ISchemaRow, SchemaRow } from './SchemaRow';
+import { TopBar } from './TopBar';
 
 const canDrag = () => false;
 
-export interface ISchemaView extends Omit<IBox, 'onSelect'>, IMasking {
+export interface ISchemaTree extends Omit<IBox, 'onSelect'>, IMasking {
   name?: string;
   dereferencedSchema?: JSONSchema4;
   schema: JSONSchema4;
@@ -24,7 +24,7 @@ export interface ISchemaView extends Omit<IBox, 'onSelect'>, IMasking {
   treeStore: TreeStore;
 }
 
-export const SchemaView: React.FunctionComponent<ISchemaView> = props => {
+export const SchemaTree: React.FunctionComponent<ISchemaTree> = props => {
   const {
     emptyText,
     expanded = false,
@@ -44,7 +44,7 @@ export const SchemaView: React.FunctionComponent<ISchemaView> = props => {
 
   const metadata = useMetadata(schema);
 
-  const handleMaskEdit = React.useCallback<IProperty['onMaskEdit']>(
+  const handleMaskEdit = React.useCallback<ISchemaRow['onMaskEdit']>(
     node => {
       setMaskedSchema(lookupRef(node.path, dereferencedSchema));
     },
@@ -84,7 +84,7 @@ export const SchemaView: React.FunctionComponent<ISchemaView> = props => {
           canDrag={canDrag}
           store={treeStore}
           onNodeClick={handleNodeClick}
-          rowRenderer={node => <Property node={node.metadata as SchemaNodeWithMeta} {...itemData} />}
+          rowRenderer={node => <SchemaRow node={node.metadata as SchemaNodeWithMeta} {...itemData} />}
         />
       </ThemeZone>
     </Box>

src/__tests__/JsonSchemaViewer.spec.tsx → src/components/__tests__/JsonSchemaViewer.spec.tsx

@@ -1,13 +1,13 @@
 import { shallow } from 'enzyme';
 import 'jest-enzyme';
 import * as React from 'react';
-import { MutedText } from '../components/common/MutedText';
+import { isSchemaViewerEmpty } from '../../utils';
+import { MutedText } from '../common/MutedText';
 import { JsonSchemaViewer } from '../JsonSchemaViewer';
-import { SchemaView } from '../SchemaView';
-import { isSchemaViewerEmpty } from '../utils/isSchemaViewerEmpty';
+import { SchemaTree } from '../SchemaTree';
 
-jest.mock('../theme');
-jest.mock('../utils/isSchemaViewerEmpty');
+jest.mock('../../theme');
+jest.mock('../../utils/isSchemaViewerEmpty');
 
 const schema = {
   properties: {
@@ -32,14 +32,14 @@ describe('JSON Schema Viewer component', () => {
     const wrapper = shallow(<JsonSchemaViewer schema={{}} />);
     expect(isSchemaViewerEmpty).toHaveBeenCalledWith({});
     expect(wrapper.find(MutedText)).toExist();
-    expect(wrapper.find(SchemaView)).not.toExist();
+    expect(wrapper.find(SchemaTree)).not.toExist();
   });
 
   test('should render SchemaView if schema is provided', () => {
     (isSchemaViewerEmpty as jest.Mock).mockReturnValue(false);
     const wrapper = shallow(<JsonSchemaViewer schema={schema} />);
     expect(isSchemaViewerEmpty).toHaveBeenCalledWith(schema);
     expect(wrapper.find(MutedText)).not.toExist();
-    expect(wrapper.find(SchemaView)).toExist();
+    expect(wrapper.find(SchemaTree)).toExist();
   });
 });

src/__tests__/SchemaView.spec.tsx → src/components/__tests__/SchemaTree.spec.tsx

@@ -4,14 +4,12 @@ import 'jest-enzyme';
 import { JSONSchema4 } from 'json-schema';
 import * as React from 'react';
 import { ReactElement } from 'react';
-import { Property } from '../components/Property';
-import { TopBar } from '../components/TopBar';
-import { useMetadata } from '../hooks/useMetadata';
-import { SchemaView } from '../SchemaView';
-import { ITreeNodeMeta } from '../types';
+import { SchemaRow, SchemaTree, TopBar } from '../../components';
+import { useMetadata } from '../../hooks';
+import { ITreeNodeMeta } from '../../types';
 
-jest.mock('../theme');
-jest.mock('../hooks/useMetadata');
+jest.mock('../../theme');
+jest.mock('../../hooks');
 
 const schema: JSONSchema4 = {
   type: 'object',
@@ -31,7 +29,7 @@ const schema: JSONSchema4 = {
   },
 };
 
-describe('SchemaView component', () => {
+describe('SchemaTree component', () => {
   let useStateSpy: jest.SpyInstance;
   let setStateActionSpy: jest.Mock;
   let store: TreeStore;
@@ -52,12 +50,12 @@ describe('SchemaView component', () => {
 
   describe('top bar', () => {
     test('should not be rendered if hideTopBar is truthy', () => {
-      const wrapper = shallow(<SchemaView schema={schema} treeStore={store} hideTopBar />);
+      const wrapper = shallow(<SchemaTree schema={schema} treeStore={store} hideTopBar />);
       expect(wrapper.find(TopBar)).not.toExist();
     });
 
     test('should be rendered if name is given', () => {
-      const wrapper = shallow(<SchemaView schema={schema} treeStore={store} name="test" />);
+      const wrapper = shallow(<SchemaTree schema={schema} treeStore={store} name="test" />);
       expect(wrapper.find(TopBar)).toExist();
       expect(wrapper.find(TopBar)).toHaveProp('name', 'test');
     });
@@ -68,7 +66,7 @@ describe('SchemaView component', () => {
         $schema: 'schema',
       });
 
-      const wrapper = shallow(<SchemaView schema={schema} treeStore={store} name="test" />);
+      const wrapper = shallow(<SchemaTree schema={schema} treeStore={store} name="test" />);
       expect(wrapper.find(TopBar)).toExist();
       expect(wrapper.find(TopBar)).toHaveProp('name', 'test');
     });
@@ -79,14 +77,14 @@ describe('SchemaView component', () => {
         $schema: 'schema',
       });
 
-      const wrapper = shallow(<SchemaView schema={schema} treeStore={store} name="test" hideTopBar />);
+      const wrapper = shallow(<SchemaTree schema={schema} treeStore={store} name="test" hideTopBar />);
       expect(wrapper.find(TopBar)).not.toExist();
     });
   });
 
   describe('tree-list', () => {
     test('should be rendered', () => {
-      const wrapper = shallow(<SchemaView schema={schema} treeStore={store} />);
+      const wrapper = shallow(<SchemaTree schema={schema} treeStore={store} />);
 
       expect(wrapper.find(TreeList)).toExist();
       expect(wrapper.find(TreeList)).toHaveProp({
@@ -97,20 +95,20 @@ describe('SchemaView component', () => {
     });
 
     test('should be not draggable', () => {
-      const treeList = shallow(<SchemaView schema={schema} treeStore={store} />).find(TreeList);
+      const treeList = shallow(<SchemaTree schema={schema} treeStore={store} />).find(TreeList);
 
       expect(treeList.prop('canDrag')).toHaveLength(0);
       expect(treeList.prop('canDrag')!({} as any)).toBe(false);
     });
 
     test('should have extra padding if top bar is rendered', () => {
-      const treeList = shallow(<SchemaView schema={schema} treeStore={store} name="my-schema" />).find(TreeList);
+      const treeList = shallow(<SchemaTree schema={schema} treeStore={store} name="my-schema" />).find(TreeList);
 
       expect(treeList).toHaveProp('top', '40px');
     });
 
     test('should render property for each row', () => {
-      const treeList = shallow(<SchemaView schema={schema} treeStore={store} />).find(TreeList);
+      const treeList = shallow(<SchemaTree schema={schema} treeStore={store} />).find(TreeList);
       const node: TreeListNode<ITreeNodeMeta> = {
         id: 'random-id',
         level: 0,
@@ -123,7 +121,7 @@ describe('SchemaView component', () => {
       const rendered = treeList.prop('rowRenderer')!(node) as ReactElement<any>;
 
       expect(rendered).toMatchObject({
-        type: Property,
+        type: SchemaRow,
         props: expect.objectContaining({
           node: node.metadata,
         }),

src/components/index.ts

@@ -0,0 +1,8 @@
+export * from './Divider';
+export * from './JsonSchemaViewer';
+export * from './MaskedSchema';
+export * from './SchemaRow';
+export * from './SchemaTree';
+export * from './TopBar';
+export * from './Type';
+export * from './Types';

src/hooks/index.ts

@@ -0,0 +1 @@
+export * from './useMetadata';

src/index.ts

@@ -1,2 +1,2 @@
-export * from './JsonSchemaViewer';
+export * from './components/JsonSchemaViewer';
 export { ThemeProvider } from './theme';

src/utils/index.ts

@@ -0,0 +1,12 @@
+export * from './assignId';
+export * from './formatRef';
+export * from './getAnnotations';
+export * from './getMetadata';
+export * from './getValidations';
+export * from './isCombiner';
+export * from './isRef';
+export * from './isSchemaViewerEmpty';
+export * from './lookupRef';
+export * from './pathToString';
+export * from './renderSchema';
+export * from './walk';