@finos/legend-application-marketplace/lib/pages/Lakehouse/MarketplaceLakehouseHome.js

Legend Marketplace application core

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * Copyright (c) 2020-present, Goldman Sachs
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { observer } from 'mobx-react-lite';
import { useEffect, useMemo, useState } from 'react';
import { Box, Container } from '@mui/material';
import { LegendMarketplaceSearchBar } from '../../components/SearchBar/LegendMarketplaceSearchBar.js';
import { LegendMarketplacePage } from '../LegendMarketplacePage.js';
import { useAuth } from 'react-oidc-context';
import { CloseIcon, CubesLoadingIndicator, CubesLoadingIndicatorIcon, } from '@finos/legend-art';
import { generateFieldSearchResultsRoute, generateLakehouseSearchResultsRoute, } from '../../__lib__/LegendMarketplaceNavigation.js';
import { assertErrorThrown, isNonEmptyString, LogEvent, } from '@finos/legend-shared';
import { useLegendMarketplaceBaseStore } from '../../application/providers/LegendMarketplaceFrameworkProvider.js';
import { DemoModal } from './DemoModal.js';
import { Swiper, SwiperSlide } from 'swiper/react';
import { Navigation, Pagination, Autoplay } from 'swiper/modules';
import { LEGEND_MARKETPLACE_PAGE, LegendMarketplaceTelemetryHelper, } from '../../__lib__/LegendMarketplaceTelemetryHelper.js';
import { LEGEND_MARKETPLACE_APP_EVENT } from '../../__lib__/LegendMarketplaceAppEvent.js';
import { generatePathForDataProductSearchResult } from '../../utils/SearchUtils.js';
import { logClickingDataProductCard } from '../../utils/LogUtils.js';
import { LakehouseProductCard } from '../../components/LakehouseProductCard/LakehouseProductCard.js';
const TRENDING_DATA_PRODUCTS = 4;
export const MarketplaceLakehouseHome = observer(() => {
    const legendMarketplaceBaseStore = useLegendMarketplaceBaseStore();
    const applicationStore = legendMarketplaceBaseStore.applicationStore;
    const auth = useAuth();
    const isDarkMode = !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled;
    const [highlightedDataProducts, setHighlightedDataProducts] = useState({});
    const [loading, setLoading] = useState(false);
    const [dismissedBannerIds, setDismissedBannerIds] = useState(new Set());
    const bannerConfigs = useMemo(() => applicationStore.pluginManager
        .getApplicationPlugins()
        .flatMap((plugin) => plugin.getExtraHomePageBannerConfigs?.(legendMarketplaceBaseStore) ?? []), [applicationStore.pluginManager, legendMarketplaceBaseStore]);
    const visibleBanners = bannerConfigs.filter((banner) => !dismissedBannerIds.has(banner.id));
    const dismissBanner = (bannerId) => {
        setDismissedBannerIds((prev) => new Set([...prev, bannerId]));
        LegendMarketplaceTelemetryHelper.logEvent_DismissHomePageBanner(applicationStore.telemetryService, bannerId);
    };
    useEffect(() => {
        LegendMarketplaceTelemetryHelper.clearSearchSessionId();
    }, []);
    const sectionNames = useMemo(() => Object.keys(highlightedDataProducts), [highlightedDataProducts]);
    useEffect(() => {
        const loadDataProducts = async () => {
            setLoading(true);
            try {
                let trendingDataProducts;
                try {
                    trendingDataProducts =
                        await legendMarketplaceBaseStore.fetchTrendingDataProducts(auth.user?.access_token);
                }
                catch (error) {
                    assertErrorThrown(error);
                    applicationStore.logService.warn(LogEvent.create(LEGEND_MARKETPLACE_APP_EVENT.FETCH_DATA_PRODUCT_FAILURE), 'Failed to fetch trending data products', error);
                }
                const [configDataProducts, ...extraDataProductSections] = await Promise.all([
                    legendMarketplaceBaseStore.initHighlightedDataProducts(auth.user?.access_token),
                    ...applicationStore.pluginManager
                        .getApplicationPlugins()
                        .flatMap(async (plugin) => (await plugin.getExtraHomePageDataProducts?.(legendMarketplaceBaseStore, auth.user?.access_token)) ?? {}),
                ]);
                const result = {
                    ...configDataProducts,
                };
                if (trendingDataProducts &&
                    Object.values(trendingDataProducts).flat().length >=
                        TRENDING_DATA_PRODUCTS) {
                    Object.assign(result, trendingDataProducts);
                }
                for (const pluginSections of extraDataProductSections) {
                    for (const [sectionTitle, dataProductStates] of Object.entries(pluginSections)) {
                        if (dataProductStates.length > 0) {
                            dataProductStates.forEach((dataProductState) => dataProductState.init(auth.user?.access_token));
                            result[sectionTitle] = [
                                ...(result[sectionTitle] ?? []),
                                ...dataProductStates,
                            ];
                        }
                    }
                }
                setHighlightedDataProducts(result);
            }
            catch (error) {
                assertErrorThrown(error);
                if (applicationStore.config.options.showDevFeatures) {
                    applicationStore.notificationService.notifyError(error, `Can't load highlighted data products: ${error.name}\n${error.message}\n${error.cause}\n${error.stack}`);
                }
                else {
                    applicationStore.notificationService.notifyError(`Can't load highlighted data products: ${error.message}`);
                }
            }
            finally {
                setLoading(false);
            }
        };
        if (sectionNames.length === 0) {
            // eslint-disable-next-line no-void
            void loadDataProducts();
        }
    }, [
        auth.user?.access_token,
        sectionNames.length,
        applicationStore.notificationService,
        applicationStore.pluginManager,
        applicationStore.logService,
        legendMarketplaceBaseStore,
        applicationStore.config.options.showDevFeatures,
    ]);
    const handleCardClick = (productCardState) => {
        const path = generatePathForDataProductSearchResult(productCardState.searchResult);
        if (path) {
            applicationStore.navigationService.navigator.visitAddress(applicationStore.navigationService.navigator.generateAddress(path));
        }
        logClickingDataProductCard(productCardState, applicationStore, LEGEND_MARKETPLACE_PAGE.HOME_PAGE);
    };
    const [activeIndex, setActiveIndex] = useState(0);
    const handleSearch = (_query, _useProducerSearch, _useFieldSearch) => {
        if (isNonEmptyString(_query)) {
            applicationStore.navigationService.navigator.goToLocation(_useFieldSearch
                ? generateFieldSearchResultsRoute(_query)
                : generateLakehouseSearchResultsRoute(_query, _useProducerSearch));
            LegendMarketplaceTelemetryHelper.logEvent_SearchQuery(applicationStore.telemetryService, _query, _useProducerSearch, LEGEND_MARKETPLACE_PAGE.HOME_PAGE, _useFieldSearch);
        }
    };
    return (_jsxs(LegendMarketplacePage, { className: "marketplace-lakehouse-home", children: [visibleBanners.map((banner) => (_jsxs("div", { className: "marketplace-lakehouse-home__banner", children: [_jsx("div", { className: "marketplace-lakehouse-home__banner__content", children: banner.content }), _jsx("button", { className: "marketplace-lakehouse-home__banner__close", onClick: () => dismissBanner(banner.id), title: "Dismiss banner", children: _jsx(CloseIcon, {}) })] }, banner.id))), _jsxs(Container, { className: "marketplace-lakehouse-home__search-container", children: [_jsx(Box, { className: "marketplace-lakehouse-home__search-container__logo", children: _jsx("img", { src: isDarkMode
                                ? '/assets/legendmarketplacehomelogodark.png'
                                : '/assets/legendmarketplacehomelogolight.png', alt: "Legend Marketplace Logo" }) }), _jsx(LegendMarketplaceSearchBar, { showSettings: true, onSearch: handleSearch, placeholder: "Which data can I help you find?", className: "marketplace-lakehouse-home__search-bar" })] }), _jsx(Container, { maxWidth: "xxxl", className: "marketplace-lakehouse-home__data-product-cards__container", children: loading ? (_jsx(CubesLoadingIndicator, { isLoading: loading, className: "marketplace-lakehouse-home__data-product-cards__loading", children: _jsx(CubesLoadingIndicatorIcon, {}) })) : (_jsxs("div", { className: "marketplace-lakehouse-home__carousel-header", children: [_jsx("div", { className: "marketplace-lakehouse-home__carousel-title", children: sectionNames[activeIndex] ?? '' }), _jsx(Swiper, { modules: [Navigation, Pagination, Autoplay], slidesPerView: 1, navigation: false, pagination: { clickable: true }, autoplay: {
                                delay: 5000,
                                disableOnInteraction: false,
                                pauseOnMouseEnter: true,
                            }, onSlideChange: (swiper) => setActiveIndex(swiper.activeIndex), className: "marketplace-lakehouse-home__carousel", children: sectionNames.map((sectionName) => (_jsx(SwiperSlide, { children: _jsx("div", { className: "marketplace-lakehouse-home__carousel-slide", children: highlightedDataProducts[sectionName]?.map((productCardState) => (_jsx(LakehouseProductCard, { productCardState: productCardState, moreInfoPreview: "large", hideInfoPopover: true, hideTags: true, onClick: () => handleCardClick(productCardState) }, `${sectionName}-${productCardState.guid}`))) }) }, sectionName))) })] })) }), _jsx(DemoModal, {})] }));
});
//# sourceMappingURL=MarketplaceLakehouseHome.js.map