\n {isFirstImage && productBadgeComponent}\n
\n
\n );\n });\n };\n\n private renderImage = () => {\n const {\n alternateImage,\n largeImages,\n productBriefImageCarouselSettings,\n isMobileImageCarouselEnabled,\n isDesktopImageCarouselEnabled\n } = this.productBriefViewController.data;\n const { onImageLoaded, imageOverride, isFeatured, productImages } = this.props;\n const enableLazyLoadGridImages =\n productImages && productImages.product_grid && productImages.product_grid.lazyload;\n const customSizeImages = this.productBriefViewController.getCustomSizeImages(\n ComponentTypes.PRODUCT_GRID\n );\n const productImageDesktop = customSizeImages.desktop.defaultImage;\n const productImageMobile = customSizeImages.mobile.defaultImage;\n\n const productImgCommonProps: IImgCommonProps = {\n onClick: this.navToProd,\n onImageLoaded: onImageLoaded,\n lazyLoad: enableLazyLoadGridImages\n };\n\n const sliderImages = this.getSliderImages(largeImages, productImgCommonProps);\n\n const imageCarouselSettings = {\n ...DEFAULT_IMAGE_CAROUSEL_SETTINGS,\n ...productBriefImageCarouselSettings\n };\n\n const { product } = this.props;\n const { selectedSku } = this.productBriefViewController.data;\n\n const gridImageCarouselSettings =\n this.props.config && this.props.config.imageCarouselSettings;\n const hideImageBadge =\n gridImageCarouselSettings && gridImageCarouselSettings.productGrid.hideImageBadge;\n\n const productBadgeComponent = !hideImageBadge && (\n