Merge branch 'master' into master

Composer/package.json

@@ -40,11 +40,7 @@
     "build:server": "yarn workspace @bfc/server build",
     "build:client": "yarn workspace @bfc/client build",
     "build:tools": "yarn workspace @bfc/tools build:all",
-    "build:plugins": "yarn build:plugins:localpublish && yarn build:plugins:samples && yarn build:plugins:azurePublish && yarn build:plugins:azureFunctionsPublish",
-    "build:plugins:localpublish": "cd plugins/localPublish && yarn install && yarn build",
-    "build:plugins:samples": "cd plugins/samples && yarn install && yarn build",
-    "build:plugins:azurePublish": "cd plugins/azurePublish && yarn install && yarn build",
-    "build:plugins:azureFunctionsPublish": "cd plugins/azureFunctionsPublish && yarn install && yarn build",
+    "build:plugins": "cd plugins && yarn install && yarn build:all",
     "start": "cross-env NODE_ENV=production PORT=3000 yarn start:server",
     "startall": "yarn start",
     "start:dev": "concurrently  \"npm:start:client\" \"npm:start:server:dev\"",

Composer/packages/client/__tests__/components/CreationFlow/CreateOptions/index.test.tsx

@@ -5,7 +5,7 @@ import * as React from 'react';
 import { fireEvent } from '@bfc/test-utils';
 
 import { renderWithStore } from '../../../testUtils';
