[ACS-5761] Demo Shell pages cleanup (#8802)

remove the content that is not covered by e2e testing, preparation steps for the demo shell decommissioning

demo-shell/src/app/components/cloud/cloud-layout.component.html

@@ -1,5 +1,5 @@
 <mat-tab-group class="app-cloud-layout-tab-body">
-  <mat-tab label="{{'PS_CLOUD_TAB.APPS_TAB' | translate}}">
+  <mat-tab label="App">
     <adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="270" [stepOver]="780">
       <adf-sidenav-layout-header>
         <ng-template>
@@ -8,18 +8,18 @@
       </adf-sidenav-layout-header>
       <adf-sidenav-layout-navigation>
         <ng-template>
-          <adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
+          <adf-sidebar-action-menu [expanded]="true" [width]="205" title="CREATE">
             <mat-icon adf-sidebar-menu-title-icon>arrow_drop_down</mat-icon>
             <div adf-sidebar-menu-options>
               <button mat-menu-item data-automation-id="btn-start-task" (click)="onStartTask()">
                 <mat-icon>assessment</mat-icon>
-                <span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
+                <span>New Task</span>
               </button>
             </div>
             <div adf-sidebar-menu-options>
               <button mat-menu-item data-automation-id="btn-start-process" (click)="onStartProcess()">
                 <mat-icon>assessment</mat-icon>
-                <span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_PROCESS' | translate}}</span>
+                <span>New Process</span>
               </button>
             </div>
           </adf-sidebar-action-menu>
@@ -33,7 +33,7 @@
       </adf-sidenav-layout-content>
     </adf-sidenav-layout>
   </mat-tab>
-  <mat-tab label="{{'PS_CLOUD_TAB.SETTINGS_TAB' | translate}}">
+  <mat-tab label="Settings">
       <app-cloud-settings></app-cloud-settings>
   </mat-tab>
 </mat-tab-group>

demo-shell/src/app/components/cloud/community/community-cloud.component.html

@@ -1,20 +1,20 @@
 <mat-tab-group class="app-cloud-layout-tab-body">
-  <mat-tab label="{{'PS_CLOUD_TAB.APPS_TAB' | translate}}">
+  <mat-tab label="App">
     <adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="270" [stepOver]="780">
       <adf-sidenav-layout-navigation>
         <ng-template>
-          <adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
+          <adf-sidebar-action-menu [expanded]="true" [width]="205" title="CREATE">
             <mat-icon adf-sidebar-menu-title-icon>arrow_drop_down</mat-icon>
               <div adf-sidebar-menu-options>
                 <button mat-menu-item data-automation-id="btn-start-task" (click)="onStartTask()">
                  <mat-icon>assessment</mat-icon>
-                   <span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
+                   <span>New Task</span>
                 </button>
               </div>
               <div adf-sidebar-menu-options>
                 <button mat-menu-item data-automation-id="btn-start-process" (click)="onStartProcess()">
                   <mat-icon>assessment</mat-icon>
-                  <span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_PROCESS' | translate}}</span>
+                  <span>New Process</span>
                 </button>
               </div>
             </adf-sidebar-action-menu>
@@ -28,7 +28,7 @@
         </adf-sidenav-layout-content>
     </adf-sidenav-layout>
   </mat-tab>
-  <mat-tab label="{{'PS_CLOUD_TAB.SETTINGS_TAB' | translate}}">
+  <mat-tab label="Settings">
     <app-cloud-settings></app-cloud-settings>
   </mat-tab>
 </mat-tab-group>

demo-shell/src/app/components/cloud/people-groups-cloud-demo.component.html

@@ -1,41 +1,33 @@
 <mat-card class="app-section">
-    <mat-card-title>
-        {{ 'APP_LAYOUT.PEOPLE_CLOUD' | translate}}
-    </mat-card-title>
+    <mat-card-title>People Cloud Component</mat-card-title>
 
     <mat-card-content>
         <br>
         <mat-radio-group (change)="onChangePeopleMode($event)">
-            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">{{
-                'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
-            <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-multiple-mode" value="multiple">{{
-                'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
+            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">Single Selection</mat-radio-button>
+            <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-multiple-mode" value="multiple">Multiple Selection</mat-radio-button>
         </mat-radio-group>
         <div class="app-people-control-options">
             <mat-form-field *ngIf="isPeopleAppNameSelected()" class="app-preselect-value">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }}</mat-label>
