From ff762b94c919c91908640af316d04c6fe0e284a5 Mon Sep 17 00:00:00 2001 From: Long Alan Date: Fri, 2 Apr 2021 16:15:32 +0800 Subject: [PATCH 1/4] ux fix --- .../components/CreationFlow/CreateOptions.tsx | 25 +++++++++++++++++- .../CreationFlow/v2/CreateOptions.tsx | 26 ++++++++++++++++++- Composer/packages/client/src/constants.ts | 2 +- 3 files changed, 50 insertions(+), 3 deletions(-) diff --git a/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx b/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx index d90b5533bc..87481140d6 100644 --- a/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx +++ b/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx @@ -9,6 +9,8 @@ import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button' import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup'; import { DialogFooter } from 'office-ui-fabric-react/lib/Dialog'; import { BotTemplate } from '@bfc/shared'; +import { FontWeights } from 'office-ui-fabric-react/lib/Styling'; +import { FontSizes } from '@uifabric/fluent-theme'; import { DialogWrapper, DialogTypes } from '@bfc/ui-shared'; import { RouteComponentProps, navigate } from '@reach/router'; import { useRecoilValue } from 'recoil'; @@ -85,12 +87,33 @@ export function CreateOptions(props: CreateOptionsProps) { } }; + const customerStyle = { + dialog: { + title: { + fontWeight: FontWeights.bold, + fontSize: FontSizes.size20, + paddingTop: '14px', + paddingBottom: '11px', + }, + subText: { + fontSize: FontSizes.size14, + }, + }, + modal: { + main: { + // maxWidth: '416px !important', + maxWidth: '80% !important', + width: '480px !important', + }, + }, + }; return ( diff --git a/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx b/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx index 72b8c99f2e..9f439d91ea 100644 --- a/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx +++ b/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx @@ -8,6 +8,8 @@ import formatMessage from 'format-message'; import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button'; import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup'; import { DialogFooter } from 'office-ui-fabric-react/lib/Dialog'; +import { FontWeights } from 'office-ui-fabric-react/lib/Styling'; +import { FontSizes } from '@uifabric/fluent-theme'; import { BotTemplate } from '@bfc/shared'; import { DialogWrapper, DialogTypes } from '@bfc/ui-shared'; import { navigate, RouteComponentProps } from '@reach/router'; @@ -61,6 +63,27 @@ export function CreateOptionsV2(props: CreateOptionsProps) { }, [props.location?.search]); const dialogWrapperProps = DialogCreationCopy.CREATE_OPTIONS; + const customerStyle = { + dialog: { + title: { + fontWeight: FontWeights.bold, + fontSize: FontSizes.size20, + paddingTop: '14px', + paddingBottom: '11px', + }, + subText: { + fontSize: FontSizes.size14, + }, + }, + modal: { + main: { + // maxWidth: '416px !important', + maxWidth: '80% !important', + width: '480px !important', + }, + }, + }; + const options: IChoiceGroupOption[] = [ { key: 'Create', text: formatMessage('Create a new bot') }, { key: 'Connect', text: formatMessage('Connect to an existing bot') }, @@ -83,7 +106,8 @@ export function CreateOptionsV2(props: CreateOptionsProps) { diff --git a/Composer/packages/client/src/constants.ts b/Composer/packages/client/src/constants.ts index 8ad0611317..05022a787f 100644 --- a/Composer/packages/client/src/constants.ts +++ b/Composer/packages/client/src/constants.ts @@ -227,7 +227,7 @@ export const DialogCreationCopy = { get SELECT_LOCATION() { return { title: formatMessage('Select a Bot'), - subText: formatMessage('Which bot do you want to open?'), + subText: formatMessage('Specify an existing bot to connect to your Azure Bot resource.'), }; }, get SELECT_DESTINATION() { From 33cf2af9d355f1c4335edaa9d0950412fac87a0a Mon Sep 17 00:00:00 2001 From: Long Alan Date: Sun, 4 Apr 2021 12:54:25 +0800 Subject: [PATCH 2/4] delete comment --- .../client/src/components/CreationFlow/CreateOptions.tsx | 3 +-- .../client/src/components/CreationFlow/v2/CreateOptions.tsx | 3 +-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx b/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx index 87481140d6..04d5baed2a 100644 --- a/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx +++ b/Composer/packages/client/src/components/CreationFlow/CreateOptions.tsx @@ -101,7 +101,6 @@ export function CreateOptions(props: CreateOptionsProps) { }, modal: { main: { - // maxWidth: '416px !important', maxWidth: '80% !important', width: '480px !important', }, @@ -112,8 +111,8 @@ export function CreateOptions(props: CreateOptionsProps) { diff --git a/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx b/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx index 9f439d91ea..8689cc2590 100644 --- a/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx +++ b/Composer/packages/client/src/components/CreationFlow/v2/CreateOptions.tsx @@ -77,7 +77,6 @@ export function CreateOptionsV2(props: CreateOptionsProps) { }, modal: { main: { - // maxWidth: '416px !important', maxWidth: '80% !important', width: '480px !important', }, @@ -106,8 +105,8 @@ export function CreateOptionsV2(props: CreateOptionsProps) { From b747ac91f569c1954c1e98e77d161b56a23f2424 Mon Sep 17 00:00:00 2001 From: Long Jun Date: Tue, 6 Apr 2021 15:01:01 +0800 Subject: [PATCH 3/4] abs use new description --- .../client/src/components/CreationFlow/OpenProject.tsx | 9 +++------ Composer/packages/client/src/constants.ts | 6 ++++++ 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx b/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx index 4e7bcf4e80..9909b7913a 100644 --- a/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx +++ b/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx @@ -35,6 +35,8 @@ interface OpenProjectProps extends RouteComponentProps<{}> { export const OpenProject: React.FC = (props) => { const { onOpen, onDismiss, onCurrentPathUpdate, focusedStorageFolder, location } = props; + const titleInfo = + location && location.search ? DialogCreationCopy.SELECT_LOCATION_ABS : DialogCreationCopy.SELECT_LOCATION; const handleOpen = async (path: string, storage: string) => { const dataToOpen: OpenProjectFormData = { path, storage }; dataToOpen.path = path; @@ -51,12 +53,7 @@ export const OpenProject: React.FC = (props) => { }; return ( - +
Date: Tue, 6 Apr 2021 15:07:29 +0800 Subject: [PATCH 4/4] abs --- .../client/src/components/CreationFlow/OpenProject.tsx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx b/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx index 9909b7913a..fc2da2f084 100644 --- a/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx +++ b/Composer/packages/client/src/components/CreationFlow/OpenProject.tsx @@ -35,8 +35,14 @@ interface OpenProjectProps extends RouteComponentProps<{}> { export const OpenProject: React.FC = (props) => { const { onOpen, onDismiss, onCurrentPathUpdate, focusedStorageFolder, location } = props; - const titleInfo = - location && location.search ? DialogCreationCopy.SELECT_LOCATION_ABS : DialogCreationCopy.SELECT_LOCATION; + let titleInfo = DialogCreationCopy.SELECT_LOCATION; + if (location?.search) { + const decoded = decodeURIComponent(location.search); + const { source } = querystring.parse(decoded); + if (source === 'abs') { + titleInfo = DialogCreationCopy.SELECT_LOCATION_ABS; + } + } const handleOpen = async (path: string, storage: string) => { const dataToOpen: OpenProjectFormData = { path, storage }; dataToOpen.path = path;