@finos/legend-application-marketplace
Version:
Legend Marketplace application core
121 lines • 11.4 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } 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 { EXTERNAL_APPLICATION_NAVIGATION__generateStudioProjectViewUrl } from '@finos/legend-application';
import { OpenIcon, clsx, InfoCircleIcon, MarkdownTextViewer, } from '@finos/legend-art';
import { Popover, Box, TableContainer, Table, TableBody, TableRow, TableCell, IconButton, } from '@mui/material';
import { observer } from 'mobx-react-lite';
import { useState } from 'react';
import {} from '../../stores/LegendMarketplaceBaseStore.js';
import { LegendMarketplaceCard } from '../MarketplaceCard/LegendMarketplaceCard.js';
import { LakehouseDataProductSearchResultDetails, LakehouseSDLCDataProductSearchResultOrigin, LegacyDataProductSearchResultDetails, } from '@finos/legend-server-marketplace';
import { LakehouseProductTags, DATA_PRODUCT_MARKDOWN_COMPONENTS, } from './LakehouseProductCardSharedUtils.js';
const MAX_DESCRIPTION_LENGTH = 250;
export const LakehouseDataProductCardInfoPopover = observer((props) => {
const { dataProductCardState, popoverAnchorEl, setPopoverAnchorEl, applicationStore, } = props;
const popoverOpen = Boolean(popoverAnchorEl);
const popoverId = popoverOpen ? 'popover' : undefined;
const dataProductDetails = dataProductCardState.searchResult.dataProductDetails;
const dataProductId = dataProductDetails instanceof LakehouseDataProductSearchResultDetails
? dataProductDetails.dataProductId
: undefined;
const deploymentId = dataProductDetails instanceof LakehouseDataProductSearchResultDetails
? dataProductDetails.deploymentId
: undefined;
const producerEnvironmentName = dataProductDetails instanceof LakehouseDataProductSearchResultDetails
? dataProductDetails.producerEnvironmentName
: undefined;
const producerEnvironmentType = dataProductDetails instanceof LakehouseDataProductSearchResultDetails
? dataProductDetails.producerEnvironmentType
: undefined;
const groupId = dataProductDetails instanceof LakehouseDataProductSearchResultDetails &&
dataProductDetails.origin instanceof
LakehouseSDLCDataProductSearchResultOrigin
? dataProductDetails.origin.groupId
: dataProductDetails instanceof LegacyDataProductSearchResultDetails
? dataProductDetails.groupId
: undefined;
const artifactId = dataProductDetails instanceof LakehouseDataProductSearchResultDetails &&
dataProductDetails.origin instanceof
LakehouseSDLCDataProductSearchResultOrigin
? dataProductDetails.origin.artifactId
: dataProductDetails instanceof LegacyDataProductSearchResultDetails
? dataProductDetails.artifactId
: undefined;
const versionId = dataProductDetails instanceof LakehouseDataProductSearchResultDetails &&
dataProductDetails.origin instanceof
LakehouseSDLCDataProductSearchResultOrigin
? dataProductDetails.origin.versionId
: dataProductDetails instanceof LegacyDataProductSearchResultDetails
? dataProductDetails.versionId
: undefined;
const path = dataProductDetails instanceof LakehouseDataProductSearchResultDetails &&
dataProductDetails.origin instanceof
LakehouseSDLCDataProductSearchResultOrigin
? dataProductDetails.origin.path
: dataProductDetails instanceof LegacyDataProductSearchResultDetails
? dataProductDetails.path
: undefined;
return (_jsxs(Popover, { id: popoverId, open: popoverOpen, anchorEl: popoverAnchorEl, anchorOrigin: {
vertical: 'top',
horizontal: 'center',
}, transformOrigin: {
vertical: 'bottom',
horizontal: 'center',
}, onClose: () => setPopoverAnchorEl(null), slotProps: {
paper: {
className: 'marketplace-lakehouse-data-product-card__popover',
onClick: (event) => [
event.preventDefault(),
event.stopPropagation(),
],
},
backdrop: {
onClick: (event) => {
event.preventDefault();
event.stopPropagation();
},
},
}, children: [_jsx(Box, { className: "marketplace-lakehouse-data-product-card__popover__name", children: dataProductCardState.title }), _jsxs(Box, { className: "marketplace-lakehouse-data-product-card__popover__content", children: [_jsxs(Box, { className: "marketplace-lakehouse-data-product-card__popover__section", children: [_jsx(Box, { className: "marketplace-lakehouse-data-product-card__popover__section-header", children: "Description" }), _jsx(Box, { className: "marketplace-lakehouse-data-product-card__popover__section-content", children: _jsx(MarkdownTextViewer, { className: "marketplace-lakehouse-data-product-card__popover__section-content__markdown", value: {
value: dataProductCardState.description,
}, components: DATA_PRODUCT_MARKDOWN_COMPONENTS }) })] }), dataProductId !== undefined ||
deploymentId !== undefined ||
producerEnvironmentName !== undefined ||
producerEnvironmentType !== undefined ? (_jsxs(Box, { className: "marketplace-lakehouse-data-product-card__popover__section", children: [_jsx(Box, { className: "marketplace-lakehouse-data-product-card__popover__section-header", children: "Deployment Details" }), _jsx(TableContainer, { className: "marketplace-lakehouse-data-product-card__popover__table", children: _jsx(Table, { children: _jsxs(TableBody, { children: [_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Data Product ID" }) }), _jsx(TableCell, { children: dataProductId ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Deployment ID" }) }), _jsx(TableCell, { children: deploymentId ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Producer Environment Name" }) }), _jsx(TableCell, { children: producerEnvironmentName ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Producer Environment Type" }) }), _jsx(TableCell, { children: producerEnvironmentType ?? 'Unknown' })] })] }) }) })] })) : null, groupId !== undefined ||
artifactId !== undefined ||
versionId !== undefined ||
path !== undefined ? (_jsxs(Box, { className: "marketplace-lakehouse-data-product-card__popover__section", children: [_jsxs(Box, { className: "marketplace-lakehouse-data-product-card__popover__section-header", children: ["Data Product Project", groupId && artifactId && versionId && path ? (_jsx(IconButton, { className: "marketplace-lakehouse-data-product-card__popover__project-link", onClick: () => applicationStore.navigationService.navigator.visitAddress(EXTERNAL_APPLICATION_NAVIGATION__generateStudioProjectViewUrl(applicationStore.config.studioApplicationUrl, groupId, artifactId, versionId, path)), children: _jsx(OpenIcon, {}) })) : null] }), _jsx(TableContainer, { className: "marketplace-lakehouse-data-product-card__popover__table", children: _jsx(Table, { children: _jsxs(TableBody, { children: [_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Group" }) }), _jsx(TableCell, { children: groupId ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Artifact" }) }), _jsx(TableCell, { children: artifactId ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Version" }) }), _jsx(TableCell, { children: versionId ?? 'Unknown' })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx("b", { children: "Path" }) }), _jsx(TableCell, { children: path ?? 'Unknown' })] })] }) }) })] })) : null] })] }));
});
export const LakehouseProductCard = observer((props) => {
const { productCardState, onClick, moreInfoPreview, hideInfoPopover, hideTags, } = props;
const [popoverAnchorEl, setPopoverAnchorEl] = useState(null);
const truncatedDescription = productCardState.description &&
productCardState.description.length > MAX_DESCRIPTION_LENGTH
? `${productCardState.description.substring(0, MAX_DESCRIPTION_LENGTH)}...`
: productCardState.description;
const content = (_jsx(_Fragment, { children: _jsx(Box, { className: "marketplace-lakehouse-data-product-card__container", children: _jsxs(Box, { className: "marketplace-lakehouse-data-product-card__content", children: [!hideTags && (_jsx(Box, { className: "marketplace-lakehouse-data-product-card__tags", children: _jsx(LakehouseProductTags, { productCardState: productCardState }) })), moreInfoPreview === undefined && (_jsx(Box, { className: "marketplace-lakehouse-data-product-card__name", children: productCardState.title }))] }) }) }));
const moreInfoContent = (_jsxs(_Fragment, { children: [_jsx(Box, { className: "marketplace-lakehouse-data-product-card__name", children: productCardState.title }), _jsx(Box, { className: "marketplace-lakehouse-data-product-card__description", children: _jsx(MarkdownTextViewer, { className: "marketplace-lakehouse-data-product-card__description__markdown", value: {
value: truncatedDescription,
}, components: DATA_PRODUCT_MARKDOWN_COMPONENTS }) }), !hideInfoPopover && (_jsxs(_Fragment, { children: [_jsx(IconButton, { onClick: (event) => {
event.preventDefault();
event.stopPropagation();
setPopoverAnchorEl(event.currentTarget);
}, className: clsx('marketplace-lakehouse-data-product-card__more-info-btn', {
'marketplace-lakehouse-data-product-card__more-info-btn--selected': Boolean(popoverAnchorEl),
}), title: "More Info", children: _jsx(InfoCircleIcon, {}) }), _jsx(LakehouseDataProductCardInfoPopover, { dataProductCardState: productCardState, popoverAnchorEl: popoverAnchorEl, setPopoverAnchorEl: setPopoverAnchorEl, applicationStore: productCardState.marketplaceBaseStore.applicationStore })] }))] }));
return (_jsx(LegendMarketplaceCard, { size: "large", content: content, onClick: () => onClick(productCardState), className: "marketplace-lakehouse-data-product-card", moreInfo: moreInfoContent, moreInfoPreview: moreInfoPreview, cardMedia: productCardState.icon ?? productCardState.displayImage, loadingMedia: productCardState.initState.isInProgress }));
});
//# sourceMappingURL=LakehouseProductCard.js.map