+                <mat-label>Application Name</mat-label>
                 <input matInput (input)="setPeopleAppName($any($event).target?.value)" data-automation-id="app-people-app-input" />
             </mat-form-field>
             <mat-form-field class="app-preselect-value">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
-                <input matInput
-                    (input)="setPeopleRoles($any($event).target?.value)"
-                    data-automation-id="app-people-roles-input"/>
+                <mat-label>Roles: ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
+                <input matInput (input)="setPeopleRoles($any($event).target?.value)" data-automation-id="app-people-roles-input"/>
             </mat-form-field>
             <mat-form-field class="app-preselect-value">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.GROUPS_RESTRICTION' | translate }} ["hr", "sales"]</mat-label>
+                <mat-label>Groups Restriction ["hr", "sales"]</mat-label>
                 <input matInput
                     (input)="setPeopleGroupsRestriction($any($event).target?.value)"
                     data-automation-id="app-people-groups-restriction-input"/>
             </mat-form-field>
             <mat-form-field class="app-preselect-value-full">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.PRESELECTED_VALUE' | translate }} {{ defaultPeoplePlaceholder }}</mat-label>
+                <mat-label>Preselect: {{ defaultPeoplePlaceholder }}</mat-label>
                 <input matInput (input)="setPeoplePreselectValue($any($event).target?.value)"  data-automation-id="app-people-preselect-input" />
             </mat-form-field>
-            <mat-checkbox class="app-preselect-value" (change)="onChangePeopleValidation($event)">{{
-                'PEOPLE_GROUPS_CLOUD.PRESELECT_VALIDATION' | translate }}</mat-checkbox>
-            <mat-checkbox data-automation-id="app-people-readonly" value="{{ peopleReadonly }}" (change)="onChangePeopleReadonly($event)">{{
-                'PEOPLE_GROUPS_CLOUD.READONLY_MODE' | translate }}</mat-checkbox>
+            <mat-checkbox class="app-preselect-value" (change)="onChangePeopleValidation($event)">Preselect validation</mat-checkbox>
+            <mat-checkbox data-automation-id="app-people-readonly" value="{{ peopleReadonly }}" (change)="onChangePeopleReadonly($event)">Read-only Mode</mat-checkbox>
         </div>
         <div>
             <adf-cloud-people
@@ -51,7 +43,7 @@
         </div>
 
         <div class="app-people-list" *ngIf="peopleMode === 'multiple'">
-            <h4>{{ 'PEOPLE_GROUPS_CLOUD.ALL_PRESELECTED_USERS' | translate }}</h4>
+            <h4>All Preselected Users</h4>
             <mat-list role="list">
                 <mat-list-item *ngFor="let item of preSelectUsers" role="listitem">
                     <mat-icon mat-list-icon>person</mat-icon>
@@ -60,7 +52,7 @@
             </mat-list>
 
             <div *ngIf="invalidUsers.length > 0">
-                <h4>{{ 'PEOPLE_GROUPS_CLOUD.INVALID_USERS' | translate }} <mat-icon>warning</mat-icon> </h4>
+                <h4>Invalid Users <mat-icon>warning</mat-icon> </h4>
                 <mat-list role="list">
                     <mat-list-item *ngFor="let invalidUser of invalidUsers" role="listitem">
                         <mat-icon mat-list-icon>person</mat-icon>
@@ -73,45 +65,33 @@
 </mat-card>
 
 <mat-card class="app-section">
-    <mat-card-title>
-        {{ 'APP_LAYOUT.GROUPS_CLOUD' | translate}}
-    </mat-card-title>
+    <mat-card-title>Groups Cloud Component</mat-card-title>
 
     <mat-card-content>
         <br>
         <mat-radio-group (change)="onChangeGroupsMode($event)">
-            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">{{
-                'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
-            <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-multiple-mode" value="multiple">{{
-                'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
+            <mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">Single Selection</mat-radio-button>
+            <mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-multiple-mode" value="multiple">Multiple Selection</mat-radio-button>
         </mat-radio-group>
         <div class="app-groups-control-options">
             <mat-form-field *ngIf="isGroupAppNameSelected()" class="app-preselect-value">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }}</mat-label>
