fix: merge with main (#5048)

* try-catch around trigger grouping expressions (#5017)

Co-authored-by: Ben Yackley <[email protected]>

* chore: Updated installOneAuth script to target correct version. (#5020)

* Updated installOneAuth script to target correct version.

* Better refactor

* feat: adaptive expression functions menu (#5015)

* expressions menu

* Fixing aligment of menu

* PR comments

Co-authored-by: Soroush <[email protected]>

* fix: Correct handling of focus for Intellisense fields (#5039)

* fix

* Improved handling of focus when leveraging an Intellisense suggestion

* comments on wrong lines

* feat: azure publish with orchestrator (#5011)

* refactor the luis build in azure publish

* update the orchestrator path

* update the cleanup

* fix typo

* catch the build error

* remove qna endpoint

* remove console

* add qnaconfig

Co-authored-by: Geoff Cox (Microsoft) <[email protected]>
Co-authored-by: Ben Yackley <[email protected]>
Co-authored-by: Tony Anziano <[email protected]>
Co-authored-by: LouisEugeneMSFT <[email protected]>
Co-authored-by: Soroush <[email protected]>
Co-authored-by: leileizhang <[email protected]>

Author: 7 people

Composer/packages/adaptive-form/package.json

@@ -43,6 +43,7 @@
   "dependencies": {
     "@emotion/core": "^10.0.27",
     "lodash": "^4.17.19",
-    "react-error-boundary": "^1.2.5"
+    "react-error-boundary": "^1.2.5",
+    "@bfc/built-in-functions": "*"
   }
 }

Composer/packages/adaptive-form/src/components/SchemaField.tsx

@@ -51,7 +51,6 @@ export const SchemaField: React.FC<FieldProps> = (props) => {
       typeof uiOptions?.serializer?.set === 'function' ? uiOptions.serializer.set(newValue) : newValue;
 
     onChange(serializedValue);
-    setFieldFocused(true);
   };
 
   useEffect(() => {

…rc/components/ExpressionSwitchWindow.tsx …s/expressions/ExpressionSwitchWindow.tsxComposer/packages/adaptive-form/src/components/ExpressionSwitchWindow.tsx renamed to Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx Composer/packages/adaptive-form/src/components/ExpressionSwitchWindow.tsx renamed to Composer/packages/adaptive-form/src/components/expressions/ExpressionSwitchWindow.tsx

@@ -0,0 +1,62 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
+import React, { useCallback, useMemo } from 'react';
+import { builtInFunctionsGrouping, getBuiltInFunctionInsertText } from '@bfc/built-in-functions';
+
+import { expressionGroupingsToMenuItems } from './utils/expressionsListMenuUtils';
+
+const componentMaxHeight = 400;
+
+type ExpressionsListMenuProps = {
+  onExpressionSelected: (expression: string) => void;
+  onMenuMount: (menuContainerElms: HTMLDivElement[]) => void;
+};
+export const ExpressionsListMenu = (props: ExpressionsListMenuProps) => {
+  const { onExpressionSelected, onMenuMount } = props;
+
+  const containerRef = React.createRef<HTMLDivElement>();
+
+  const onExpressionKeySelected = useCallback(
+    (key) => {
+      const insertText = getBuiltInFunctionInsertText(key);
+      onExpressionSelected('= ' + insertText);
+    },
+    [onExpressionSelected]
+  );
+
+  const onLayerMounted = useCallback(() => {
+    const elms = document.querySelectorAll<HTMLDivElement>('.ms-ContextualMenu-Callout');
+    onMenuMount(Array.prototype.slice.call(elms));
+  }, [onMenuMount]);
+
+  const menuItems = useMemo(
+    () =>
+      expressionGroupingsToMenuItems(
+        builtInFunctionsGrouping,
+        onExpressionKeySelected,
+        onLayerMounted,
+        componentMaxHeight
+      ),
+    [onExpressionKeySelected, onLayerMounted]
+  );
+
+  return (
+    <div ref={containerRef}>
+      <ContextualMenu
+        calloutProps={{
+          onLayerMounted: onLayerMounted,
+        }}
+        directionalHint={DirectionalHint.bottomLeftEdge}
+        hidden={false}
+        items={menuItems}
+        shouldFocusOnMount={false}
+        styles={{
+          container: { maxHeight: componentMaxHeight },
+        }}
+        target={containerRef}
+      />
+    </div>
+  );
+};

Composer/packages/adaptive-form/src/components/expressions/ExpressionsListMenu.tsx

@@ -0,0 +1,48 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { ContextualMenuItemType, IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+
+type ExpressionGroupingType = {
+  key: string;
+  name: string;
+  children: string[];
+};
+
+export const expressionGroupingsToMenuItems = (
+  expressionGroupings: ExpressionGroupingType[],
+  menuItemSelectedHandler: (key: string) => void,
+  onLayerMounted: () => void,
+  maxHeight?: number
+): IContextualMenuItem[] => {
+  const menuItems: IContextualMenuItem[] =
+    expressionGroupings?.map((grouping: ExpressionGroupingType) => {
+      return {
+        key: grouping.key,
+        text: grouping.name,
+        target: '_blank',
+        subMenuProps: {
+          calloutProps: { onLayerMounted: onLayerMounted },
+          items: grouping.children.map((key: string) => {
+            return {
+              key: key,
+              text: key,
+              onClick: () => menuItemSelectedHandler(key),
+            };
+          }),
+          styles: { container: { maxHeight } },
+        },
+      };
+    }) || [];
+
+  const header = {
+    key: 'header',
+    itemType: ContextualMenuItemType.Header,
+    text: 'Pre-built functions',
+    itemProps: { lang: 'en-us' },
+  };
+
+  menuItems.unshift(header);
+
+  return menuItems;
+};

Composer/packages/adaptive-form/src/components/expressions/utils/expressionsListMenuUtils.ts

@@ -3,10 +3,11 @@
 
 import { FieldProps } from '@bfc/extension-client';
 import { Intellisense } from '@bfc/intellisense';
-import React, { useRef } from 'react';
+import React, { useRef, useState } from 'react';
 
 import { getIntellisenseUrl } from '../../utils/getIntellisenseUrl';
-import { ExpressionSwitchWindow } from '../ExpressionSwitchWindow';
+import { ExpressionSwitchWindow } from '../expressions/ExpressionSwitchWindow';
+import { ExpressionsListMenu } from '../expressions/ExpressionsListMenu';
 
 import { JsonField } from './JsonField';
 import { NumberField } from './NumberField';
@@ -35,9 +36,18 @@ export const IntellisenseTextField: React.FC<FieldProps<string>> = (props) => {
       onBlur={props.onBlur}
       onChange={onChange}
     >
-      {({ textFieldValue, focused, onValueChanged, onKeyDownTextField, onKeyUpTextField, onClickTextField }) => (
+      {({
+        textFieldValue,
+        focused,
+        cursorPosition,
+        onValueChanged,
+        onKeyDownTextField,
+        onKeyUpTextField,
+        onClickTextField,
+      }) => (
         <StringField
           {...props}
+          cursorPosition={cursorPosition}
           focused={focused}
           id={id}
           value={textFieldValue}
@@ -58,8 +68,23 @@ export const IntellisenseExpressionField: React.FC<FieldProps<string>> = (props)
   const scopes = ['expressions', 'user-variables'];
   const intellisenseServerUrlRef = useRef(getIntellisenseUrl());
 
+  const [expressionsListContainerElements, setExpressionsListContainerElements] = useState<HTMLDivElement[]>([]);
+
+  const completionListOverrideResolver = (value: string) => {
+    return value === '=' ? (
+      <ExpressionsListMenu
+        onExpressionSelected={(expression: string) => onChange(expression)}
+        onMenuMount={(refs) => {
+          setExpressionsListContainerElements(refs);
+        }}
+      />
+    ) : null;
+  };
+
   return (
     <Intellisense
+      completionListOverrideContainerElements={expressionsListContainerElements}
+      completionListOverrideResolver={completionListOverrideResolver}
       focused={defaultFocused}
       id={`intellisense-${id}`}
       scopes={scopes}
@@ -68,9 +93,18 @@ export const IntellisenseExpressionField: React.FC<FieldProps<string>> = (props)
       onBlur={props.onBlur}
       onChange={onChange}
     >
-      {({ textFieldValue, focused, onValueChanged, onKeyDownTextField, onKeyUpTextField, onClickTextField }) => (
+      {({
+        textFieldValue,
+        focused,
+        cursorPosition,
+        onValueChanged,
+        onKeyDownTextField,
+        onKeyUpTextField,
+        onClickTextField,
+      }) => (
         <StringField
           {...props}
+          cursorPosition={cursorPosition}
           focused={focused}
           id={id}
           value={textFieldValue}

Composer/packages/adaptive-form/src/components/fields/IntellisenseFields.tsx

@@ -41,6 +41,7 @@ export const StringField: React.FC<FieldProps<string>> = function StringField(pr
     uiOptions,
     required,
     focused,
+    cursorPosition,
   } = props;
 
   const textFieldRef = React.createRef<ITextField>();
@@ -49,7 +50,13 @@ export const StringField: React.FC<FieldProps<string>> = function StringField(pr
     if (focused && textFieldRef.current) {
       textFieldRef.current.focus();
     }
-  }, [focused, textFieldRef.current]);
+  }, [focused, textFieldRef.current, value]);
+
+  useEffect(() => {
+    if (cursorPosition !== undefined && cursorPosition > -1 && textFieldRef.current) {
+      textFieldRef.current.setSelectionRange(cursorPosition, cursorPosition);
+    }
+  }, [cursorPosition]);
 
   const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {
     if (typeof onFocus === 'function') {

Composer/packages/adaptive-form/src/components/fields/StringField.tsx

@@ -14,10 +14,13 @@ import {
   isEjectRuntimeExistState,
   filePersistenceState,
   settingsState,
+  luFilesState,
+  qnaFilesState,
 } from '../atoms/botState';
-import { botEndpointsState } from '../atoms';
 import { openInEmulator } from '../../utils/navigation';
-import { rootBotProjectIdSelector } from '../selectors';
+import { rootBotProjectIdSelector, dialogsSelectorFamily } from '../selectors';
+import { botEndpointsState } from '../atoms';
+import * as luUtil from '../../utils/luUtil';
 
 import { BotStatus, Text } from './../../constants';
 import httpClient from './../../utils/httpUtil';
@@ -139,10 +142,24 @@ export const publisherDispatcher = () => {
   });
 
   const publishToTarget = useRecoilCallback(
-    (callbackHelpers: CallbackInterface) => async (projectId: string, target: any, metadata, sensitiveSettings) => {
+    (callbackHelpers: CallbackInterface) => async (
+      projectId: string,
+      target: any,
+      metadata: any,
+      sensitiveSettings
+    ) => {
       try {
+        const { snapshot } = callbackHelpers;
+        const dialogs = await snapshot.getPromise(dialogsSelectorFamily(projectId));
+        const luFiles = await snapshot.getPromise(luFilesState(projectId));
+        const qnaFiles = await snapshot.getPromise(qnaFilesState(projectId));
+        const referredLuFiles = luUtil.checkLuisBuild(luFiles, dialogs);
         const response = await httpClient.post(`/publish/${projectId}/publish/${target.name}`, {
-          metadata,
+          metadata: {
+            ...metadata,
+            luResources: referredLuFiles.map((file) => file.id),
+            qnaResources: qnaFiles.map((file) => file.id),
+          },
           sensitiveSettings,
         });
         await publishSuccess(callbackHelpers, projectId, response.data, target);

Composer/packages/client/src/recoilModel/dispatchers/publisher.ts

@@ -21,6 +21,7 @@ const { log } = require('./common');
  */
 
 let packageName = null;
+const packageVersion = '1.14.0';
 
 switch (process.platform) {
   case 'darwin':
@@ -54,7 +55,7 @@ async function downloadPackage() {
   log.info('Starting download.');
   await ensureDir(outDir);
   try {
-    execSync(`cd ${outDir} && npm pack ${packageName}`, { encoding: 'utf-8' });
+    execSync(`cd ${outDir} && npm pack ${packageName}@${packageVersion}`, { encoding: 'utf-8' });
   } catch (err) {
     process.exit(1);
     return;

Composer/packages/electron-server/scripts/installOneAuth.js

@@ -36,6 +36,7 @@ export interface FieldProps<T = any> {
   value?: T;
   focused?: boolean;
   style?: React.CSSProperties;
+  cursorPosition?: number;
 
   onChange: ChangeHandler<T>;
   onFocus?: (id: string, value?: T) => void;