From e940d5dbf57c7ac09343720ee48910675ece150d Mon Sep 17 00:00:00 2001
From: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date: Tue, 7 Dec 2021 09:14:04 +0100
Subject: [PATCH] =?UTF-8?q?feature(Slutredovisning):=20=C3=96vrig=20inform?=
 =?UTF-8?q?ation=20=C3=A4r=20nu=20frivillig=20(TV-952)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Merge in TEA/mina-sidor-fa-web from feature/TV-952-Gör-att-Fritextrutan-Lägg-till-övrig-information-i-Slutredovisning-valfri-att-fylla-i- to develop

Squashed commit of the following:

commit 03fd1ec373be4f18f8f64bccd75eac72acda2f85
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Mon Dec 6 10:51:46 2021 +0100

    Övrig information är nu frivilligt. Gjorde också Rapport-korvarna lika långa. Ser bättre ut
---
 .../deltagare-tab-reports.component.html      | 44 ++++++++++++++++---
 .../deltagare-tab-reports.component.scss      |  1 +
 .../slutredovisning-form-step2.component.html |  2 +-
 .../slutredovisning-form-step2.component.ts   |  2 +-
 .../link-button/link-button.component.scss    |  4 ++
 5 files changed, 44 insertions(+), 9 deletions(-)

diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html
index c16d653..3a19aa4 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html
@@ -4,37 +4,67 @@
 
   <ul class="deltagare-tab-reports__button-list">
     <li>
-      <ui-link-button uiRouterLink="gemensam-planering" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="gemensam-planering"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Gemensam planering
       </ui-link-button>
     </li>
     <li>
-      <ui-link-button uiRouterLink="franvarorapport" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="franvarorapport"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Avvikelserapport (frånvaro)
       </ui-link-button>
     </li>
     <li>
-      <ui-link-button uiRouterLink="avvikelserapport" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="avvikelserapport"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Avvikelserapport (avvikelse)
       </ui-link-button>
     </li>
     <li *ngIf="periodiskRedovisningButtonVisible">
-      <ui-link-button uiRouterLink="periodisk-redovisning" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="periodisk-redovisning"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Periodisk redovisning
       </ui-link-button>
     </li>
     <li *ngIf="signalButtonVisible">
-      <ui-link-button uiRouterLink="signal" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button [uiFullWidth]="true" uiRouterLink="signal" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
         Signal om arbete eller studier
       </ui-link-button>
     </li>
     <li *ngIf="informativRapportButtonVisible">
-      <ui-link-button uiRouterLink="informativ-rapport" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="informativ-rapport"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Informativ rapport
       </ui-link-button>
     </li>
     <li *ngIf="slutredovisningButtonVisible">
-      <ui-link-button uiRouterLink="slutredovisning" [uiType]="UiLinkButtonType.ROUNDED_PRIMARY" uiSize="s">
+      <ui-link-button
+        [uiFullWidth]="true"
+        uiRouterLink="slutredovisning"
+        [uiType]="UiLinkButtonType.ROUNDED_PRIMARY"
+        uiSize="s"
+      >
         Slutredovisning
       </ui-link-button>
     </li>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.scss
index a13f4b3..ad4b96b 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.scss
@@ -13,6 +13,7 @@
 
   &__button-list {
     @include msfa__reset-list;
+    width: 17rem;
     display: flex;
     flex-direction: column;
     gap: var(--digi--layout--gutter);
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.html
index afd2ea6..660b5d4 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.html
@@ -34,7 +34,7 @@
       [uiAnnounceIfOptional]="true"
       [uiMaxLength]="2000"
       [uiMinLength]="1"
-      [uiRequired]="true"
+      [uiRequired]="false"
       [uiValidationMessage]="ovrigtFormControl.errors?.required"
       [uiInvalid]="ovrigtFormControl?.touched  && !!ovrigtFormControl?.errors?.required"
     ></ui-textarea>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.ts
index cde59ec..616c531 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/slutredovisning-form/slutredovisning-form-step2/slutredovisning-form-step2.component.ts
@@ -56,7 +56,7 @@ export class SlutredovisningFormStep2Component implements OnInit {
     if (!this.framstegFormControl) {
       this.formGroup.addControl(this.framstegFormName, new FormControl(null, RequiredValidator()));
       this.formGroup.addControl(this.nastaStegFormName, new FormControl(null, RequiredValidator()));
-      this.formGroup.addControl(this.ovrigtFormName, new FormControl(null, RequiredValidator()));
+      this.formGroup.addControl(this.ovrigtFormName, new FormControl(''));
     }
   }
 
diff --git a/libs/ui/src/link-button/link-button.component.scss b/libs/ui/src/link-button/link-button.component.scss
index 553a80d..9122f10 100644
--- a/libs/ui/src/link-button/link-button.component.scss
+++ b/libs/ui/src/link-button/link-button.component.scss
@@ -5,6 +5,8 @@
 
   &--full-width {
     width: 100%;
+    display: flex;
+    justify-content: space-between;
   }
 }
 .ui-link-rounded-button {
@@ -12,5 +14,7 @@
 
   &--full-width {
     width: 100%;
+    display: flex;
+    justify-content: space-between;
   }
 }