AACBoard SelectedItemsDisplay.jsx

100% Statements 3/3

100% Branches 4/4

100% Functions 3/3

100% Lines 3/3

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21  
 
 
4x
 
9x
 
 
 
1x
 
 
 
 
 
 
 
 
 
 
  import "./SelectedItemsDisplay.css";
 
export default function SelectedItemsDisplay({selectedItems, onDelete, onClear, onPlayAll}) {
    return (<div className="aacboard-selected-items">
            {selectedItems.slice(0, 15).map((item, index) => (
            <span key={index} className="aacboard-selected-item">
                {item.image && (<img src={item.image} alt={item.name} />)}
                <button
                    className="selected-item-delete"
                    onClick={() => onDelete(index)}
                > ×
                </button>
            </span>
        ))}
        {selectedItems.length !== 0 && <div>
            <button className="selected-items-actions" onClick={onClear}>Clear All</button>
            <button className="selected-items-actions" onClick={onPlayAll}>Play All</button>
        </div>}
    </div>);
}