diff --git a/Composer/packages/client/src/components/ProjectTree/TriggerCreationModal.tsx b/Composer/packages/client/src/components/ProjectTree/TriggerCreationModal.tsx index 9ed6a81a59..36d1aa7a8d 100644 --- a/Composer/packages/client/src/components/ProjectTree/TriggerCreationModal.tsx +++ b/Composer/packages/client/src/components/ProjectTree/TriggerCreationModal.tsx @@ -1,10 +1,9 @@ import React, { useState, useContext } from 'react'; import { Dialog, DialogType } from 'office-ui-fabric-react'; import formatMessage from 'format-message'; -import { DialogFooter, PrimaryButton, DefaultButton, Stack, TextField, IDropdownOption } from 'office-ui-fabric-react'; +import { DialogFooter, PrimaryButton, DefaultButton, Stack, IDropdownOption } from 'office-ui-fabric-react'; import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown'; import { get } from 'lodash'; -import { appschema } from 'shared'; import { addNewTrigger, @@ -13,11 +12,14 @@ import { TriggerFormDataErrors, eventTypeKey, intentTypeKey, + activityTypeKey, + getEventTypes, + getActivityTypes, } from '../../utils/dialogUtil'; import { StoreContext } from '../../store'; import { DialogInfo } from '../../store/types'; -import { styles, dropdownStyles, intent, dialogWindow } from './styles'; +import { styles, dropdownStyles, dialogWindow } from './styles'; const isValidName = name => { const nameRegex = /^[a-zA-Z0-9-_.]+$/; @@ -25,10 +27,14 @@ const isValidName = name => { }; const validateForm = (data: TriggerFormData): TriggerFormDataErrors => { const errors: TriggerFormDataErrors = {}; - const { $type, eventType } = data; + const { $type, specifiedType } = data; - if ($type === eventTypeKey && !eventType) { - errors.eventType = formatMessage('please select a event type'); + if ($type === eventTypeKey && !specifiedType) { + errors.specifiedType = formatMessage('please select a event type'); + } + + if ($type === activityTypeKey && !specifiedType) { + errors.specifiedType = formatMessage('please select an activity type'); } if (!$type) { @@ -48,7 +54,7 @@ const initialFormData: TriggerFormData = { errors: {}, $type: intentTypeKey, intent: '', - eventType: '', + specifiedType: '', }; const triggerTypeOptions: IDropdownOption[] = getTriggerTypes(); @@ -60,7 +66,6 @@ export const TriggerCreationModal: React.FC = props = const { dialogs, luFiles } = state; const luFile = luFiles.find(lu => lu.id === dialogId); const dialogFile = dialogs.find(dialog => dialog.id === dialogId); - const onClickSubmitButton = e => { e.preventDefault(); const errors = validateForm(formData); @@ -78,28 +83,19 @@ export const TriggerCreationModal: React.FC = props = }; const onSelectTriggerType = (e, option) => { - delete formData.eventType; - setFormData({ ...formData, $type: option.key }); - }; - - const onSelectEventType = (e, option) => { - setFormData({ ...formData, eventType: option.key }); + setFormData({ ...initialFormData, $type: option.key }); }; const onSelectIntent = (e, option) => { setFormData({ ...formData, intent: option.key }); }; - const updateForm = field => (e, newValue) => { - setFormData({ - ...formData, - [field]: newValue, - }); + const onSelectSpecifiedTypeType = (e, option) => { + setFormData({ ...formData, specifiedType: option.key }); }; - const eventTypes = get(appschema, `definitions.['${eventTypeKey}'].properties.event.enum`, []).map(t => { - return { key: t, text: t }; - }); + const eventTypes: IDropdownOption[] = getEventTypes(); + const activityTypes: IDropdownOption[] = getActivityTypes(); const regexIntents = get(dialogFile, 'content.recognizer.intents', []); const luisIntents = get(luFile, 'parsedContent.LUISJsonStructure.intents', []); @@ -109,8 +105,10 @@ export const TriggerCreationModal: React.FC = props = return { key: t.name || t.intent, text: t.name || t.intent }; }); - const showEventDropDown = formData.$type === eventTypeKey; const showIntentDropDown = formData.$type === intentTypeKey; + const showEventDropDown = formData.$type === eventTypeKey; + const showActivityDropDown = formData.$type === activityTypeKey; + return (