williaster commented on a change in pull request #5186: Implement a React-based
table editor
URL:
https://github.com/apache/incubator-superset/pull/5186#discussion_r208044668
##########
File path: superset/assets/src/CRUD/CollectionTable.jsx
##########
@@ -0,0 +1,220 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import shortid from 'shortid';
+
+import Button from '../components/Button';
+import Fieldset from './Fieldset';
+import { recurseReactClone } from './utils';
+import './styles.css';
+
+const propTypes = {
+ collection: PropTypes.array,
+ itemGenerator: PropTypes.func,
+ columnLabels: PropTypes.object,
+ tableColumns: PropTypes.array,
+ columns: PropTypes.array,
+ onChange: PropTypes.func,
+ itemRenderers: PropTypes.object,
+ allowDeletes: PropTypes.bool,
+ expandFieldset: PropTypes.node,
+ emptyMessage: PropTypes.node,
+ extraButtons: PropTypes.node,
+ allowAddItem: PropTypes.bool,
+};
+const defaultProps = {
+ onChange: () => {},
+ itemRenderers: {},
+ columnLabels: {},
+ allowDeletes: false,
+ emptyMessage: 'No entries',
+ allowAddItem: false,
+ itemGenerator: () => ({}),
+};
+const Frame = props => (
+ <div className="frame">
+ {props.children}
+ </div>);
+Frame.propTypes = { children: PropTypes.node };
+
+function createKeyedCollection(arr) {
+ const newArr = arr.map(o => ({
+ ...o,
+ id: o.id || shortid.generate(),
+ }));
+ const map = {};
+ newArr.forEach((o) => {
+ map[o.id] = o;
+ });
+ return map;
+}
+
+export default class CRUDCollection extends React.PureComponent {
+ constructor(props) {
+ super(props);
+ this.state = {
+ expandedColumns: {},
+ collection: createKeyedCollection(props.collection),
+ };
+ this.renderItem = this.renderItem.bind(this);
+ this.onAddItem = this.onAddItem.bind(this);
+ this.renderExpandableSection = this.renderExpandableSection.bind(this);
+ this.getLabel = this.getLabel.bind(this);
+ this.onFieldsetChange = this.onFieldsetChange.bind(this);
+ this.renderTableBody = this.renderTableBody.bind(this);
+ this.changeCollection = this.changeCollection.bind(this);
+ }
+ componentWillReceiveProps(nextProps) {
+ if (nextProps.collection !== this.props.collection) {
+ this.setState({
+ collection: createKeyedCollection(nextProps.collection),
+ });
+ }
+ }
+ onCellChange(id, col, val) {
+ this.changeCollection({
+ ...this.state.collection,
+ [id]: {
+ ...this.state.collection[id],
+ [col]: val,
+ },
+ });
+
+ }
+ onAddItem() {
+ let newItem = this.props.itemGenerator();
+ if (!newItem.id) {
+ newItem = { ...newItem, id: shortid.generate() };
+ }
+ this.changeCollection({
+ ...this.state.collection,
+ [newItem.id]: newItem,
+ });
+ }
+ onFieldsetChange(item) {
+ this.changeCollection({
+ ...this.state.collection,
+ [item.id]: item,
+ });
+ }
+ getLabel(col) {
+ const { columnLabels } = this.props;
+ let label = columnLabels[col] ? columnLabels[col] : col;
+ if (label.startsWith('__')) {
Review comment:
can you add a comment as to what this check is doing? (is it just the
`__expanded` item?) or create a helper with a name to help do the same?
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
