Fix feedback on stories (#1245)

* Remove task panel feature toggle * Add new line fix for notes * Add handler for no logs existing
valtimo-platform · Oct 17, 2024 · 2b34e9f · 2b34e9f
1 parent f98af65
commit 2b34e9f
Show file tree

Hide file tree

Showing 15 changed files with 109 additions and 102 deletions.
diff --git a/projects/valtimo/components/src/lib/components/timeline/timeline.component.html b/projects/valtimo/components/src/lib/components/timeline/timeline.component.html
@@ -14,54 +14,63 @@
   ~ limitations under the License.
   -->
 
-<div>
-  <div id="no-results" class="p-5" *ngIf="items?.length === 0"></div>
-  <div class="pb-5" *ngIf="items?.length > 0">
-    <ul class="timeline mb-0 py-5">
-      <li class="timeline-item status-done" *ngFor="let item of items">
-        <div class="timeline-date">
-          <span>{{ item.date }}</span>
-          <br />
-          <span>{{ item.time }}</span>
-        </div>
-        <div
-          class="timeline-content mt-1"
-          *ngIf="{supportedActions: getSupportedActions(item, actions)} as vars"
-        >
-          <div class="timeline-header p-0">
-            <span class="timeline-author">{{ item.user }}</span>
+<div id="no-results" class="p-5" *ngIf="items?.length === 0"></div>
+
+<div class="pb-5" *ngIf="items?.length > 0">
+  <ul class="timeline mb-0 py-5">
+    <li class="timeline-item status-done" *ngFor="let item of items">
+      <div class="timeline-date">
+        <span>{{ item.date }}</span>
+
+        <br />
+
+        <span>{{ item.time }}</span>
+      </div>
+
+      <div
+        class="timeline-content mt-1"
+        *ngIf="{supportedActions: getSupportedActions(item, actions)} as vars"
+      >
+        <div class="timeline-header p-0">
+          <span class="timeline-author">{{ item.user }}</span>
+
+          <div class="dropdown actions-dropdown" *ngIf="vars.supportedActions?.length > 0">
+            <a
+              class="dropdown-toggle d-block"
+              id="dropdownMenu"
+              data-toggle="dropdown"
+              aria-haspopup="true"
+              aria-expanded="false"
+            >
+              <i class="action-icon icon mdi mdi-dots-vertical"></i>
+            </a>
 
-            <div class="dropdown actions-dropdown" *ngIf="vars.supportedActions?.length > 0">
+            <div class="dropdown-menu" aria-labelledby="dropdownMenu">
               <a
-                class="dropdown-toggle d-block"
-                id="dropdownMenu"
-                data-toggle="dropdown"
-                aria-haspopup="true"
-                aria-expanded="false"
+                *ngFor="let action of vars.supportedActions"
+                (click)="action.callback(item, $event)"
+                class="dropdown-item p-2"
               >
-                <i class="action-icon icon mdi mdi-dots-vertical"></i>
+                <ng-container *ngIf="action.icon !== null">
+                  <i class="icon mdi" [ngClass]="action.icon"></i>
+                </ng-container>
+
+                {{ action?.label || '-' }}
               </a>
-              <div class="dropdown-menu" aria-labelledby="dropdownMenu">
-                <a
-                  *ngFor="let action of vars.supportedActions"
-                  (click)="action.callback(item, $event)"
-                  class="dropdown-item p-2"
-                >
-                  <ng-container *ngIf="action.icon !== null">
-                    <i class="icon mdi" [ngClass]="action.icon"></i>
-                  </ng-container>
-                  {{ action?.label || '-' }}
-                </a>
-              </div>
-            </div>
-            <br />
-            <p class="timeline-activity">{{ item.activity }}</p>
-            <div class="timeline-summary">
-              <p>{{ item.summaryTranslationKey | translate: item.summaryTranslationParams }}</p>
             </div>
           </div>
+
+          <br />
+
+          <p class="timeline-activity">{{ item.activity }}</p>
+
+          <div class="timeline-summary">
+            <p>
+              {{ item.summaryTranslationKey | translate: item.summaryTranslationParams }}
+            </p>
+          </div>
         </div>
-      </li>
-    </ul>
-  </div>
+      </div>
+    </li>
+  </ul>
 </div>
diff --git a/...omponents/timeline/timeline.component.css → ...mponents/timeline/timeline.component.scss b/...omponents/timeline/timeline.component.css → ...mponents/timeline/timeline.component.scss
@@ -14,12 +14,15 @@
  * limitations under the License.
  */
 
-.timeline-activity {
-  font-size: 100%;
-}
+.timeline {
+  &-activity {
+    font-size: 100%;
+  }
 
-.timeline-summary p {
-  font-size: 0.8rem;
+  &-summary p {
+    font-size: 0.8rem;
+    white-space: pre-line;
+  }
 }
 
 .actions-dropdown {

diff --git a/projects/valtimo/components/src/lib/components/timeline/timeline.component.ts b/projects/valtimo/components/src/lib/components/timeline/timeline.component.ts
@@ -19,7 +19,7 @@ import {TimelineItem} from '../../models';
 @Component({
   selector: 'valtimo-timeline',
   templateUrl: './timeline.component.html',
-  styleUrls: ['./timeline.component.css'],
+  styleUrls: ['./timeline.component.scss'],
 })
 export class TimelineComponent {
   @Input() items: Array<TimelineItem>;

diff --git a/projects/valtimo/config/assets/core/de.json b/projects/valtimo/config/assets/core/de.json
@@ -1861,7 +1861,8 @@
       "properties": "Eigenschaften"
     },
     "noResults": {
-      "description": "Keine Protokolle entsprechen Ihren Suchkriterien",
+      "description": "Es wurden noch keine Zeilen protokolliert",
+      "searchDescription": "Keine Protokolle entsprechen Ihren Suchkriterien",
       "title": "Es gibt keine Protokolle"
     },
     "detailsTitle": "Protokolldetails"

diff --git a/projects/valtimo/config/assets/core/en.json b/projects/valtimo/config/assets/core/en.json
@@ -1866,7 +1866,8 @@
       "properties": "Properties"
     },
     "noResults": {
-      "description": "No logs match your search criteria",
+      "description": "No lines have been logged yet",
+      "searchDescription": "No logs match your search criteria",
       "title": "There are no logs"
     },
     "detailsTitle": "Log details"

diff --git a/projects/valtimo/config/assets/core/nl.json b/projects/valtimo/config/assets/core/nl.json
@@ -1867,7 +1867,8 @@
       "properties": "Eigenschappen"
     },
     "noResults": {
-      "description": "Er zijn geen logregels die overeenkomen met je zoekcriteria",
+      "description": "Er zijn nog geen lijnen geregistreerd",
+      "searchDescription": "Er zijn geen logregels die overeenkomen met je zoekcriteria",
       "title": "Er zijn geen logboeken"
     },
     "detailsTitle": "Loggegevens"

diff --git a/projects/valtimo/config/src/lib/models/config.ts b/projects/valtimo/config/src/lib/models/config.ts
@@ -95,7 +95,6 @@ interface ValtimoConfigFeatureToggles {
   enableUserNameInTopBarToggle?: boolean;
   enableFormViewModel?: boolean;
   enableIntermediateSave?: boolean;
-  enableTaskPanel?: boolean;
   enableFormFlowBreadcrumbs?: boolean;
 }
 

diff --git a/projects/valtimo/dossier/src/lib/components/dossier-detail/tab/notes/notes.component.html b/projects/valtimo/dossier/src/lib/components/dossier-detail/tab/notes/notes.component.html
@@ -42,6 +42,7 @@
       [actions]="actions"
       [items]="timelineItems"
     ></valtimo-timeline>
+
     <valtimo-no-results
       *ngIf="timelineItems.length === 0"
       [description]="'dossier.notes.noResults.description' | translate"

diff --git a/projects/valtimo/logging/src/lib/components/logging-list/logging-list.component.html b/projects/valtimo/logging/src/lib/components/logging-list/logging-list.component.html
@@ -15,19 +15,21 @@
   -->
 
 <valtimo-carbon-list
-  *ngIf="logItems$ | async as logItems"
-  [items]="logItems"
+  *ngIf="{logItems: logItems$ | async, isSearchActive: isSearchActive$ | async} as obs"
+  [items]="obs.logItems"
   [fields]="FIELDS"
   [loading]="loading$ | async"
   [pagination]="pagination$ | async"
   paginationIdentifier="logging"
-  (paginationClicked)="onPaginationClicked($event, logItems)"
+  (paginationClicked)="onPaginationClicked($event, obs.logItems)"
   (paginationSet)="onPaginationSet($event)"
   (rowClicked)="onRowClickedEvent($event)"
 >
   <valtimo-no-results
-    [action]="clearSearchButton"
-    [description]="'logging.noResults.description' | translate"
+    [action]="obs.isSearchActive ? clearSearchButton : null"
+    [description]="
+      'logging.noResults.' + (obs.isSearchActive ? 'searchDescription' : 'description') | translate
+    "
     [title]="'logging.noResults.title' | translate"
   ></valtimo-no-results>
 

diff --git a/projects/valtimo/logging/src/lib/components/logging-list/logging-list.component.ts b/projects/valtimo/logging/src/lib/components/logging-list/logging-list.component.ts
@@ -22,6 +22,7 @@ import {
   CARBON_CONSTANTS,
   CarbonListItem,
   CarbonListModule,
+  CarbonTag,
   ColumnConfig,
   DEFAULT_PAGINATION,
   Pagination,
@@ -111,6 +112,9 @@ export class LoggingListComponent implements OnInit, OnDestroy {
   );
 
   public readonly searchRequest$ = new BehaviorSubject<LoggingEventSearchRequest>({});
+  public readonly isSearchActive$: Observable<boolean> = this.searchRequest$.pipe(
+    map((searchRequest: LoggingEventSearchRequest) => Object.keys(searchRequest).length > 0)
+  );
   public readonly pagination$ = new BehaviorSubject<Pagination>(DEFAULT_PAGINATION);
   public readonly logDetailsOpen$ = new BehaviorSubject<boolean>(false);
   public readonly selectedLogEvent$ = new BehaviorSubject<LoggingEvent | null>(null);
@@ -178,8 +182,10 @@ export class LoggingListComponent implements OnInit, OnDestroy {
     this.pagination$.next({...this.pagination$.getValue(), size, ...(resetPage && {page: 1})});
   }
 
-  public onRowClickedEvent(rowClickEvent: LoggingEvent & {ctrlClick: boolean}): void {
-    const {ctrlClick: _, ...logEvent} = rowClickEvent;
+  public onRowClickedEvent(
+    rowClickEvent: LoggingEvent & {ctrlClick: boolean; tags: CarbonTag[]}
+  ): void {
+    const {ctrlClick: _1, tags: _2, ...logEvent} = rowClickEvent;
     this.logDetailsOpen$.next(true);
     this.selectedLogEvent$.next(logEvent);
   }

diff --git a/...k/src/lib/components/form-display-configuration/form-display-configuration.component.html b/...k/src/lib/components/form-display-configuration/form-display-configuration.component.html
@@ -5,11 +5,10 @@
     formSizeListItems: formSizeListItems$ | async,
     disableFormSizeInput: disableFormSizeInput$ | async,
     isUserTask: isUserTask$ | async,
-    taskPanelEnabled: taskPanelEnabled$ | async,
     saving: saving$ | async,
   } as obs"
 >
-  @if (obs.taskPanelEnabled && obs.isUserTask) {
+  @if (obs.isUserTask) {
     <cds-combo-box
       [placeholder]="'processLinkSteps.displayType.placeholder' | translate"
       [label]="'processLinkSteps.displayType.label' | translate"

diff --git a/...ink/src/lib/components/form-display-configuration/form-display-configuration.component.ts b/...ink/src/lib/components/form-display-configuration/form-display-configuration.component.ts
@@ -21,7 +21,6 @@ export class FormDisplayConfigurationComponent implements OnInit, OnDestroy {
   public readonly formSizeValue$ = new BehaviorSubject<FormSize | null>(null);
   public readonly disableFormSizeInput$ = new BehaviorSubject<boolean>(true);
   public readonly saving$ = this.stateService.saving$;
-  public readonly taskPanelEnabled$ = new BehaviorSubject<boolean>(false);
   public readonly isUserTask$ = new BehaviorSubject<boolean>(false);
 
   private readonly _DISPLAY_TYPE_OPTIONS: FormDisplayType[] = ['modal', 'panel'];
@@ -60,7 +59,6 @@ export class FormDisplayConfigurationComponent implements OnInit, OnDestroy {
     private readonly stateService: ProcessLinkStateService,
     private readonly translateService: TranslateService
   ) {
-    this.taskPanelEnabled$.next(!!this.configService.featureToggles?.enableTaskPanel);
   }
 
   public ngOnInit(): void {
@@ -75,8 +73,8 @@ export class FormDisplayConfigurationComponent implements OnInit, OnDestroy {
           if (selectedProcessLink.formDisplayType) this.disableFormSizeInput$.next(false);
           if (selectedProcessLink.activityType.includes('bpmn:UserTask'))
             this.isUserTask$.next(true);
-          this.formDisplayValue$.next(selectedProcessLink.formDisplayType);
-          this.formSizeValue$.next(selectedProcessLink.formSize);
+          this.formDisplayValue$.next(selectedProcessLink.formDisplayType ?? null);
+          this.formSizeValue$.next(selectedProcessLink.formSize ?? null);
         }
       })
     );

diff --git a/...ts/valtimo/process-link/src/lib/components/select-form-flow/select-form-flow.component.ts b/...ts/valtimo/process-link/src/lib/components/select-form-flow/select-form-flow.component.ts
@@ -13,18 +13,16 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 import {Component, OnDestroy, OnInit} from '@angular/core';
 import {BehaviorSubject, combineLatest, map, Observable, Subscription, switchMap, tap} from 'rxjs';
+import {take} from 'rxjs/operators';
+import {FormDefinitionListItem, FormFlowProcessLinkUpdateRequestDto} from '../../models';
 import {
   FormFlowService,
   ProcessLinkButtonService,
   ProcessLinkService,
   ProcessLinkStateService,
 } from '../../services';
-import {FormDefinitionListItem, FormFlowProcessLinkUpdateRequestDto} from '../../models';
-import {take} from 'rxjs/operators';
-import {ConfigService} from '@valtimo/config';
 
 @Component({
   selector: 'valtimo-select-form-flow',
@@ -60,10 +58,8 @@ export class SelectFormFlowComponent implements OnInit, OnDestroy {
 
   private _subscriptions = new Subscription();
   private isUserTask$ = new BehaviorSubject<boolean>(false);
-  private readonly taskPanelToggle = this.configService.featureToggles?.enableTaskPanel;
 
   constructor(
-    private readonly configService: ConfigService,
     private readonly formFlowService: FormFlowService,
     private readonly stateService: ProcessLinkStateService,
     private readonly processLinkService: ProcessLinkService,
@@ -142,11 +138,10 @@ export class SelectFormFlowComponent implements OnInit, OnDestroy {
         const updateProcessLinkRequest: FormFlowProcessLinkUpdateRequestDto = {
           id: selectedProcessLink.id,
           formFlowDefinitionId: this.selectedFormFlowDefinition.id,
-          ...(this.taskPanelToggle &&
-            isUserTask && {
-              formDisplayType: this.formDisplayValue,
-            }),
-          ...(this.taskPanelToggle && isUserTask && {formSize: this.formSizeValue}),
+          ...(isUserTask && {
+            formDisplayType: this.formDisplayValue,
+          }),
+          ...(isUserTask && {formSize: this.formSizeValue}),
         };
 
         this.processLinkService.updateProcessLink(updateProcessLinkRequest).subscribe(
@@ -175,11 +170,10 @@ export class SelectFormFlowComponent implements OnInit, OnDestroy {
             processDefinitionId: modalParams.processDefinitionId,
             processLinkType: processLinkTypeId,
             activityId: modalParams.element.id,
-            ...(this.taskPanelToggle &&
-              isUserTask && {
-                formDisplayType: this.formDisplayValue,
-              }),
-            ...(this.taskPanelToggle && isUserTask && {formSize: this.formSizeValue}),
+            ...(isUserTask && {
+              formDisplayType: this.formDisplayValue,
+            }),
+            ...(isUserTask && {formSize: this.formSizeValue}),
           })
         )
       )