From ca25cc347f799a5e066426e6fabdac926698abc5 Mon Sep 17 00:00:00 2001
From: mbritense <79840403+mbritense@users.noreply.github.com>
Date: Thu, 16 May 2024 14:23:05 +0200
Subject: [PATCH] fix custom title case detail header (#998)

---
 .../dossier-detail/dossier-detail.component.html  | 15 ++++++++-------
 .../dossier-detail/dossier-detail.component.scss  |  2 +-
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.html b/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.html
index af6e663e7..1dc4e6f0b 100644
--- a/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.html
+++ b/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.html
@@ -61,7 +61,7 @@
   let-document="document"
   let-canAssign="canAssign"
 >
-  <div class="row" *ngIf="customDossierHeaderItems.length > 0; else defaultTitle">
+  <div class="row" *ngIf="(customDossierHeaderItems || []).length > 0">
     <span
       *ngFor="let item of customDossierHeaderItems"
       [ngClass]="{
@@ -71,7 +71,7 @@
         h4: item.textSize === 'sm',
         h5: item.textSize === 'xs'
       }"
-      class="mb-0 mt-0 pb-2 align-self-end col-xl-{{ item.columnSize }} col-lg-{{
+      class="mb-0 mt-0 align-self-end col-xl-{{ item.columnSize }} col-lg-{{
         item.columnSize * 2
       }} {{ item.customClass }}"
     >
@@ -91,10 +91,6 @@
   ></ng-container>
 </ng-template>
 
-<ng-template #defaultTitle>
-  <div class="row ml-0 mr-0">{{ documentDefinitionNameTitle?.trim() }}</div>
-</ng-template>
-
 <ng-template
   #caseDetailAssignee
   let-canHaveAssignee="canHaveAssignee"
@@ -150,7 +146,10 @@
         caseStatus: caseStatus$ | async
       } as obs"
     >
-      <div class="dossier-status-assign" [ngClass]="{'--compact': compactMode$ | async}">
+      <div
+        class="dossier-status-assign-custom-title"
+        [ngClass]="{'--compact': compactMode$ | async}"
+      >
         @if (obs.caseStatus) {
           <cds-tag size="sm" [type]="obs.caseStatus.tagType">{{ obs.caseStatus.title }}</cds-tag>
         }
@@ -167,6 +166,8 @@
             "
           ></ng-container>
         </div>
+
+        <ng-container *ngTemplateOutlet="caseDetailHeader"></ng-container>
       </div>
 
       <div class="buttons-container">
diff --git a/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.scss b/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.scss
index 22d9cfd76..2a90375f0 100644
--- a/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.scss
+++ b/projects/valtimo/dossier/src/lib/components/dossier-detail/dossier-detail.component.scss
@@ -81,7 +81,7 @@
   }
 }
 
-.dossier-status-assign {
+.dossier-status-assign-custom-title {
   display: flex;
   gap: 16px;
   align-items: flex-end;