feat(Templates): Blank workflow card content change on existing workflow

Localize/lang/strings.json

@@ -2179,6 +2179,7 @@
   "_bf7078.comment": "Label for description of custom max Function",
   "_bg00eY.comment": "Numbered List text",
   "_blRFVt.comment": "Chatbot connections setup card description",
+  "_boxBWI.comment": "Label text for the card that lets users replace the current workflow with blank workflow",
   "_bt2CaQ.comment": "Button text to clear all advanced parameters",
   "_bwlAWn.comment": "Hint for the button on the error card",
   "_byRkj+.comment": "This operation has secure inputs or outputs enabled.",
@@ -2435,6 +2436,7 @@
   "_kXn5e0.comment": "Chabot input placeholder text",
   "_kZCX7t.comment": "Day of the week",
   "_kcOhfh.comment": "The message to show when switching levels without connecting nodes or mappings to a target schema node.",
+  "_kcWgxU.comment": "Label text for the card that lets users start from a blank workflow",
   "_kfmLTY.comment": "Body text for a function missing a required input card",
   "_klY9UN.comment": "This announced text is read aloud with screen readers. Not shown in text.",
   "_kq+I5o.comment": "Button to add a dynamically added parameter",
@@ -2512,7 +2514,6 @@
   "_nGds/r.comment": "Required object parameter to compare to in greaterOrEqual function",
   "_nHIeXp.comment": "The status message to show in monitoring view.",
   "_nHseED.comment": "Required integer parameter to see how far in the future",
-  "_nN1ezT.comment": "Label text for the card that lets users start from a blank workflow",
   "_nNWAAh.comment": "Placeholder when no schema has been added",
   "_nODesn.comment": "Source",
   "_nOWGAV.comment": "End time text",
@@ -2953,6 +2954,7 @@
   "bf7078": "Returns the maximum value in the input array of numbers",
   "bg00eY": "Numbered list",
   "blRFVt": "Set up these connections to use them in your flow.",
+  "boxBWI": "Replace your existing workflow with an empty workflow to rebuild your integration solution.",
   "bt2CaQ": "Clear all",
   "bwlAWn": "Open operation",
   "byRkj+": "This operation has secure inputs or outputs enabled.",
@@ -3209,6 +3211,7 @@
   "kXn5e0": "Ask a question about this workflow or about Azure Logic Apps as a whole ...",
   "kZCX7t": "Monday",
   "kcOhfh": "Elements and mappings that aren't connected to a target element are removed.",
+  "kcWgxU": "Start with an empty workflow to build your integration solution.",
   "kfmLTY": "Function ''{functionName}'' is missing required inputs",
   "klY9UN": "{count, plural, one {# item matched.} =0 {no items matched.} other {# items matched.}}",
   "kq+I5o": "Add an output",
@@ -3286,7 +3289,6 @@
   "nGds/r": "Required. The object to check if it is less than or equal to value being compared to.",
   "nHIeXp": "Skipped",
   "nHseED": "Required. The number of time units the desired time is in the future.",
-  "nN1ezT": "Start with a blank workflow to build your integration process from scratch.",
   "nNWAAh": "No schema is added.",
   "nODesn": "Source",
   "nOWGAV": "End time",

apps/Standalone/src/templates/app/TemplatesConsumption.tsx

@@ -244,6 +244,7 @@ export const TemplatesConsumption = () => {
               },
             }}
             createWorkflowCall={createWorkflowCall}
+            isWorkflowEmpty={isWorkflowEmpty}
           />
         </div>
       </TemplatesDataProvider>

e2e/templates/blankWorkflowCard.spec.ts

