ActionListWidget

Source

index.js
import React from 'react';
import PropTypes from 'prop-types';

import style from 'PVWStyle/ReactWidgets/ActionListWidget.mcss';

export default class ActionListWidget extends React.Component {
constructor(props) {
super(props);

// Bind callback
this.processClick = this.processClick.bind(this);
}

processClick(event) {
let target = event.target;
while (!target.dataset.name) {
target = target.parentNode;
}

if (this.props.onClick) {
this.props.onClick(
target.dataset.name,
target.dataset.action,
target.dataset.user
);
}
}

render() {
const list = [];

this.props.list.forEach((item, idx) => {
list.push(
<li
className={item.active ? style.activeItem : style.item}
key={idx}
title={item.name}
data-name={item.name}
data-action={item.action || 'default'}
data-user={item.data || ''}
onClick={this.processClick}
>
<i className={item.icon} />
{item.name}
</li>
);
});

return <ul className={style.list}>{list}</ul>;
}
}

ActionListWidget.propTypes = {
list: PropTypes.array.isRequired,
onClick: PropTypes.func,
};

ActionListWidget.defaultProps = {
onClick: undefined,
};