fix: share 'LuIntentEditor' widget across recognizers

Composer/packages/adaptive-flow/src/adaptive-flow-editor/hooks/useFlowUIOptions.ts

@@ -7,5 +7,5 @@ export function useFlowUIOptions() {
   const { plugins } = useShellApi();
   const schema = useFlowConfig();
 
-  return { widgets: plugins.flowWidgets ?? {}, schema };
+  return { widgets: plugins?.widgets?.flow ?? {}, schema };
 }

Composer/packages/client/__tests__/plugins.test.ts

@@ -45,7 +45,7 @@ describe('mergePluginConfigs', () => {
           },
         },
       },
-      flowWidgets: {},
+      widgets: {},
     });
   });
 

Composer/packages/client/src/plugins.ts

@@ -29,7 +29,7 @@ const mergeArrays: MergeWithCustomizer = (objValue, srcValue, key) => {
 
 const defaultPlugin: Required<PluginConfig> = {
   uiSchema: {},
-  flowWidgets: {},
+  widgets: {},
 };
 
 export function mergePluginConfigs(...plugins: PluginConfig[]): Required<PluginConfig> {

Composer/packages/extension-client/src/hooks/useRecognizerConfig.ts

@@ -10,13 +10,11 @@ import { RecognizerOptions, RecognizerSchema } from '../types';
 
 export const FallbackRecognizerKey = 'fallback';
 
-// TODO: (ze) remove this logic after the ui widget PR. [issue #4167]
-const reuseLuisIntentEditor = (recognizers: RecognizerSchema[]) => {
-  const crosstrainRecognizer = recognizers.find((x) => x.id === SDKKinds.CrossTrainedRecognizerSet);
-  const luisRecognizer = recognizers.find((x) => x.id === SDKKinds.LuisRecognizer);
-  if (crosstrainRecognizer && luisRecognizer) {
-    crosstrainRecognizer.intentEditor = luisRecognizer.intentEditor;
+const resolveRecognizerWidget = (widgetValue: any, recognizerWidgets: { [name: string]: any }) => {
+  if (typeof widgetValue === 'string' && recognizerWidgets[widgetValue]) {
+    return recognizerWidgets[widgetValue];
   }
+  return widgetValue;
 };
 
 const getDefaultRecognizer = (recognizers: RecognizerSchema[]) => {
@@ -60,16 +58,18 @@ export function useRecognizerConfig(): RecognizerSchemaConfig {
   const recognizers: RecognizerSchema[] = useMemo(() => {
     if (!plugins.uiSchema) return [];
 
+    const recognizerWidgets = plugins.widgets?.recognizer ?? {};
     const schemas = Object.entries(plugins.uiSchema)
       .filter(([_, uiOptions]) => uiOptions && uiOptions.recognizer)
       .map(([$kind, uiOptions]) => {
         const recognizerOptions = uiOptions?.recognizer as RecognizerOptions;
+        const intentEditor = resolveRecognizerWidget(recognizerOptions.intentEditor, recognizerWidgets);
         return {
           id: $kind,
           ...recognizerOptions,
+          intentEditor,
         } as RecognizerSchema;
       });
-    reuseLuisIntentEditor(schemas);
     return schemas;
   }, [plugins.uiSchema]);
 

Composer/packages/extension-client/src/types/extension.ts

@@ -7,10 +7,14 @@ import { UIOptions } from './formSchema';
 import { FlowEditorWidgetMap, FlowWidget } from './flowSchema';
 import { MenuOptions } from './menuSchema';
 import { RecognizerOptions } from './recognizerSchema';
+import { FieldWidget } from './form';
 
 export interface PluginConfig {
   uiSchema?: UISchema;
-  flowWidgets?: FlowEditorWidgetMap;
+  widgets?: {
+    flow?: FlowEditorWidgetMap;
+    recognizer?: { [name: string]: FieldWidget };
+  };
 }
 
 export type UISchema = {

Composer/packages/extension-client/src/types/formSchema.ts

@@ -75,7 +75,7 @@ export type RecognizerSchema = {
   /** Display name used in the UI. Recommended to use function over static string to enable multi-locale feature. */
   displayName: UIOptionValue<string>;
   /** An inline editor to edit an intent. If none provided, users will not be able to edit. */
-  intentEditor?: FieldWidget;
+  intentEditor?: FieldWidget | string;
   /** A function invoked with the form data to determine if this is the currently selected recognizer */
   isSelected?: (data: any) => boolean;
   /** Invoked when constructing a new recognizer instance.

Composer/packages/extension-client/src/utils/mergePluginConfigs.ts

@@ -22,7 +22,7 @@ const mergeArrays: MergeWithCustomizer = (objValue, srcValue, key) => {
 
 const defaultPlugin: Required<PluginConfig> = {
   uiSchema: {},
-  flowWidgets: {},
+  widgets: {},
 };
 
 export function mergePluginConfigs(...plugins: PluginConfig[]): Required<PluginConfig> {

Composer/packages/ui-plugins/cross-trained/src/index.ts

@@ -13,6 +13,7 @@ const config: PluginConfig = {
         isSelected: (data) => {
           return typeof data === 'string' && data.endsWith('.lu.qna');
         },
+        intentEditor: 'LuIntentEditor',
         seedNewRecognizer: (shellData) => {
           const { qnaFiles, luFiles, currentDialog, locale } = shellData;
           const qnaFile = qnaFiles.find((f) => f.id === `${currentDialog.id}.${locale}`);

Composer/packages/ui-plugins/lg/src/index.ts

@@ -62,8 +62,10 @@ const config: PluginConfig = {
       },
     },
   },
-  flowWidgets: {
-    LgWidget,
+  widgets: {
+    flow: {
+      LgWidget,
+    },
   },
 };
 

Composer/packages/ui-plugins/luis/src/index.ts

@@ -5,15 +5,20 @@ import { PluginConfig } from '@bfc/extension-client';
 import { SDKKinds } from '@bfc/shared';
 import formatMessage from 'format-message';
 
-import { LuisIntentEditor } from './LuisIntentEditor';
+import { LuisIntentEditor as LuIntentEditor } from './LuisIntentEditor';
 
 const config: PluginConfig = {
+  widgets: {
+    recognizer: {
+      LuIntentEditor,
+    },
+  },
   uiSchema: {
     [SDKKinds.LuisRecognizer]: {
       recognizer: {
         disabled: true,
         displayName: () => formatMessage('LUIS'),
-        intentEditor: LuisIntentEditor,
+        intentEditor: 'LuIntentEditor',
         isSelected: (data) => {
           return typeof data === 'string' && data.endsWith('.lu');
         },