fix: Check the name without a number at the beginning when creating a new dialog

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

@@ -8,10 +8,10 @@ import { Stack, StackItem } from 'office-ui-fabric-react/lib/Stack';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { useRecoilValue } from 'recoil';
 import { RecognizerSchema, useRecognizerConfig, useShellApi } from '@bfc/extension-client';
-import { DialogFactory, SDKKinds } from '@bfc/shared';
+import { DialogFactory, SDKKinds, DialogUtils } from '@bfc/shared';
 import { DialogWrapper, DialogTypes } from '@bfc/ui-shared';
 
-import { DialogCreationCopy, nameRegex } from '../../constants';
+import { DialogCreationCopy } from '../../constants';
 import { StorageFolder } from '../../recoilModel/types';
 import { FieldConfig, useForm } from '../../hooks/useForm';
 import { actionsSeedState, schemasState, validateDialogSelectorFamily } from '../../recoilModel';
@@ -46,9 +46,12 @@ export const CreateDialogModal: React.FC<CreateDialogModalProps> = (props) => {
     name: {
       required: true,
       validate: (value) => {
-        if (!nameRegex.test(value)) {
-          return formatMessage('Spaces and special characters are not allowed. Use letters, numbers, -, or _.');
+        try {
+          DialogUtils.validateDialogName(value);
+        } catch (error) {
+          return error.message;
         }
+
         if (dialogs.some((dialog) => dialog.id.toLowerCase() === value.toLowerCase())) {
           return formatMessage('Duplicate dialog name');
         }

Composer/packages/lib/shared/__tests__/dialogUtils/validateDialogName.test.ts

@@ -0,0 +1,23 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import { validateDialogName } from '../../src/dialogUtils/validateDialogName';
+
+const error = new Error(
+  "Spaces and special characters are not allowed. Use letters, numbers, -, or _ and don't use number at the beginning."
+);
+const emptyError = new Error('The file name can not be empty');
+
+describe('check dialog name', () => {
+  it('don not support special characters', () => {
+    expect(() => validateDialogName('*a')).toThrowError(error);
+    expect(() => validateDialogName('c*a')).toThrowError(error);
+    expect(() => validateDialogName('c a')).toThrowError(error);
+    expect(() => validateDialogName('')).toThrowError(emptyError);
+  });
+
+  it('don not support number at the beginning.', () => {
+    expect(() => validateDialogName('1a')).toThrowError(error);
+    expect(() => validateDialogName('a1')).not.toThrowError();
+  });
+});

Composer/packages/lib/shared/src/dialogUtils/index.ts

@@ -2,3 +2,4 @@
 // Licensed under the MIT License.
 
 export * from './jsonTracker';
+export * from './validateDialogName';

Composer/packages/lib/shared/src/dialogUtils/validateDialogName.ts

@@ -0,0 +1,20 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+import formatMessage from 'format-message';
+
+export const validateDialogName = (name: string) => {
+  const nameRegex = /^[a-zA-Z][a-zA-Z0-9-_]*$/;
+
+  if (!name) {
+    throw new Error(formatMessage('The file name can not be empty'));
+  }
+
+  if (!nameRegex.test(name)) {
+    throw new Error(
+      formatMessage(
+        "Spaces and special characters are not allowed. Use letters, numbers, -, or _ and don't use number at the beginning."
+      )
+    );
+  }
+};

Composer/packages/server/src/models/bot/botProject.ts

@@ -6,7 +6,16 @@ import fs from 'fs';
 
 import axios from 'axios';
 import { autofixReferInDialog } from '@bfc/indexers';
-import { getNewDesigner, FileInfo, Diagnostic, IBotProject, DialogSetting, FileExtensions, Skill } from '@bfc/shared';
+import {
+  getNewDesigner,
+  FileInfo,
+  Diagnostic,
+  IBotProject,
+  DialogSetting,
+  FileExtensions,
+  Skill,
+  DialogUtils,
+} from '@bfc/shared';
 import merge from 'lodash/merge';
 import { UserIdentity, ExtensionContext } from '@bfc/extension';
 import { FeedbackType, generate } from '@microsoft/bf-generate-library';
@@ -409,21 +418,14 @@ export class BotProject implements IBotProject {
   };
 
   public validateFileName = (name: string) => {
-    const nameRegex = /^[a-zA-Z0-9-_]+$/;
     const { fileId, fileType } = parseFileName(name, '');
 
     let fileName = fileId;
     if (fileType === '.dialog') {
       fileName = Path.basename(name, fileType);
     }
 
-    if (!fileName) {
-      throw new Error('The file name can not be empty');
-    }
-
-    if (!nameRegex.test(fileName)) {
-      throw new Error('Spaces and special characters are not allowed. Use letters, numbers, -, or _.');
-    }
+    DialogUtils.validateDialogName(fileName);
   };
 
   public createFile = async (name: string, content = '') => {