model-navigator-standalone
Version:
Standalone MDF graph model visualizer
81 lines • 3.17 kB
JavaScript
import "core-js/modules/web.dom-collections.iterator.js";
/* eslint-disable react/forbid-prop-types */
/* eslint-disable no-empty */
/* eslint-disable no-unused-vars */
import React, { useState } from 'react';
import withStyles from '@mui/styles/withStyles';
import { useDispatch, useSelector } from 'react-redux';
import { getMatchesSummaryForProperties } from '../../Utils/highlightHelper';
import DialogBox from './component/DialogComponent';
import { controlVocabConfig as config } from '../../../Config/nav.config';
import TableHead from './component/TableHead';
import TableRows from './component/TableRows';
import { selectIsSearchMode } from '../../../../../features/search/searchSlice';
const DataDictionaryPropertyTable = _ref => {
let {
classes,
title,
node,
onlyShowMatchedProperties,
hasBorder,
needHighlightSearchResult,
matchedResult,
hideIsRequired
} = _ref;
const [display, setDisplay] = useState(false);
const [items, setItems] = useState([]);
const [matchedItem, setMatchedItems] = useState([]);
const [property, setProperty] = useState('');
const isSearchMode = useSelector(selectIsSearchMode);
const properties = node.props(); // eslint-disable-line no-undef
const openBoxHandler = function openBoxHandler(values) {
let typeMatchList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
let prop_handle = arguments.length > 2 ? arguments[2] : undefined;
setDisplay(true);
setItems(values);
setMatchedItems(typeMatchList);
setProperty(prop_handle);
};
const closeHandler = () => {
setDisplay(false);
setItems([]);
};
const needHighlight = onlyShowMatchedProperties || needHighlightSearchResult;
const matchedPropertiesSummary = needHighlightSearchResult ? matchedResult ? getMatchesSummaryForProperties(properties, matchedResult.matches) : [] : [];
return /*#__PURE__*/React.createElement("div", {
className: classes.propertyTable
}, /*#__PURE__*/React.createElement("table", {
className: classes.propertyTable
}, /*#__PURE__*/React.createElement(TableHead, {
hideIsRequired: hideIsRequired
}), /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement(TableRows, {
onlyShowMatchedProperties: onlyShowMatchedProperties,
matchedPropertiesSummary: matchedPropertiesSummary,
properties: properties,
needHighlightSearchResult: needHighlight,
hideIsRequired: hideIsRequired,
openBoxHandler: openBoxHandler,
isSearchMode: isSearchMode,
title: title
}))), items.length > 0 && /*#__PURE__*/React.createElement(DialogBox, {
display: display,
closeHandler: closeHandler,
items: items,
maxNoOfItems: config.maxNoOfItems,
maxNoOfItemDlgBox: config.maxNoOfItemDlgBox,
isSearchMode: isSearchMode,
typeMatchList: matchedItem,
node: title,
property: property
}));
};
const styles = () => ({
propertyTable: {
backgroundColor: "var(--g3-color__white)",
borderCollapse: 'collapse',
width: '100%',
borderBottom: '1px solid #adbec4'
},
withOutBorder: {}
});
export default withStyles(styles)(DataDictionaryPropertyTable);