-                <input matInput
-                    (input)="setGroupAppName($any($event).target?.value)"
-                    data-automation-id="app-group-app-input"/>
+                <mat-label>Application Name</mat-label>
+                <input matInput (input)="setGroupAppName($any($event).target?.value)" data-automation-id="app-group-app-input"/>
             </mat-form-field>
             <mat-form-field class="app-preselect-value">
-                <mat-label>{{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
-                <input matInput
-                    (input)="setGroupRoles($any($event).target?.value)"
-                    data-automation-id="app-group-roles-input"/>
+                <mat-label>Roles: ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
+                <input matInput (input)="setGroupRoles($any($event).target?.value)" data-automation-id="app-group-roles-input"/>
             </mat-form-field>
             <mat-form-field class="app-preselect-value-full">
                 <mat-label>Preselect: {{ defaultGroupPlaceholder }}</mat-label>
-                <input matInput
-                    (input)="setGroupsPreselectValue($any($event).target?.value)"
-                    data-automation-id="app-group-preselect-input" />
+                <input matInput (input)="setGroupsPreselectValue($any($event).target?.value)" data-automation-id="app-group-preselect-input" />
             </mat-form-field>
-            <mat-checkbox class="app-preselect-value" (change)="onChangeGroupValidation($event)">
-                {{ 'PEOPLE_GROUPS_CLOUD.PRESELECT_VALIDATION' | translate }}
-            </mat-checkbox>
+            <mat-checkbox class="app-preselect-value" (change)="onChangeGroupValidation($event)">Preselect validation</mat-checkbox>
             <mat-checkbox
                 data-automation-id="app-group-readonly"
                 value="{{ groupReadonly }}"
                 (change)="onChangeGroupReadonly($event)">
-                {{ 'PEOPLE_GROUPS_CLOUD.READONLY_MODE' | translate }}
+                Read-only Mode
             </mat-checkbox>
         </div>
         <div>
@@ -126,7 +106,7 @@
         </div>
 
         <div class="app-group-list" *ngIf="groupMode === 'multiple'">
-            <h4>{{ 'PEOPLE_GROUPS_CLOUD.ALL_PRESELECTED_GROUPS' | translate }}</h4>
+            <h4>All Preselected Groups</h4>
             <mat-list role="list">
                 <mat-list-item *ngFor="let item of preSelectGroup" role="listitem">
                     <mat-icon mat-list-icon>group</mat-icon>
@@ -135,7 +115,7 @@
             </mat-list>
 
             <div *ngIf="invalidGroups.length > 0">
-                <h4>{{ 'PEOPLE_GROUPS_CLOUD.INVALID_GROUPS' | translate }} <mat-icon>warning</mat-icon> </h4>
+                <h4>Invalid Groups <mat-icon>warning</mat-icon> </h4>
                 <mat-list role="list">
                     <mat-list-item *ngFor="let invalidGroup of invalidGroups" role="listitem">
                         <mat-icon mat-list-icon>group</mat-icon>

demo-shell/src/app/components/cloud/processes-cloud-demo.component.html

@@ -46,25 +46,25 @@
     </adf-pagination>
     <div *ngIf="testingMode">
         <div *ngIf="multiselect">
-            {{ 'SETTINGS_CLOUD.SELECTED_ROWS' | translate }}:
+            Selected Rows:
             <ul>
                 <li *ngFor="let row of selectedRows">{{ row.id }}</li>
             </ul>
         </div>
         <div *ngIf="actionMenu">
-            <span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}:</span>
+            <span>Action Menu:</span>
             <br>
             <div *ngIf="selectedAction">
-                <span>{{ 'SETTINGS_CLOUD.ACTION.PROCESS_ID' | translate }}: {{ selectedAction.id }}</span><br>
-                <span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedAction.actionType }}</span>
+                <span>Process Instance ID: {{ selectedAction.id }}</span><br>
+                <span>Action Type: {{ selectedAction.actionType }}</span>
             </div>
         </div>
         <div *ngIf="contextMenu">
-            <span>{{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}:</span>
+            <span>Context Menu:</span>
             <br>
             <div *ngIf="selectedContextAction">
-                <span>{{ 'SETTINGS_CLOUD.ACTION.PROCESS_ID' | translate }}: {{ selectedContextAction.id }}</span><br>
-                <span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedContextAction.actionType }}</span>
+                <span>Process Instance ID: {{ selectedContextAction.id }}</span><br>
+                <span>Action Type}: {{ selectedContextAction.actionType }}</span>
             </div>
         </div>
     </div>

