From db40fa9b48ae202fb6a0a00efedcdfa6a2a98b0b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pawe=C5=82=20Kwit?=
 <30594884+Pawulon-0@users.noreply.github.com>
Date: Wed, 27 Mar 2024 12:58:51 +0100
Subject: [PATCH] fix: Make missing actions column header visible in saved cart
 list (#18426)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Paweł Kwit <pawel.kwit@agcocorp.com>
Co-authored-by: Piotr Bartkowiak <pbartkowiak@divante.pl>
Co-authored-by: PioBar <72926984+Pio-Bar@users.noreply.github.com>
---
 .../list/saved-cart-list.component.html           |  4 +++-
 .../components/list/saved-cart-list.component.ts  |  8 +++++---
 .../cart/saved-cart/styles/_saved-cart-list.scss  | 15 +++++++++++++++
 projects/storefrontapp/src/app/app.module.ts      |  1 +
 4 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.html b/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.html
index ccc2dd5e4c4..de7cae77a94 100644
--- a/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.html
+++ b/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.html
@@ -111,7 +111,9 @@ <h2>
               >
             </td>
             <td class="cx-saved-cart-list-make-cart-active">
-              <div class="cx-table-label-mobile cx-saved-cart-list-label"></div>
+              <div class="cx-table-label-mobile cx-saved-cart-list-label">
+                {{ 'savedCartList.actions' | cxTranslate }}
+              </div>
               <button
                 #element
                 class="btn btn-tertiary cx-saved-cart-make-active"
diff --git a/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.ts b/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.ts
index 9e77c0e629c..e81d51b1913 100644
--- a/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.ts
+++ b/feature-libs/cart/saved-cart/components/list/saved-cart-list.component.ts
@@ -18,8 +18,8 @@ import {
   SavedCartFacade,
   SavedCartFormType,
 } from '@spartacus/cart/saved-cart/root';
-import { RoutingService } from '@spartacus/core';
-import { LaunchDialogService, LAUNCH_CALLER } from '@spartacus/storefront';
+import { RoutingService, useFeatureStyles } from '@spartacus/core';
+import { LAUNCH_CALLER, LaunchDialogService } from '@spartacus/storefront';
 import { Observable, Subscription } from 'rxjs';
 import { map, take } from 'rxjs/operators';
 
@@ -52,7 +52,9 @@ export class SavedCartListComponent implements OnInit, OnDestroy {
     protected savedCartService: SavedCartFacade,
     protected vcr: ViewContainerRef,
     protected launchDialogService: LaunchDialogService
-  ) {}
+  ) {
+    useFeatureStyles('a11ySavedCartsZoom');
+  }
 
   ngOnInit(): void {
     this.isLoading$ = this.savedCartService.getSavedCartListProcessLoading();
diff --git a/feature-libs/cart/saved-cart/styles/_saved-cart-list.scss b/feature-libs/cart/saved-cart/styles/_saved-cart-list.scss
index 2a66fa7c6a8..e1dddeeacda 100644
--- a/feature-libs/cart/saved-cart/styles/_saved-cart-list.scss
+++ b/feature-libs/cart/saved-cart/styles/_saved-cart-list.scss
@@ -129,6 +129,11 @@ cx-saved-cart-list {
     .cx-saved-cart-list-label {
       color: var(--cx-color-secondary);
 
+      // TODO: (CXSPA-5955) Remove feature flag next major
+      @include forFeature('a11ySavedCartsZoom') {
+        text-align: start;
+      }
+
       @include media-breakpoint-down(md) {
         font-size: var(--cx-font-size, 0.875rem);
         font-weight: var(--cx-font-weight-bold);
@@ -157,4 +162,14 @@ cx-saved-cart-list {
       min-height: auto;
     }
   }
+
+  // TODO: (CXSPA-5955) Remove feature flag next major
+  @include forFeature('a11ySavedCartsZoom') {
+    @include media-breakpoint-down(md) {
+      .cx-saved-cart-make-active {
+        min-height: unset;
+        padding: 0;
+      }
+    }
+  }
 }
diff --git a/projects/storefrontapp/src/app/app.module.ts b/projects/storefrontapp/src/app/app.module.ts
index ca6354bbc0e..e24749968a4 100644
--- a/projects/storefrontapp/src/app/app.module.ts
+++ b/projects/storefrontapp/src/app/app.module.ts
@@ -97,6 +97,7 @@ if (!environment.production) {
         a11yNavigationUiKeyboardControls: true,
         a11yOrderConfirmationHeadingOrder: true,
         a11yStarRating: true,
+        a11ySavedCartsZoom: true,
         a11ySortingOptionsTruncation: true,
         a11yExpandedFocusIndicator: true,
         a11yCheckoutDeliveryFocus: true,