@@ -11,6 +11,10 @@ test.describe(
       await page.goto('/templates');
       await GoToMockTemplatesGallery(page);
       await page.getByText('Blank workflow', { exact: true }).click();
+      await expect(page.getByText('Start with an empty workflow to build your integration solution.', { exact: true })).toBeVisible();
+      await expect(
+        page.getByText('Replace your existing workflow with an empty workflow to rebuild your integration solution.', { exact: true })
+      ).not.toBeVisible();
 
       page.once('dialog', (dialog) => {
         expect(dialog.message()).toBe('On Blank Workflow Click');
@@ -25,6 +29,10 @@ test.describe(
       await GoToMockTemplatesGallery(page);
       await page.getByText('Consumption', { exact: true }).click();
       await page.getByText('Blank workflow', { exact: true }).click();
+      await expect(page.getByText('Start with an empty workflow to build your integration solution.', { exact: true })).toBeVisible();
+      await expect(
+        page.getByText('Replace your existing workflow with an empty workflow to rebuild your integration solution.', { exact: true })
+      ).not.toBeVisible();
 
       page.once('dialog', (dialog) => {
         expect(dialog.message()).toBe('On Blank Workflow Click');

libs/designer/src/lib/ui/templates/TemplatesDesigner.tsx

@@ -19,6 +19,7 @@ export type CreateWorkflowHandler = (
 ) => Promise<void>;
 export interface TemplatesDesignerProps {
   detailFilters: TemplateDetailFilterType;
+  isWorkflowEmpty?: boolean;
   createWorkflowCall: CreateWorkflowHandler;
 }
 

libs/designer/src/lib/ui/templates/cards/templateCard.tsx

@@ -173,7 +173,7 @@ export const TemplateCard = ({ templateName }: TemplateCardProps) => {
   );
 };
 
-export const BlankWorkflowTemplateCard = () => {
+export const BlankWorkflowTemplateCard = ({ isWorkflowEmpty }: { isWorkflowEmpty: boolean }) => {
   const intl = useIntl();
 
   const workflowAppName = useSelector((state: RootState) => state.workflow.workflowAppName);
@@ -185,9 +185,14 @@ export const BlankWorkflowTemplateCard = () => {
       id: 'pykp8c',
     }),
     BLANK_WORKFLOW_DESCRIPTION: intl.formatMessage({
-      defaultMessage: 'Start with a blank workflow to build your integration process from scratch.',
+      defaultMessage: 'Start with an empty workflow to build your integration solution.',
       description: 'Label text for the card that lets users start from a blank workflow',
-      id: 'nN1ezT',
+      id: 'kcWgxU',
+    }),
+    REPLACE_WITH_BLANK_WORKFLOW: intl.formatMessage({
+      defaultMessage: 'Replace your existing workflow with an empty workflow to rebuild your integration solution.',
+      description: 'Label text for the card that lets users replace the current workflow with blank workflow',
+      id: 'boxBWI',
     }),
   };
 
@@ -214,7 +219,7 @@ export const BlankWorkflowTemplateCard = () => {
           {intlText.BLANK_WORKFLOW}
         </Text>
         <Text size={400} align="center" className="msla-blank-template-card-description">
-          {intlText.BLANK_WORKFLOW_DESCRIPTION}
+          {isWorkflowEmpty ? intlText.BLANK_WORKFLOW_DESCRIPTION : intlText.REPLACE_WITH_BLANK_WORKFLOW}
         </Text>
       </div>
     </DocumentCard>

libs/designer/src/lib/ui/templates/templateslist.tsx

@@ -12,7 +12,7 @@ import { setPageNum, templatesCountPerPage } from '../../core/state/templates/ma
 import { QuickViewPanel } from '../panel/templatePanel/quickViewPanel/quickViewPanel';
 import { CreateWorkflowPanel } from '../panel/templatePanel/createWorkflowPanel/createWorkflowPanel';
 
-export const TemplatesList = ({ detailFilters, createWorkflowCall }: TemplatesDesignerProps) => {
+export const TemplatesList = ({ detailFilters, createWorkflowCall, isWorkflowEmpty = true }: TemplatesDesignerProps) => {
   useEffect(() => setLayerHostSelector('#msla-layer-host'), []);
   const intl = useIntl();
   const dispatch = useDispatch<AppDispatch>();
@@ -49,7 +49,7 @@ export const TemplatesList = ({ detailFilters, createWorkflowCall }: TemplatesDe
       {filteredTemplateNames && filteredTemplateNames?.length > 0 ? (
         <div>
           <div className="msla-templates-list">
-            {selectedTabId !== 'Accelerator' && <BlankWorkflowTemplateCard />}
+            {selectedTabId !== 'Accelerator' && <BlankWorkflowTemplateCard isWorkflowEmpty={isWorkflowEmpty} />}
             {filteredTemplateNames.slice(startingIndex, endingIndex).map((templateName: string) => (
               <TemplateCard key={templateName} templateName={templateName} />
             ))}