Merge 8154e13 into 6fc6eb8

packages/app/client/src/ui/shell/mdi/documents/documents.spec.tsx

@@ -0,0 +1,82 @@
+//
+// Copyright (c) Microsoft. All rights reserved.
+// Licensed under the MIT license.
+//
+// Microsoft Bot Framework: http://botframework.com
+//
+// Bot Framework Emulator Github:
+// https://github.com/Microsoft/BotFramwork-Emulator
+//
+// Copyright (c) Microsoft Corporation
+// All rights reserved.
+//
+// MIT License:
+// Permission is hereby granted, free of charge, to any person obtaining
+// a copy of this software and associated documentation files (the
+// "Software"), to deal in the Software without restriction, including
+// without limitation the rights to use, copy, modify, merge, publish,
+// distribute, sublicense, and/or sell copies of the Software, and to
+// permit persons to whom the Software is furnished to do so, subject to
+// the following conditions:
+//
+// The above copyright notice and this permission notice shall be
+// included in all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED ""AS IS"", WITHOUT WARRANTY OF ANY KIND,
+// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+//
+
+import * as React from 'react';
+import { mount } from 'enzyme';
+import { createStore } from 'redux';
+import { Provider } from 'react-redux';
+import { DocumentsContainer } from './documentsContainer';
+
+const mockTabbedDocument = class Document extends React.Component {
+  public render() {
+    return <div></div>;
+  }
+};
+
+const mockEditorFactory = class Factory extends React.Component {
+  public render() {
+    return <div></div>;
+  }
+};
+
+jest.mock('../../../editor', () => ({ get EditorFactory() { return mockEditorFactory; }}));
+jest.mock('../../../../data/reducer/editor', () => ({}));
+jest.mock('../tabbedDocument', () => ({ get TabbedDocument() { return mockTabbedDocument; } }));
+
+describe('Documents', () => {
+  let mockStore;
+  let wrapper;
+
+  beforeEach(() => {
+    mockStore = createStore((_state, _action) => ({ editor: { editors: { primary: {} } } }));
+  });
+
+  it('should not render anything if there are no documentss', () => {
+    wrapper = mount(
+      <Provider store={ mockStore }>
+        <DocumentsContainer owningEditor={ 'primary' }/>
+      </Provider>
+    );
+    expect(wrapper.html()).toBe(null);
+  });
+
+  it('should render a tabbedDocument if there are documents', () => {
+    mockStore = createStore((_state, _action) => ({ editor: { editors: { primary: { tabOrder: ['doc1'] } } } }));
+    wrapper = mount(
+      <Provider store={ mockStore }>
+        <DocumentsContainer owningEditor={ 'primary' }/>
+      </Provider>
+    );
+    expect(wrapper.html()).not.toBe(null);
+  });
+});

packages/app/client/src/ui/shell/mdi/documents/documents.tsx

@@ -0,0 +1,61 @@
+//
+// Copyright (c) Microsoft. All rights reserved.
+// Licensed under the MIT license.
+//
+// Microsoft Bot Framework: http://botframework.com
+//
+// Bot Framework Emulator Github:
+// https://github.com/Microsoft/BotFramwork-Emulator
+//
+// Copyright (c) Microsoft Corporation
+// All rights reserved.
+//
+// MIT License:
+// Permission is hereby granted, free of charge, to any person obtaining
+// a copy of this software and associated documentation files (the
+// "Software"), to deal in the Software without restriction, including
+// without limitation the rights to use, copy, modify, merge, publish,
+// distribute, sublicense, and/or sell copies of the Software, and to
+// permit persons to whom the Software is furnished to do so, subject to
+// the following conditions:
+//
+// The above copyright notice and this permission notice shall be
+// included in all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED ""AS IS"", WITHOUT WARRANTY OF ANY KIND,
+// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+//
+
+import * as React from 'react';
+import { TabbedDocument } from '../tabbedDocument';
+import { EditorFactory } from '../../../editor';
+import { Document } from '../../../../data/reducer/editor';
+
+export interface DocumentsProps {
+  activeDocumentId?: string;
+  documents?: { [documentId: string]: Document };
+  owningEditor?: string;
+  tabOrder?: string[];
+}
+
+export class Documents extends React.Component<DocumentsProps> {
+  public render(): JSX.Element[] {
+    const { activeDocumentId = '', tabOrder = [], documents = {} } = this.props;
+
+    return tabOrder.map(documentId => {
+      const isActive = activeDocumentId === documentId;
+      const document = documents[documentId];
+
+      return (
+        <TabbedDocument key={ documentId } documentId={ documentId } hidden={ !isActive }>
+          <EditorFactory document={ document }/>
+        </TabbedDocument>
+      );
+    }); 
+  }
+}

packages/app/client/src/ui/shell/mdi/documents/documentsContainer.ts

@@ -0,0 +1,48 @@
+//
+// Copyright (c) Microsoft. All rights reserved.
+// Licensed under the MIT license.
+//
+// Microsoft Bot Framework: http://botframework.com
+//
+// Bot Framework Emulator Github:
+// https://github.com/Microsoft/BotFramwork-Emulator
+//
+// Copyright (c) Microsoft Corporation
+// All rights reserved.
+//
+// MIT License:
+// Permission is hereby granted, free of charge, to any person obtaining
+// a copy of this software and associated documentation files (the
+// "Software"), to deal in the Software without restriction, including
+// without limitation the rights to use, copy, modify, merge, publish,
+// distribute, sublicense, and/or sell copies of the Software, and to
+// permit persons to whom the Software is furnished to do so, subject to
+// the following conditions:
+//
+// The above copyright notice and this permission notice shall be
+// included in all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED ""AS IS"", WITHOUT WARRANTY OF ANY KIND,
+// EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+// LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+// OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+// WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+//
+
+import { connect } from 'react-redux';
+import { Documents, DocumentsProps } from './documents';
+import { RootState } from '../../../../data/store';
+
+function mapStateToProps(state: RootState, ownProps: DocumentsProps): DocumentsProps {
+  const { editors } = state.editor;
+  return {
+    ...ownProps,
+    activeDocumentId: editors[ownProps.owningEditor].activeDocumentId,
+    documents: editors[ownProps.owningEditor].documents,
+    tabOrder: editors[ownProps.owningEditor].tabOrder
+  };
+}
+
+export const DocumentsContainer = connect(mapStateToProps, null)(Documents);

packages/app/client/src/ui/shell/multiTabs/index.ts → packages/app/client/src/ui/shell/mdi/documents/index.ts

@@ -31,6 +31,4 @@
 // WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 //
 
-export * from './multiTabs';
-export * from './tabBar/tabBar';
-export * from './tabbedDocument';
+export * from './documentsContainer';

packages/app/client/src/ui/shell/mdi/index.ts

@@ -32,4 +32,7 @@
 //
 
 export { MDI } from './mdiContainer';
-export * from './tab/tab';
+export * from './documents';
+export * from './tab';
+export * from './tabBar';
+export * from './tabbedDocument';

packages/app/client/src/ui/shell/mdi/mdi.scss

@@ -0,0 +1,7 @@
+.mdi {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  height: 100%;
+  box-sizing: border-box;
+}

packages/app/client/src/ui/shell/multiTabs/multiTabs.scss.d.ts → packages/app/client/src/ui/shell/mdi/mdi.scss.d.ts

@@ -1,3 +1,2 @@
 // This is a generated file. Changes are likely to result in being overwritten
-export const multiTabs: string;
-export const tab: string;
+export const mdi: string;