-import { CreateOptions } from '../../../../src/components/CreationFlow/CreateOptions/CreateOptions';
+import { CreateOptions } from '../../../../src/components/CreationFlow/CreateOptions';
 
 describe('<CreateOptions/>', () => {
   const handleDismissMock = jest.fn();

Composer/packages/client/__tests__/components/CreationFlow/DefineConversation/index.test.tsx

@@ -6,7 +6,7 @@ import { fireEvent } from '@bfc/test-utils';
 
 import { renderWithStore } from '../../../testUtils';
 import { StorageFolder } from '../../../../src/store/types';
-import DefineConversation from '../../../../src/components/CreationFlow/DefineConversation/DefineConversation';
+import DefineConversation from '../../../../src/components/CreationFlow/DefineConversation';
 
 describe('<DefineConversation/>', () => {
   const onCurrentPathUpdateMock = jest.fn();
@@ -75,13 +75,24 @@ describe('<DefineConversation/>', () => {
     const component = renderComponent();
     const node = await component.findByText('OK');
     fireEvent.click(node);
-    expect(onSubmitMock).toHaveBeenCalledWith({
-      description: 'Test Echo',
-      name: 'EchoBot-11299',
-      location: '',
-      schemaUrl:
-        'https://raw.githubusercontent.com/microsoft/botframework-sdk/master/schemas/component/component.schema',
-    });
+    expect(
+      onSubmitMock.mock.calls[0][0] ===
+        {
+          description: 'Test Echo',
+          name: 'EchoBot-11299',
+          location: '\\test-folder\\Desktop',
+          schemaUrl:
+            'https://raw.githubusercontent.com/microsoft/botframework-sdk/master/schemas/component/component.schema',
+        } ||
+        onSubmitMock.mock.calls[0][0] ===
+          {
+            description: 'Test Echo',
+            name: 'EchoBot-11299',
+            location: '/test-folder/Desktop',
+            schemaUrl:
+              'https://raw.githubusercontent.com/microsoft/botframework-sdk/master/schemas/component/component.schema',
+          }
+    ).toBeTruthy;
   });
 
   it('does not allow submission when the name is invalid', async () => {

Composer/packages/client/__tests__/components/CreationFlow/LocationBrowser/FileSelector.test.tsx

@@ -5,7 +5,7 @@ import * as React from 'react';
 import { render, fireEvent } from '@bfc/test-utils';
 
 import { StorageFolder } from '../../../../src/store/types';
-import { FileSelector } from '../../../../src/components/CreationFlow/LocationBrowser/FileSelector';
+import { FileSelector } from '../../../../src/components/CreationFlow/FileSelector';
 
 describe('<FileSelector/>', () => {
   const onFileChosen = jest.fn();

Composer/packages/client/__tests__/components/CreationFlow/LocationBrowser/LocationSelectContent.test.tsx

@@ -5,7 +5,7 @@ import * as React from 'react';
 import { fireEvent } from '@bfc/test-utils';
 
 import { StorageFolder } from '../../../../src/store/types';
-import { LocationSelectContent } from '../../../../src/components/CreationFlow/LocationBrowser/LocationSelectContent';
+import { LocationSelectContent } from '../../../../src/components/CreationFlow/LocationSelectContent';
 import { renderWithStore } from '../../../testUtils';
 import { CreationFlowStatus } from '../../../../src/constants';
 

Composer/packages/client/__tests__/components/CreationFlow/index.test.tsx

@@ -7,15 +7,10 @@ import { createHistory, createMemorySource, LocationProvider } from '@reach/rout
 
 import { StoreContext } from '../../../src/store';
 import CreationFlow from '../../../src/components/CreationFlow/CreationFlow';
+import { DialogWrapper } from '../../../src/components/DialogWrapper';
 import { CreationFlowStatus } from '../../../src/constants';
 
-jest.mock('../../../src/components/DialogWrapper/DialogWrapper', () => {
-  return {
-    DialogWrapper: jest.fn((props) => {
-      return props.children;
-    }),
-  };
-});
+jest.mock('../../../src/components/DialogWrapper');
 
 describe('<CreationFlow/>', () => {
   let storeContext, saveTemplateMock, locationMock, createProjectMock;
@@ -36,6 +31,10 @@ describe('<CreationFlow/>', () => {
   }
 
   beforeEach(() => {
+    (DialogWrapper as jest.Mock).mockImplementation((props) => {
+      return props.children;
+    });
+
     saveTemplateMock = jest.fn();
     locationMock = {};
     storeContext = {
@@ -66,7 +65,7 @@ describe('<CreationFlow/>', () => {
     storeContext.state.templateId = 'EchoBot';
     storeContext.actions.createProject = async (templateId, name, description, location) => {
       expect(templateId).toBe(expectedTemplateId);
-      expect(location === '').toBeTruthy();
+      expect(location === '/test-folder/Desktop' || location === '\\test-folder\\Desktop').toBeTruthy();
     };
     storeContext.state.focusedStorageFolder = {
       name: 'Desktop',

Composer/packages/client/__tests__/components/DialogWrapper/index.test.tsx

@@ -4,8 +4,7 @@
 import React from 'react';
 import { render } from '@bfc/test-utils';
 
-import { DialogWrapper } from '../../../src/components/DialogWrapper/DialogWrapper';
-import { DialogTypes } from '../../../src/components/DialogWrapper/styles';
+import { DialogWrapper, DialogTypes } from '../../../src/components/DialogWrapper';
 
 describe('<DialogWrapper />', () => {
   const props = {

Composer/packages/client/__tests__/components/appSettings.test.tsx

@@ -3,7 +3,7 @@
 
 import React from 'react';
 
-import { AppSettings } from '../../src/pages/setting/app-settings/index';
+import { AppSettings } from '../../src/pages/setting/app-settings/AppSettings';
 import { ElectronSettings } from '../../src/pages/setting/app-settings/electronSettings';
 import { renderWithStore } from '../testUtils';
 

Composer/packages/client/__tests__/components/appUpdater.test.tsx

@@ -3,7 +3,7 @@
 
 import React from 'react';
 
-import { AppUpdater } from '../../src/components/AppUpdater/AppUpdater';
+import { AppUpdater } from '../../src/components/AppUpdater';
 import { AppUpdaterStatus } from '../../src/constants';
 import { renderWithStore } from '../testUtils';
 

Composer/packages/client/__tests__/components/conversation.test.jsx

@@ -4,7 +4,7 @@
 import * as React from 'react';
 import { render } from '@bfc/test-utils';
 
-import '../../src/components/Conversation/Conversation';
+import '../../src/components/Conversation';
 
 describe('<Conversation/>', () => {
   it('should render the conversation', async () => {

Composer/packages/client/__tests__/components/errorBoundary.test.jsx

@@ -4,7 +4,7 @@
 import * as React from 'react';
 import { render } from '@bfc/test-utils';
 
-import { ErrorBoundary } from '../../src/components/ErrorBoundary/ErrorBoundary';
+import { ErrorBoundary } from '../../src/components/ErrorBoundary';
 
 const Store = React.createContext({
   actions: {

Composer/packages/client/__tests__/components/header.test.jsx

@@ -4,7 +4,7 @@
 import * as React from 'react';
 import { render } from '@bfc/test-utils';
 
-import { Header } from '../../src/components/Header/Header';
+import { Header } from '../../src/components/Header';
 
 describe('<Header />', () => {
   it('should render the header', () => {

Composer/packages/client/__tests__/components/home.test.jsx

@@ -6,7 +6,7 @@ import { fireEvent, render } from '@bfc/test-utils';
 
 import { RecentBotList } from '../../src/pages/home/RecentBotList';
 import { ExampleList } from '../../src/pages/home/ExampleList';
-import { ToolBar } from '../../src/components/ToolBar/ToolBar';
+import { ToolBar } from '../../src/components/ToolBar';
 describe('<Home/>', () => {
   it('should dispatch onSelectionChanged event when clicked on a link on <RecentBotList>', () => {
     const recentProjects = [

Composer/packages/client/__tests__/components/skill.test.tsx

@@ -5,14 +5,13 @@ import * as React from 'react';
 import { render, fireEvent, getByLabelText, getByTestId } from '@bfc/test-utils';
 import { Skill } from '@bfc/shared';
 
+import httpClient from '../../src//utils/httpUtil';
 import Skills from '../../src/pages/skills';
 import SkillList from '../../src/pages/skills/skill-list';
-import CreateSkillModal from '../../src/components/SkillForm/CreateSkillModal/CreateSkillModal';
+import CreateSkillModal from '../../src/components/CreateSkillModal';
 import { renderWithStore } from '../testUtils';
 
-jest.mock('../../src/components/SkillForm/CreateSkillModal/validateManifestUrl', () => ({
-  validateManifestUrl: () => {},
-}));
+jest.mock('../../src//utils/httpUtil');
 
 const items: Skill[] = [
   {
@@ -81,6 +80,9 @@ describe('<SkillForm />', () => {
     const onSubmit = jest.fn((formData) => {
       expect(formData.manifestUrl).toBe('http://AwesomeSkill');
     });
+
+    (httpClient.post as jest.Mock).mockResolvedValue(undefined);
+
     const onDismiss = jest.fn(() => {});
     const { getByLabelText, getByText } = render(
       <CreateSkillModal

Composer/packages/client/__tests__/components/toolbar.test.jsx

@@ -4,7 +4,7 @@
 import * as React from 'react';
 import { fireEvent, render } from '@bfc/test-utils';
 
-import { ToolBar } from '../../src/components/ToolBar/ToolBar';
+import { ToolBar } from '../../src/components/ToolBar';
 
 const toolbarItems = (onClick) => [
   {

Composer/packages/client/__tests__/navItem.test.jsx

@@ -4,7 +4,7 @@
 import * as React from 'react';
 import { render } from '@bfc/test-utils';
 
-import { NavItem } from '../src/components/NavItem/NavItem';
+import { NavItem } from '../src/components/NavItem';
 import { StoreProvider } from '../src/store';
 
 describe('<Header />', () => {

Composer/packages/client/__tests__/notFound.test.jsx

@@ -5,7 +5,7 @@ import * as React from 'react';
 import { render } from '@bfc/test-utils';
 
 import { BASEPATH } from '../src/constants';
-import { NotFound } from '../src/components/NotFound/NotFound';
+import { NotFound } from '../src/components/NotFound';
 
 describe('<NotFound />', () => {
   it('should render a not found page', async () => {

Composer/packages/client/__tests__/utils/convertUtils/parsePathToFocused.test.ts

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License
 
-import { parsePathToFocused } from '../../../src/utils/convertUtils';
+import { parsePathToFocused } from '../../../src/utils/convertUtils/parsePathToFocused';
 
 describe('parsePathToFocused', () => {
   it('should return focusedPath', () => {

Composer/packages/client/__tests__/utils/convertUtils/parsePathToSelected.test.ts

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License
 
-import { parsePathToSelected } from '../../../src/utils/convertUtils';
+import { parsePathToSelected } from '../../../src/utils/convertUtils/parsePathToSelected';
 
 describe('parsePathToSelected', () => {
   it('should return selected path', () => {

Composer/packages/client/__tests__/utils/convertUtils/parseTypeToFragment.test.ts

@@ -2,7 +2,7 @@
 // Licensed under the MIT License
 import { PromptTab } from '@bfc/shared';
 
-import { parseTypeToFragment } from '../../../src/utils/convertUtils';
+import { parseTypeToFragment } from '../../../src/utils/convertUtils/parseTypeToFragment';
 
 describe('parseTypeToFragment', () => {
   it('should return corrent tab name', () => {

Composer/packages/client/__tests__/utils/fileUtil.test.js

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import { getExtension, getBaseName, upperCaseName } from '../../src/utils';
+import { getExtension, getBaseName, upperCaseName } from '../../src/utils/fileUtil';
 
 const files = ['a.text', 'a.b.text', 1];
 

Composer/packages/client/config/env.js

@@ -88,7 +88,7 @@ function getClientEnvironment(publicUrl) {
         PUBLIC_URL: publicUrl,
         GIT_SHA: getGitSha().toString().replace('\n', ''),
         SDK_PACKAGE_VERSION: '4.9.3', // TODO: change this when Composer supports custom schema/custom runtime
-        COMPOSER_VERSION: '1.0.1',
+        COMPOSER_VERSION: '1.0.2',
         LOCAL_PUBLISH_PATH:
           process.env.LOCAL_PUBLISH_PATH || path.resolve(process.cwd(), '../../plugins/localPublish/hostedBots'),
       }

Composer/packages/client/src/App.tsx

@@ -10,15 +10,15 @@ import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import { TooltipHost, DirectionalHint } from 'office-ui-fabric-react/lib/Tooltip';
 import formatMessage from 'format-message';
 
-import { Header } from './components/Header/Header';
-import { NavItem } from './components/NavItem/NavItem';
+import { Header } from './components/Header';
+import { NavItem } from './components/NavItem';
 import { BASEPATH } from './constants';
 import Routes from './router';
 import { StoreContext } from './store';
 import { main, sideBar, content, divider, globalNav, leftNavBottom, rightPanel, dividerTop } from './styles';
 import { resolveToBasePath } from './utils/fileUtil';
-import { ErrorBoundary } from './components/ErrorBoundary/ErrorBoundary';
-import { RequireAuth } from './components/RequireAuth/RequireAuth';
+import { ErrorBoundary } from './components/ErrorBoundary';
+import { RequireAuth } from './components/RequireAuth';
 import onboardingState from './utils/onboardingStorage';
 import { isElectron } from './utils/electronUtil';
 import { useLinks } from './utils/hooks';
@@ -27,7 +27,7 @@ initializeIcons(undefined, { disableWarnings: true });
 
 const Onboarding = React.lazy(() => import('./Onboarding/Onboarding'));
 const AppUpdater = React.lazy(() =>
-  import('./components/AppUpdater/AppUpdater').then((module) => ({ default: module.AppUpdater }))
+  import('./components/AppUpdater').then((module) => ({ default: module.AppUpdater }))
 );
 
 // eslint-disable-next-line react/display-name

Composer/packages/client/src/components/AppUpdater/AppUpdater.tsx → Composer/packages/client/src/components/AppUpdater.tsx

@@ -2,19 +2,57 @@
 // Licensed under the MIT License.
 
 /** @jsx jsx */
-import { jsx } from '@emotion/core';
+import { jsx, css } from '@emotion/core';
 import React, { useContext, useEffect, useMemo, useState, useCallback } from 'react';
 import { Dialog, DialogFooter, DialogType } from 'office-ui-fabric-react/lib/Dialog';
-import { DefaultButton, PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, PrimaryButton, IButtonStyles } from 'office-ui-fabric-react/lib/Button';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { ProgressIndicator } from 'office-ui-fabric-react/lib/ProgressIndicator';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import formatMessage from 'format-message';
+import { IDialogContentStyles, IDialogFooterStyles } from 'office-ui-fabric-react/lib/Dialog';
+import { NeutralColors, SharedColors } from '@uifabric/fluent-theme';
+
+import { AppUpdaterStatus } from '../constants';
+import { StoreContext } from '../store';
+
+// -------------------- Styles -------------------- //
+
+const optionIcon = (checked) => css`
+  vertical-align: text-bottom;
+  font-size: 18px;
+  margin-right: 10px;
+  color: ${checked ? SharedColors.cyanBlue10 : NeutralColors.black};
+`;
+
+const optionRoot = css`
+  width: 100%;
+  height: 100%;
+`;
+
+const dialogCopy = css`
+  margin: 0px;
+  color: #000;
+`;
+
+const dialogContent: Partial<IDialogContentStyles> = {
+  subText: { color: NeutralColors.black },
+  header: { paddingBottom: '6px' },
+};
 
-import { StoreContext } from '../../store';
-import { AppUpdaterStatus } from '../../constants';
+const dialogFooter: Partial<IDialogFooterStyles> = {
+  actions: {
+    marginTop: '46px',
+  },
+};
 
-import { dialogContent, dialogCopy, dialogFooter, optionRoot, optionIcon, updateAvailableDismissBtn } from './styles';
+const updateAvailableDismissBtn: Partial<IButtonStyles> = {
+  root: {
+    marginRight: '6px;',
+  },
+};
+
+// -------------------- Helpers -------------------- //
 
 const { ipcRenderer } = window;
 
@@ -33,6 +71,8 @@ const downloadOptions = {
   installAndUpdate: 'installAndUpdate',
 };
 
+// -------------------- AppUpdater -------------------- //
+
 export const AppUpdater: React.FC<{}> = () => {
   const {
     actions: { setAppUpdateError, setAppUpdateProgress, setAppUpdateShowing, setAppUpdateStatus },