feat: Unify CRUD in dialog diff

Composer/package.json

@@ -22,7 +22,14 @@
     "packages/tools",
     "packages/tools/language-servers",
     "packages/tools/language-servers/*",
-    "packages/ui-plugins/*"
+    "packages/ui-plugins/example",
+    "packages/ui-plugins/expressions",
+    "packages/ui-plugins/json",
+    "packages/ui-plugins/select-dialog",
+    "packages/ui-plugins/select-skill-dialog",
+    "packages/ui-plugins/virtual-lg",
+    "packages/ui-plugins/virtual-luis",
+    "packages/ui-plugins/virtual-prompts"
   ],
   "scripts": {
     "build": "node scripts/begin.js && yarn build:prod && yarn build:plugins",

Composer/packages/client/__tests__/store/reducer/reducer.test.js

@@ -84,7 +84,7 @@ describe('test all reducer handlers', () => {
         luFiles: [],
         schemas: { sdk: { content: {} } },
       },
-      { type: ActionTypes.CREATE_DIALOG, payload: { id: '3', content: '' } }
+      { type: ActionTypes.CREATE_DIALOG, payload: { id: '3', content: {} } }
     );
     expect(result.dialogs.length).toBe(3);
     expect(result.dialogs[2].id).toBe('3');
@@ -94,10 +94,16 @@ describe('test all reducer handlers', () => {
 
   it('update dialog file', () => {
     const result = reducer(
-      { dialogs: [{ id: '1', content: 'old' }, { id: '2' }], schemas: { sdk: { content: {} } } },
-      { type: ActionTypes.UPDATE_DIALOG, payload: { id: '1', content: 'new' } }
+      {
+        dialogs: [{ id: '1', content: { value: 'old' } }, { id: '2' }],
+        locale: 'en-us',
+        lgFiles: [],
+        luFiles: [],
+        schemas: { sdk: { content: {} } },
+      },
+      { type: ActionTypes.UPDATE_DIALOG, payload: { id: '1', content: { value: 'new' } } }
     );
     expect(result.dialogs.length).toBe(2);
-    expect(result.dialogs[0].content).toBe('new');
+    expect(result.dialogs[0].content).toEqual({ value: 'new' });
   });
 });

Composer/packages/client/package.json

@@ -24,11 +24,11 @@
     "@bfc/indexers": "*",
     "@bfc/shared": "*",
     "@bfc/ui-plugin-expressions": "*",
-    "@bfc/ui-plugin-lg": "*",
-    "@bfc/ui-plugin-luis": "*",
-    "@bfc/ui-plugin-prompts": "*",
     "@bfc/ui-plugin-select-dialog": "*",
     "@bfc/ui-plugin-select-skill-dialog": "*",
+    "@bfc/ui-plugin-virtual-prompts": "*",
+    "@bfc/ui-plugin-virtual-lg": "*",
+    "@bfc/ui-plugin-virtual-luis": "*",
     "@bfc/visual-designer": "*",
     "@emotion/core": "^10.0.7",
     "@microsoft/bf-lu": "4.9.0",

Composer/packages/client/src/constants/index.ts

@@ -46,6 +46,7 @@ export enum ActionTypes {
   CREATE_DIALOG_CANCEL = 'CREATE_DIALOG_CANCEL',
   CREATE_DIALOG = 'CREATE_DIALOG',
   UPDATE_DIALOG = 'UPDATE_DIALOG',
+  UPDATE_VIRTUAL_DIALOG = 'UPDATE_VIRTUAL_DIALOG',
   REMOVE_DIALOG = 'REMOVE_DIALOG',
   UPDATE_LG = 'UPDATE_LG',
   CREATE_LG = 'CREATE_LG',

Composer/packages/client/src/pages/design/index.tsx

@@ -12,7 +12,6 @@ import { PromptTab } from '@bfc/shared';
 import { DialogFactory, SDKKinds, DialogInfo } from '@bfc/shared';
 import { ActionButton } from 'office-ui-fabric-react/lib/Button';
 import { JsonEditor } from '@bfc/code-editor';
-import { useTriggerApi } from '@bfc/extension';
 
 import { LoadingSpinner } from '../../components/LoadingSpinner';
 import { TestController } from '../../components/TestController';
@@ -28,7 +27,7 @@ import { ToolBar } from '../../components/ToolBar/index';
 import { clearBreadcrumb } from '../../utils/navigation';
 import undoHistory from '../../store/middlewares/undo/history';
 import { navigateTo } from '../../utils';
-import { useShell } from '../../shell';
+import { useVirtualDialog } from '../../shell/useVirtualDialog';
 
 import { VisualEditorAPI } from './FrameAPI';
 import {
@@ -113,8 +112,6 @@ const DesignPage: React.FC<RouteComponentProps<{ dialogId: string; projectId: st
   const [dialogJsonVisible, setDialogJsonVisibility] = useState(false);
   const [currentDialog, setCurrentDialog] = useState<DialogInfo>(dialogs[0]);
   const [exportSkillModalVisible, setExportSkillModalVisible] = useState(false);
-  const shell = useShell('ProjectTree');
-  const triggerApi = useTriggerApi(shell.api);
 
   useEffect(() => {
     const currentDialog = dialogs.find(({ id }) => id === dialogId);
@@ -129,6 +126,9 @@ const DesignPage: React.FC<RouteComponentProps<{ dialogId: string; projectId: st
     }
   }, [dialogId, dialogs, location]);
 
+  const virtualDialogs = useVirtualDialog();
+  const currentVirtualDialog = virtualDialogs.find(({ id }) => id === currentDialog.id) || currentDialog;
+
   useEffect(() => {
     const index = currentDialog.triggers.findIndex(({ type }) => type === SDKKinds.OnBeginDialog);
     if (index >= 0 && !designPageLocation.selected) {
@@ -373,7 +373,7 @@ const DesignPage: React.FC<RouteComponentProps<{ dialogId: string; projectId: st
   }
 
   async function handleDeleteTrigger(id, index) {
-    const content = deleteTrigger(dialogs, id, index, trigger => triggerApi.deleteTrigger(id, trigger));
+    const content = deleteTrigger(dialogs, id, index);
 
     if (content) {
       await updateDialog({ id, projectId, content });
@@ -431,9 +431,16 @@ const DesignPage: React.FC<RouteComponentProps<{ dialogId: string; projectId: st
                     key={'dialogjson'}
                     id={'dialogjson'}
                     onChange={data => {
-                      actions.updateDialog({ id: currentDialog.id, projectId, content: data });
+                      // actions.updateDialog({ id: currentDialog.id, projectId, content: data });
+                      actions.updateVirtualDialog({
+                        id: currentVirtualDialog.id,
+                        projectId,
+                        content: data,
+                        prevContent: currentVirtualDialog.content,
+                      });
                     }}
-                    value={currentDialog.content || undefined}
+                    value={currentVirtualDialog.content || undefined}
+                    // value={currentDialog.content || undefined}
                     schema={schemas.sdk.content}
                   />
                 ) : (

Composer/packages/client/src/pages/language-generation/code-editor.tsx

@@ -56,7 +56,8 @@ const CodeEditor: React.FC<CodeEditorProps> = props => {
     setContent(value);
   }, [file, templateId, projectId]);
 
-  const currentDiagnostics = inlineMode && template ? filterTemplateDiagnostics(diagnostics, template) : diagnostics;
+  const currentDiagnostics =
+    inlineMode && file && template ? filterTemplateDiagnostics(file, template.name) : diagnostics;
 
   const editorDidMount: EditorDidMount = (_getValue, lgEditor) => {
     setLgEditor(lgEditor);

Composer/packages/client/src/pages/language-understanding/code-editor.tsx

@@ -7,7 +7,7 @@ import { LuEditor, EditorDidMount } from '@bfc/code-editor';
 import get from 'lodash/get';
 import debounce from 'lodash/debounce';
 import isEmpty from 'lodash/isEmpty';
-import { filterTemplateDiagnostics } from '@bfc/indexers';
+import { filterSectionDiagnostics } from '@bfc/indexers';
 import { RouteComponentProps } from '@reach/router';
 import querystring from 'query-string';
 import { CodeEditorSettings } from '@bfc/shared';
@@ -51,7 +51,7 @@ const CodeEditor: React.FC<CodeEditorProps> = props => {
     setContent(value);
   }, [file, sectionId, projectId]);
 
-  const currentDiagnostics = inlineMode && intent ? filterTemplateDiagnostics(diagnostics, intent) : diagnostics;
+  const currentDiagnostics = inlineMode && file && sectionId ? filterSectionDiagnostics(file, sectionId) : diagnostics;
 
   const editorDidMount: EditorDidMount = (_getValue, luEditor) => {
     setLuEditor(luEditor);

Composer/packages/client/src/plugins.ts

@@ -1,10 +1,10 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 import expressions from '@bfc/ui-plugin-expressions';
-import prompts from '@bfc/ui-plugin-prompts';
 import selectDialog from '@bfc/ui-plugin-select-dialog';
 import selectSkillDialog from '@bfc/ui-plugin-select-skill-dialog';
-import lg from '@bfc/ui-plugin-lg';
-import lu from '@bfc/ui-plugin-luis';
+import prompts from '@bfc/ui-plugin-virtual-prompts';
+import lg from '@bfc/ui-plugin-virtual-lg';
+import lu from '@bfc/ui-plugin-virtual-luis';
 
 export default [prompts, selectDialog, selectSkillDialog, lg, lu, expressions];