38 lines
1.1 KiB
JavaScript
38 lines
1.1 KiB
JavaScript
// eslint-disable-next-line
|
|
const preact = require('preact');
|
|
|
|
function ItemList({ items, setActiveItem }) {
|
|
if (!items) return <div>...</div>;
|
|
const itemPanels = items.map(item => (
|
|
|
|
<div key={item.id} className="tile is-parent is-vertical box">
|
|
<div className="tile is-vertical is-child">
|
|
<div className="columns" >
|
|
<div className="column is-8">
|
|
<p className="title">{item.action}</p>
|
|
<p className="subtitle">∞</p>
|
|
</div>
|
|
<div className="column">
|
|
<figure className="image">
|
|
<svg width="40" height="40" data-jdenticon-value={item.action} />
|
|
</figure>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button
|
|
className="button is-dark"
|
|
type="submit"
|
|
onClick={() => setActiveItem(item.id)}>
|
|
Use
|
|
</button>
|
|
</div>
|
|
));
|
|
return (
|
|
<div>
|
|
{itemPanels}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
module.exports = ItemList;
|