fix: update text in handoff modals (#6902)

* update text in handoff modals

* fix casing of QnA

Composer/packages/client/src/components/ManageLuis/ManageLuis.tsx

@@ -119,7 +119,7 @@ export const ManageLuis = (props: ManageLuisProps) => {
     setCurrentPage(1);
     setActionOptions([
       { key: 'create', text: formatMessage('Create a new LUIS resource'), disabled: true },
-      { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: true },
+      { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: true },
       { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
     ]);
     if (!props.hidden) {
@@ -172,15 +172,15 @@ export const ManageLuis = (props: ManageLuisProps) => {
         setNoKeys(true);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new LUIS resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
         ]);
       } else {
         setNoKeys(false);
         setAuthoringKeys(authoring);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new LUIS resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: false },
         ]);
       }
@@ -384,11 +384,7 @@ export const ManageLuis = (props: ManageLuisProps) => {
   const renderPageOne = () => {
     return (
       <div>
-        <p>
-          {formatMessage(
-            'Select your Azure subscription and choose from existing LUIS keys, or create a new LUIS resource. Learn more'
-          )}
-        </p>
+        <p>{formatMessage('How would you like to provision this resource?')}</p>
         <div css={mainElementStyle}>
           <Dropdown
             disabled={!(availableSubscriptions?.length > 0)}
@@ -578,10 +574,10 @@ export const ManageLuis = (props: ManageLuisProps) => {
       )}
       <ProvisionHandoff
         developerInstructions={formatMessage(
-          'Copy and share this information with your Azure admin. After your Luis key is provisioned, you will be ready to test your bot.'
+          'Copy and share this information with your Azure admin to provision resources on your behalf.'
         )}
         handoffInstructions={formatMessage(
-          'Using the Azure portal, create a Language Understanding resource. Create these in a subscription that the developer has accesss to. This will result in an authoring key and an endpoint key.  Provide these keys to the developer in a secure manner.'
+          'I am working on a Microsoft Bot Framework project, and I now require some Azure resources to be created. Please follow the instructions below to create these resources and provide them to me.\n\n1. Using the Azure portal, please create a Language Understanding resource on my behalf.\n2. Once provisioned, securely share the resulting credentials with me as described in the link below.\n\nDetailed instructions:\nhttps://aka.ms/bfcomposerhandoffluis'
         )}
         hidden={!showHandoff}
         title={formatMessage('Share resource request')}

Composer/packages/client/src/components/ManageQNA/ManageQNA.tsx

@@ -53,10 +53,6 @@ const summaryStyles = { background: '#F3F2F1', padding: '1px 1rem' };
 const mainElementStyle = { marginBottom: 20 };
 const CREATE_NEW_KEY = 'CREATE_NEW';
 
-const handoffInstructions = formatMessage(
-  'Using the Azure portal, create a Language Understanding resource. Create these in a subscription that the developer has accesss to. This will result in an authoring key and an endpoint key.  Provide these keys to the developer in a secure manner.'
-);
-
 export const ManageQNA = (props: ManageQNAProps) => {
   const [localRootQNAKey, setLocalRootQNAKey] = useState<string>('');
 
@@ -129,7 +125,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
     setCurrentPage(1);
     setActionOptions([
       { key: 'create', text: formatMessage('Create a new QnA MAker resource'), disabled: true },
-      { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: true },
+      { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: true },
       { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
     ]);
     if (!props.hidden) {
@@ -182,15 +178,15 @@ export const ManageQNA = (props: ManageQNAProps) => {
         setNoKeys(true);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new QnA Maker resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
         ]);
       } else {
         setNoKeys(false);
         setQNAKeys(keys);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new QnA Maker resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: false },
         ]);
       }