demo-shell/src/app/components/cloud/shared/cloud-settings.component.html

@@ -1,25 +1,23 @@
-<mat-slide-toggle [color]="'primary'" [checked]="multiselect" (change)="toggleMultiselect()" data-automation-id="multiSelection">
-    {{ 'SETTINGS_CLOUD.MULTISELECTION' | translate }}
+<mat-slide-toggle [checked]="multiselect" (change)="toggleMultiselect()" data-automation-id="multiSelection">
+    Multiselection
 </mat-slide-toggle>
-<mat-slide-toggle [color]="'primary'" [checked]="actionMenu" (change)="toggleActionMenu()" data-automation-id="actionmenu">
-    {{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}
+<mat-slide-toggle [checked]="actionMenu" (change)="toggleActionMenu()" data-automation-id="actionmenu">
+    Action Menu
 </mat-slide-toggle>
-<mat-slide-toggle [color]="'primary'" [checked]="contextMenu" (change)="toggleContextMenu()" data-automation-id="contextmenu">
-    {{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}
+<mat-slide-toggle [checked]="contextMenu" (change)="toggleContextMenu()" data-automation-id="contextmenu">
+    Context Menu
 </mat-slide-toggle>
-<mat-slide-toggle [color]="'primary'" [checked]="testingMode" (change)="toggleTestingMode()" data-automation-id="testingMode">
-    {{ 'SETTINGS_CLOUD.TESTING_MODE' | translate }}
+<mat-slide-toggle [checked]="testingMode" (change)="toggleTestingMode()" data-automation-id="testingMode">
+    Testing Mode
 </mat-slide-toggle>
-<mat-slide-toggle [color]="'primary'" [checked]="taskDetailsRedirection" (change)="toggleTaskDetailsRedirection()" data-automation-id="taskDetailsRedirection">
-    {{ 'SETTINGS_CLOUD.TASK_DETAILS_REDIRECTION' | translate }}
+<mat-slide-toggle [checked]="taskDetailsRedirection" (change)="toggleTaskDetailsRedirection()" data-automation-id="taskDetailsRedirection">
+    Display task details on task click
 </mat-slide-toggle>
-<mat-slide-toggle [color]="'primary'" [checked]="processDetailsRedirection" (change)="toggleProcessDetailsRedirection()" data-automation-id="processDetailsRedirection">
-    {{ 'SETTINGS_CLOUD.PROCESS_DETAILS_REDIRECTION' | translate }}
+<mat-slide-toggle [checked]="processDetailsRedirection" (change)="toggleProcessDetailsRedirection()" data-automation-id="processDetailsRedirection">
+    Display process details on process click
 </mat-slide-toggle>
 <mat-form-field data-automation-id="selectionMode">
-    <mat-label>
-        {{ 'SETTINGS_CLOUD.SELECTION_MODE' | translate }}
-    </mat-label>
+    <mat-label>Selection Mode</mat-label>
     <mat-select [(ngModel)]="selectionMode" (selectionChange)="onSelectionModeChange()">
         <mat-option *ngFor="let option of selectionModeOptions" [value]="option.value">
             {{ option.title }}
@@ -28,38 +26,28 @@
 </mat-form-field>
 <mat-card *ngIf="actionMenu || contextMenu">
     <mat-card-header>
-      <mat-card-title>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TITLE' | translate }}</mat-card-title>
+      <mat-card-title>Add Action</mat-card-title>
     </mat-card-header>
     <mat-card-content>
         <form class="app-cloud-settings-form" [formGroup]="actionMenuForm">
             <mat-form-field>
-                <input matInput formControlName="key" placeholder="{{ 'SETTINGS_CLOUD.ACTION.KEY' | translate }}">
+                <input matInput formControlName="key" placeholder="Key">
             </mat-form-field>
             <mat-form-field>
-                <input matInput formControlName="title" placeholder="{{ 'SETTINGS_CLOUD.ACTION.TITLE' | translate }}">
+                <input matInput formControlName="title" placeholder="Title">
             </mat-form-field>
             <mat-form-field>
-                <input matInput formControlName="icon" placeholder="{{ 'SETTINGS_CLOUD.ACTION.ICON' | translate }}">
+                <input matInput formControlName="icon" placeholder="Icon">
             </mat-form-field>
-            <mat-checkbox formControlName="visible">
-                {{ 'SETTINGS_CLOUD.ACTION.ACTION_VISIBLE' | translate }}
-            </mat-checkbox>
-            <mat-checkbox formControlName="disabled">
-                {{ 'SETTINGS_CLOUD.ACTION.ACTION_DISABLE' | translate }}
-            </mat-checkbox>
-            <button mat-raised-button (click)="addAction()">
-                    {{ 'SETTINGS_CLOUD.ACTION.ADD_BUTTON' | translate }}
-            </button>
+            <mat-checkbox formControlName="visible">Visible</mat-checkbox>
+            <mat-checkbox formControlName="disabled">Disable</mat-checkbox>
+            <button mat-raised-button (click)="addAction()">Add</button>
         </form>
         <div *ngIf="actions.length > 0">
             <mat-chip-list>
                 <mat-chip *ngFor="let action of actions" [removable]="true">
                     {{action.title}}
-                    <mat-icon
-                        matChipRemove
-                        (click)="removeAction(action)">
-                        cancel
-                    </mat-icon>
+                    <mat-icon matChipRemove (click)="removeAction(action)">cancel</mat-icon>
                 </mat-chip>
             </mat-chip-list>
         </div>

demo-shell/src/app/components/cloud/task-header-cloud-demo.component.html

@@ -1,7 +1,7 @@
-<h2>{{ 'APP_LAYOUT.TASK_HEADER_CLOUD.COMPONENT_NAME' | translate }}</h2>
+<h2>Task Header Cloud</h2>
 
 <mat-form-field class="app-appName-input">
-    {{ 'APP_LAYOUT.TASK_HEADER_CLOUD.APP_NAME_INPUT' | translate }}
+    App name
     <input matInput
            [type]="'text'"
            [formControl]="appNameFormControl"
@@ -9,7 +9,7 @@
 </mat-form-field>
 
 <mat-form-field class="app-taskId-input">
-    {{ 'APP_LAYOUT.TASK_HEADER_CLOUD.TASK_ID_INPUT' | translate }}
+    Task id
     <input matInput
            [type]="'text'"
            [formControl]="taskIdFormControl"

demo-shell/src/app/components/cloud/tasks-cloud-demo.component.html

@@ -46,25 +46,25 @@
     </adf-pagination>
     <div *ngIf="testingMode">
         <div *ngIf="multiselect">
-            {{ 'SETTINGS_CLOUD.SELECTED_ROWS' | translate }}:
+            Selected Rows:
             <ul>
                 <li *ngFor="let row of selectedRows" [attr.data-automation-id]="row.id">{{ row.name }}</li>
             </ul>
         </div>
         <div *ngIf="actionMenu">
-            <span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}:</span>
+            <span>Action Menu:</span>
             <br>
             <div *ngIf="selectedAction">
-                <span [attr.data-automation-id]="selectedAction.id">{{ 'SETTINGS_CLOUD.ACTION.TASK_ID' | translate }}: {{ selectedAction.id }}</span><br>
-                <span [attr.data-automation-id]="selectedAction.actionType">{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedAction.actionType }}</span>
+                <span [attr.data-automation-id]="selectedAction.id">Task ID: {{ selectedAction.id }}</span><br>
+                <span [attr.data-automation-id]="selectedAction.actionType">Action Type: {{ selectedAction.actionType }}</span>
             </div>
         </div>
         <div *ngIf="contextMenu">
-            <span>{{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}:</span>
+            <span>Context Menu:</span>
             <br>
             <div *ngIf="selectedContextAction">
-                <span [attr.data-automation-id]="selectedContextAction.id">{{ 'SETTINGS_CLOUD.ACTION.TASK_ID' | translate }}: {{ selectedContextAction.id }}</span><br>
-                <span [attr.data-automation-id]="selectedContextAction.actionType">{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedContextAction.actionType }}</span>
+                <span [attr.data-automation-id]="selectedContextAction.id">Task ID: {{ selectedContextAction.id }}</span><br>
+                <span [attr.data-automation-id]="selectedContextAction.actionType">Action Type: {{ selectedContextAction.actionType }}</span>
             </div>
         </div>
     </div>