Add image/text to catalog pages

src/views/catalog/reducers/CatalogReducer.tsx

@@ -65,6 +65,7 @@ export const CatalogReducer: Reducer<ICatalogState, ICatalogAction> = (state, ac
         }
         case CatalogActions.SET_CATALOG_PAGE_PARSER: {
             const pageParser = action.payload.pageParser;
+            const activeOffer = null;
 
             const searchResult = state.searchResult;
 
@@ -73,7 +74,7 @@ export const CatalogReducer: Reducer<ICatalogState, ICatalogAction> = (state, ac
                 searchResult.furniture = null;
             }
 
-            return { ...state, pageParser, searchResult };
+            return { ...state, pageParser, activeOffer, searchResult };
         }
         case CatalogActions.SET_CATALOG_ACTIVE_OFFER: {
             const activeOffer = (action.payload.activeOffer || state.activeOffer || null);

src/views/catalog/utils/CatalogUtilities.ts

@@ -1,5 +1,6 @@
-import { CatalogPageOfferData, ICatalogPageData, IFurnitureData } from 'nitro-renderer';
+import { CatalogPageOfferData, ICatalogPageData, ICatalogPageParser, IFurnitureData } from 'nitro-renderer';
 import { GetProductDataForLocalization } from '../../../api/nitro/session/GetProductDataForLocalization';
+import { GetConfiguration } from '../../../utils/GetConfiguration';
 
 export interface ICatalogOffers
 {
@@ -65,3 +66,25 @@ export function SetOffersToNodes(offers: ICatalogOffers, pageData: ICatalogPageD
         for(const child of pageData.children) SetOffersToNodes(offers, child);
     }
 }
+
+export function GetCatalogPageImage(page: ICatalogPageParser, index: number = 0): string
+{
+    const imageName = page.localization.images && page.localization.images[index];
+
+    if(!imageName || !imageName.length) return null;
+
+    let assetUrl = GetConfiguration<string>('catalog.asset.image.url');
+
+    assetUrl = assetUrl.replace('%name%', imageName);
+
+    return assetUrl;
+}
+
+export function GetCatalogPageText(page: ICatalogPageParser, index: number = 0): string
+{
+    let message = (page.localization.texts[index] || '');
+
+    if(message && message.length) message = message.replace(/\r\n|\r|\n/g, '<br />');
+
+    return (message || '');
+}

src/views/catalog/views/page/layout/default/CatalogLayoutDefaultView.tsx

@@ -2,7 +2,7 @@ import { FC } from 'react';
 import { LimitedEditionCompletePlateView } from '../../../../../limited-edition/complete-plate/LimitedEditionCompletePlateView';
 import { RoomPreviewerView } from '../../../../../room-previewer/RoomPreviewerView';
 import { useCatalogContext } from '../../../../context/CatalogContext';
-import { GetOfferName } from '../../../../utils/CatalogUtilities';
+import { GetCatalogPageImage, GetCatalogPageText, GetOfferName } from '../../../../utils/CatalogUtilities';
 import { CatalogPageOffersView } from '../../offers/CatalogPageOffersView';
 import { CatalogPurchaseView } from '../../purchase/CatalogPurchaseView';
 import { CatalogLayoutDefaultViewProps } from './CatalogLayoutDefaultView.types';
@@ -20,6 +20,13 @@ export const CatalogLayoutDefaultView: FC<CatalogLayoutDefaultViewProps> = props
             <div className="col-7">
                 <CatalogPageOffersView offers={ pageParser.offers } />
             </div>
+            { !product &&
+                <div className="position-relative d-flex flex-column col justify-content-center align-items-center">
+                    <div className="d-block mb-2">
+                        <img alt="" src={ GetCatalogPageImage(pageParser, 1) } />
+                    </div>
+                    <span className="text-center text-black lh-sm">{ GetCatalogPageText(pageParser, 0) }</span>
+                </div> }
             { product &&
                 <div className="position-relative d-flex flex-column col">
                     <RoomPreviewerView roomPreviewer={ roomPreviewer } height={ 140 } />

src/views/catalog/views/page/offers/CatalogPageOffersView.tsx

@@ -1,6 +1,5 @@
 import { FC, useEffect } from 'react';
 import { useCatalogContext } from '../../../context/CatalogContext';
-import { CatalogActions } from '../../../reducers/CatalogReducer';
 import { CatalogPageOfferView } from '../offer/CatalogPageOfferView';
 import { CatalogPageOffersViewProps } from './CatalogPageOffersView.types';
 
@@ -14,12 +13,12 @@ export const CatalogPageOffersView: FC<CatalogPageOffersViewProps> = props =>
     {
         if(!offers || !offers.length) return;
 
-        dispatchCatalogState({
+        // dispatchCatalogState({
-            type: CatalogActions.SET_CATALOG_ACTIVE_OFFER,
+        //     type: CatalogActions.SET_CATALOG_ACTIVE_OFFER,
-            payload: {
+        //     payload: {
-                activeOffer: offers[0]
+        //         activeOffer: offers[0]
-            }
+        //     }
-        })
+        // });
     }, [ offers, dispatchCatalogState ]);
 
     return (