feat(catalog): catalogo modern Hippiehotel in albero separato (catalog-modern)

2026-06-20 15:36:18 +00:00 · 2026-06-07 23:00:06 +02:00
parent 3cd6c5a518
commit 21d3a62b7a
73 changed files with 6931 additions and 4 deletions
@@ -0,0 +1,54 @@
+import { FC } from 'react';
+import { LocalizeText, SanitizeHtml } from '../../../../../api';
+import { Column, Grid, Text } from '../../../../../common';
+import { useCatalogData } from '../../../../../hooks';
+import { CatalogBadgeSelectorWidgetView } from '../widgets/CatalogBadgeSelectorWidgetView';
+import { CatalogFirstProductSelectorWidgetView } from '../widgets/CatalogFirstProductSelectorWidgetView';
+import { CatalogItemGridWidgetView } from '../widgets/CatalogItemGridWidgetView';
+import { CatalogLimitedItemWidgetView } from '../widgets/CatalogLimitedItemWidgetView';
+import { CatalogPurchaseWidgetView } from '../widgets/CatalogPurchaseWidgetView';
+import { CatalogTotalPriceWidget } from '../widgets/CatalogTotalPriceWidget';
+import { CatalogViewProductWidgetView } from '../widgets/CatalogViewProductWidgetView';
+import { CatalogLayoutProps } from './CatalogLayout.types';
+
+export const CatalogLayoutBadgeDisplayView: FC<CatalogLayoutProps> = props =>
+{
+    const { page = null } = props;
+    const { currentOffer = null } = useCatalogData();
+
+    return (
+        <>
+            <CatalogFirstProductSelectorWidgetView />
+            <Grid>
+                <Column overflow="hidden" size={ 7 }>
+                    <CatalogItemGridWidgetView shrink />
+                    <Column gap={ 1 } overflow="hidden">
+                        <Text shrink truncate fontWeight="bold">{ LocalizeText('catalog_selectbadge') }</Text>
+                        <CatalogBadgeSelectorWidgetView />
+                    </Column>
+                </Column>
+                <Column center={ !currentOffer } overflow="hidden" size={ 5 }>
+                    { !currentOffer &&
+                        <>
+                            { !!page.localization.getImage(1) && <img alt="" src={ page.localization.getImage(1) } /> }
+                            <Text center dangerouslySetInnerHTML={ { __html: SanitizeHtml(page.localization.getText(0)) } } />
+                        </> }
+                    { currentOffer &&
+                        <>
+                            <div className="relative overflow-hidden">
+                                <CatalogViewProductWidgetView />
+                            </div>
+                            <Column className="grow!" gap={ 1 }>
+                                <CatalogLimitedItemWidgetView />
+                                <Text truncate className="grow!">{ currentOffer.localizationName }</Text>
+                                <div className="flex justify-end">
+                                    <CatalogTotalPriceWidget alignItems="end" />
+                                </div>
+                                <CatalogPurchaseWidgetView />
+                            </Column>
+                        </> }
+                </Column>
+            </Grid>
+        </>
+    );
+};