Fix xcust by adding all the cards to the dom from the server (#15332)

uses css to show and hide those additional cards. This means that the links are in the DOM from the server. As these links are always there they are now all updated by the function that adds the additional parameters in the client.

Author: oliverabrahams

dotcom-rendering/src/components/StackedProducts.importable.tsx

@@ -76,22 +76,23 @@ export const StackedProducts = ({
 					`,
 				]}
 			>
-				{products.map(
-					(product: ProductBlockElement, index) =>
-						(index < cardsShownByDefault || isExpanded) && (
-							<div
-								key={index}
-								data-component={`at-a-glance-stacked-card-${
-									index + 1
-								}`}
-							>
-								<HorizontalSummaryProductCard
-									product={product}
-									format={format}
-								/>
-							</div>
-						),
-				)}
+				{products.map((product: ProductBlockElement, index) => (
+					<div
+						key={index}
+						data-component={`at-a-glance-stacked-card-${index + 1}`}
+						style={{
+							display:
+								!isExpanded && index >= cardsShownByDefault
+									? 'none'
+									: 'block',
+						}}
+					>
+						<HorizontalSummaryProductCard
+							product={product}
+							format={format}
+						/>
+					</div>
+				))}
 			</div>
 
 			{products.length > cardsShownByDefault && (