1 import React from 'react'
2 import ListStack from './ListStack'
3 import ListEntryCard from './ListEntryCard'
4 import ExplorerColumn from './ExplorerColumn'
5 import changeCase from 'change-case'
7 export default class extends React.Component {
11 const { model, path, isLast, selected, openElement, editElement, columnCloser } = this.props;
12 const element = model.getElement(path);
13 const name = element.name;
14 const shortName = changeCase.titleCase(name).split(' ').pop();
15 const buttonName = `Add ${shortName}`;
16 console.debug(`ListColumn: ${name}`);
17 const list = element.value ? Array.isArray(element.value) ? element.value : [element.value] : null;
18 const cards = list && list.map((item, index) => {
19 const itemInfo = element.getItemInfo(item);
20 const isSelected = selected ? selected.every((p,i) => p === itemInfo.path[i]) : false;
21 const itemPath = path.slice();
22 itemPath.push(itemInfo.path);
23 const props = { model, 'path': itemPath, 'openElement': openElement.bind(this, itemPath) };
25 <ListEntryCard key={itemInfo.path}
29 isSelected={isSelected}
30 openElement={openElement.bind(this, itemPath)}
31 deleteElement={(path) => editElement(path, 'delete')} />
35 <ExplorerColumn title={name || path} isLast={isLast} actions={['create']} handler={() => editElement(path, 'create')} columnCloser={columnCloser} >
36 <div className='list-column' >
42 console.error("component render", e);