@finos/legend-application-marketplace
Version:
Legend Marketplace application core
31 lines • 3.69 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
* Copyright (c) 2026-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 { useCallback, useState } from 'react';
import { Box, Button, Dialog, DialogActions, DialogContent, DialogTitle, List, ListItemButton, ListItemText, Radio, Typography, } from '@mui/material';
import { observer } from 'mobx-react-lite';
import { formatItemPrice, OrderProfileLabel } from './orderProfileUtils.js';
export const OrderProfileMultiselectModal = observer((props) => {
const { profile, open, onClose, onConfirm } = props;
const terminalItems = profile.items.filter((item) => item.isTerminal && !item.isOwned);
const [selectedId, setSelectedId] = useState(null);
const handleConfirm = useCallback(() => {
const selectedItem = terminalItems.find((item) => item.id === selectedId);
onConfirm(selectedItem ? [selectedItem] : []);
}, [terminalItems, selectedId, onConfirm]);
return (_jsxs(Dialog, { open: open, onClose: onClose, maxWidth: "md", fullWidth: true, className: "order-profile-multiselect-modal", "aria-labelledby": "order-profile-multiselect-title", children: [_jsx(DialogTitle, { id: "order-profile-multiselect-title", children: OrderProfileLabel.SELECT_TERMINAL_TITLE }), _jsxs(DialogContent, { dividers: true, children: [_jsxs(Typography, { variant: "body2", className: "order-profile-multiselect-modal__description", children: ["Choose one terminal to include from", ' ', _jsx("strong", { children: profile.productName }), ".", ' ', OrderProfileLabel.SELECT_TERMINAL_DESCRIPTION] }), _jsx(List, { dense: false, children: terminalItems.map((item) => (_jsxs(ListItemButton, { onClick: () => setSelectedId(item.id), selected: selectedId === item.id, className: `order-profile-multiselect-modal__list-item ${selectedId === item.id ? 'order-profile-multiselect-modal__list-item--selected' : ''}`, children: [_jsx(Radio, { checked: selectedId === item.id, onChange: () => setSelectedId(item.id), size: "small", className: "order-profile-multiselect-modal__radio", inputProps: { 'aria-labelledby': `terminal-item-${item.id}` } }), _jsx(ListItemText, { id: `terminal-item-${item.id}`, disableTypography: true, primary: _jsxs(Box, { className: "order-profile-multiselect-modal__item-primary", children: [_jsx(Typography, { variant: "body1", className: "order-profile-multiselect-modal__item-name", children: item.productName }), _jsx(Typography, { variant: "body2", className: "order-profile-multiselect-modal__item-price", children: formatItemPrice(item.price) })] }), secondary: item.model !== null && item.model !== undefined ? (_jsxs(Typography, { variant: "caption", className: "order-profile-multiselect-modal__item-model", children: [OrderProfileLabel.MODEL_PREFIX, item.model] })) : undefined })] }, item.id))) })] }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: onClose, variant: "outlined", children: OrderProfileLabel.CANCEL }), _jsx(Button, { onClick: handleConfirm, variant: "contained", disabled: selectedId === null, children: OrderProfileLabel.ADD_TO_CART })] })] }));
});
//# sourceMappingURL=OrderProfileMultiselectModal.js.map