@@ -377,7 +373,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
       } catch (err) {
         setOutcomeDescription(
           formatMessage(
-            'Due to the following error, we were unable to successfully add your selected LUIS keys to your bot project:'
+            'Due to the following error, we were unable to successfully add your selected QnA keys to your bot project:'
           )
         );
         setOutcomeSummary(<p>{err.message}</p>);
@@ -390,7 +386,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
       setLoadingQNA(false);
 
       setOutcomeDescription(
-        formatMessage('The following LUIS resource was successfully created and added to your bot project:')
+        formatMessage('The following QnA resource was successfully created and added to your bot project:')
       );
       setOutcomeSummary(
         <div>
@@ -433,7 +429,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
   };
 
   const onChangeQNAKey = async (_, opt) => {
-    // get list of luis keys for this subscription
+    // get list of QNA keys for this subscription
     setLocalRootQNAKey(opt.key);
   };
 
@@ -505,9 +501,11 @@ export const ManageQNA = (props: ManageQNAProps) => {
       )}
       <ProvisionHandoff
         developerInstructions={formatMessage(
-          'Copy and share this information with your Azure admin. After your QNA key is provisioned, you will be ready to test your bot with qna.'
+          'Copy and share this information with your Azure admin to provision resources on your behalf.'
+        )}
+        handoffInstructions={formatMessage(
+          'I am working on a Microsoft Bot Framework project, and I now require some Azure resources to be created. Please follow the instructions below to create these resources and provide them to me.\n\n1. Using the Azure portal, please create a QnAMaker resource on my behalf.\n2. Once provisioned, securely share the resulting credentials with me as described in the link below.\n\nDetailed instructions:\nhttps://aka.ms/bfcomposerhandoffqnamaker'
         )}
