50 lines
1.2 KiB
JavaScript
50 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
|
|
import ListItemButton from '@mui/material/ListItemButton';
|
|
import ListItemText from '@mui/material/ListItemText';
|
|
|
|
const SuggestionItem = (props) => {
|
|
const { index, style, data, onSuggestionClick } = props;
|
|
const suboption = data[index];
|
|
return (
|
|
<ListItemButton
|
|
sx={{ pl: 4 }}
|
|
divider
|
|
onClick={() => onSuggestionClick(suboption)}
|
|
data-test="power-input-suggestion-item"
|
|
key={index}
|
|
style={style}
|
|
>
|
|
<ListItemText
|
|
primary={suboption.label}
|
|
primaryTypographyProps={{
|
|
variant: 'subtitle1',
|
|
title: 'Property name',
|
|
sx: { fontWeight: 700 },
|
|
}}
|
|
secondary={suboption.sampleValue || ''}
|
|
secondaryTypographyProps={{
|
|
variant: 'subtitle2',
|
|
title: 'Sample value',
|
|
noWrap: true,
|
|
}}
|
|
/>
|
|
</ListItemButton>
|
|
);
|
|
};
|
|
|
|
SuggestionItem.propTypes = {
|
|
index: PropTypes.number.isRequired,
|
|
style: PropTypes.object,
|
|
data: PropTypes.arrayOf(
|
|
PropTypes.shape({
|
|
label: PropTypes.string,
|
|
sampleValue: PropTypes.string,
|
|
}),
|
|
).isRequired,
|
|
onSuggestionClick: PropTypes.func.isRequired,
|
|
};
|
|
|
|
export default SuggestionItem;
|