-        handoffInstructions={handoffInstructions}
         hidden={!showHandoff}
         title={formatMessage('Share resource request')}
         onBack={() => {
@@ -519,7 +517,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
       <Dialog
         dialogContentProps={{
           type: DialogType.normal,
-          title: currentPage === 2 ? formatMessage('Create new QNA resources') : formatMessage('Select QNA keys'),
+          title: currentPage === 2 ? formatMessage('Create new QnA resources') : formatMessage('Select QnA keys'),
         }}
         hidden={props.hidden}
         minWidth={480}
@@ -531,11 +529,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
         <div>
           {currentPage === 1 && (
             <div>
-              <p>
-                {formatMessage(
-                  'Select your Azure subscription and choose from existing QNA keys, or create a new QNA resource. Learn more'
-                )}
-              </p>
+              <p>{formatMessage('How would you like to provision this resource?')}</p>
               <div css={mainElementStyle}>
                 <Dropdown
                   disabled={!(availableSubscriptions?.length > 0)}
@@ -562,7 +556,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
                   {noKeys && subscriptionId && (
                     <span style={{ color: 'rgb(161, 159, 157)' }}>
                       {formatMessage(
-                        'No existing QNA resource found in this subscription. Click “Next” to create new.'
+                        'No existing QnA resource found in this subscription. Click “Next” to create new.'
                       )}
                     </span>
                   )}
@@ -611,7 +605,7 @@ export const ManageQNA = (props: ManageQNAProps) => {
               <div css={mainElementStyle}>
                 <p>
                   {formatMessage(
-                    'Input your details below to create a new QNA resource. You will be able to manage your new resource in the Azure portal. Learn more'
+                    'Input your details below to create a new QnA resource. You will be able to manage your new resource in the Azure portal. Learn more'
                   )}
                 </p>
                 <Dropdown

Composer/packages/client/src/components/ManageSpeech/ManageSpeech.tsx

@@ -78,10 +78,6 @@ export const ManageSpeech = (props: ManageSpeechProps) => {
   const [outcomeSummary, setOutcomeSummary] = useState<React.ReactNode>();
   const [outcomeError, setOutcomeError] = useState<boolean>(false);
 
-  const handoffInstructions = formatMessage(
-    'Using the Azure portal, create a Language Understanding resource. Create these in a subscription that the developer has accesss to. This will result in an authoring key and an endpoint key.  Provide these keys to the developer in a secure manner.'
-  );
-
   /* Copied from Azure Publishing extension */
   const getSubscriptions = async (token: string): Promise<Array<Subscription>> => {
     const tokenCredentials = new TokenCredentials(token);
@@ -125,7 +121,7 @@ export const ManageSpeech = (props: ManageSpeechProps) => {
     setCurrentPage(1);
     setActionOptions([
       { key: 'create', text: formatMessage('Create a new Speech resource'), disabled: true },
-      { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: true },
+      { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: true },
       { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
     ]);
     if (!props.hidden) {
@@ -178,15 +174,15 @@ export const ManageSpeech = (props: ManageSpeechProps) => {
         setNoKeys(true);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new Speech resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: true },
         ]);
       } else {
         setNoKeys(false);
         setKeys(keys);
         setActionOptions([
           { key: 'create', text: formatMessage('Create a new Speech resource') },
-          { key: 'handoff', text: formatMessage('Generate a resource request'), disabled: false },
+          { key: 'handoff', text: formatMessage('Handoff to admin'), disabled: false },
           { key: 'choose', text: formatMessage('Choose from existing'), disabled: false },
         ]);
       }
@@ -407,9 +403,11 @@ export const ManageSpeech = (props: ManageSpeechProps) => {
       )}
       <ProvisionHandoff
         developerInstructions={formatMessage(
-          'Copy and share this information with your Azure admin. After your Speech key is provisioned, you will be ready to test your bot with speech.'
+          'Copy and share this information with your Azure admin to provision resources on your behalf.'
+        )}
+        handoffInstructions={formatMessage(
+          'I am working on a Microsoft Bot Framework project, and I now require some Azure resources to be created. Please follow the instructions below to create these resources and provide them to me.\n\n1. Using the Azure portal, please create a Speech resource on my behalf.\n2. Once provisioned, securely share the resulting credentials with me as described in the link below.\n\nDetailed instructions:\nhttps://aka.ms/bfcomposerhandoffdls'
         )}
-        handoffInstructions={handoffInstructions}
         hidden={!showHandoff}
         title={formatMessage('Share resource request')}
         onBack={() => {

extensions/azurePublish/src/components/azureProvisionDialog.tsx

@@ -312,21 +312,15 @@ export const AzureProvisionDialog: React.FC = () => {
     const createQnAResource = resources.filter((r) => r.key === 'qna').length > 0;
 
     const provisionComposer = `node provisionComposer.js --subscriptionId ${
-      formData.subscriptionId ?? '<YOUR SUBSCRIPTION ID>'
-    } --name ${formData.hostname ?? '<RESOURCE NAME>'}
-    --appPassword=<16 CHAR PASSWORD>
-    --location=${formData.region || 'westus'}
-    --resourceGroup=${formData.resourceGroup || '<RESOURCE GROUP NAME>'}
-    --createLuisResource=${createLuisResource}
-    --createLuisAuthoringResource=${createLuisAuthoringResource}
-    --createCosmosDb=${createCosmosDb}
-    --createStorage=${createStorage}
-    --createAppInsights=${createAppInsights}
-    --createQnAResource=${createQnAResource}
-    `;
+      formData.subscriptionId || '<YOUR SUBSCRIPTION ID>'
+    } --name ${formData.hostname || '<RESOURCE NAME>'} --appPassword=<16 CHAR PASSWORD> --location=${
+      formData.region || 'westus'
+    } --resourceGroup=${
+      formData.resourceGroup || '<RESOURCE GROUP NAME>'
+    } --createLuisResource=${createLuisResource} --createLuisAuthoringResource=${createLuisAuthoringResource} --createCosmosDb=${createCosmosDb} --createStorage=${createStorage} --createAppInsights=${createAppInsights} --createQnAResource=${createQnAResource}`;
 
     const instructions = formatMessage(
-      'A hosting environment and some Azure cognitive services are required for this bot project to be published.  You can find instructions for creating the necessary resources and communicating them back to me at the link below: \n\nSOME LINK GOES HERE\n\nIn addition, here is a customized command that you can use to automatically create the required resources:\n\n {command}',
+      'I am working on a Microsoft Bot Framework project, and I now require some Azure resources to be created. Please follow the instructions below to create these resources and provide them to me.\n\n1. Follow the instructions at the link below to run the provisioning command (seen below)\n2. Copy and paste the resulting JSON and securely share it with me.\n\nProvisoning Command:\n{command}\n\nDetailed instructions:\nhttps://aka.ms/how-to-complete-provision-handoff',
       { command: provisionComposer }
     );
 
@@ -1109,10 +1103,12 @@ export const AzureProvisionDialog: React.FC = () => {
   return (
     <Fragment>
       <ProvisionHandoff
-        developerInstructions={formatMessage('Send this to your IT admin')}
+        developerInstructions={formatMessage(
+          'Copy and share the following information with your Azure admin to provision resources on your behalf.'
+        )}
         handoffInstructions={handoffInstructions}
         hidden={!showHandoff}
-        title={formatMessage('Generate a provisioning request')}
+        title={formatMessage('Share resource request')}
         onBack={() => {
           setShowHandoff(false);
         }}