From f54701c5f77174f729e5b9bb5422ad4943dfce38 Mon Sep 17 00:00:00 2001
From: DD Liu <liudi@media.mit.edu>
Date: Thu, 25 May 2017 14:55:40 -0400
Subject: [PATCH] add the right sprite to the stage
---
src/components/library/library.jsx | 18 ++++++++++--------
1 file changed, 10 insertions(+), 8 deletions(-)
diff --git a/src/components/library/library.jsx b/src/components/library/library.jsx
index 4d737d390..27cfe4116 100644
--- a/src/components/library/library.jsx
+++ b/src/components/library/library.jsx
@@ -23,10 +23,10 @@ class LibraryComponent extends React.Component {
if (this.state.selectedItem === id) {
// Double select: select as the library's value.
this.props.onRequestClose();
- this.props.onItemSelected(this.props.data[id]);
+ this.props.onItemSelected(this.getFilteredData()[id]);
} else {
if (this.props.onItemChosen) {
- this.props.onItemChosen(this.props.data[id]);
+ this.props.onItemChosen(this.getFilteredData()[id]);
}
}
this.setState({selectedItem: id});
@@ -36,6 +36,10 @@ class LibraryComponent extends React.Component {
filterQuery: event.target.value
});
}
+ getFilteredData () {
+ return this.props.data.filter(dataItem =>
+ dataItem.name.toLowerCase().indexOf(this.state.filterQuery.toLowerCase()) !== -1);
+ }
render () {
if (!this.props.visible) return null;
return (
@@ -47,19 +51,17 @@ class LibraryComponent extends React.Component {
onRequestClose={this.props.onRequestClose}
>
<div className={styles.libraryScrollGrid}>
- {this.props.data.filter(dataItem =>
- dataItem.name.toLowerCase().indexOf(this.state.filterQuery.toLowerCase()) !== -1
- ).map((dataItem, itemId) => {
+ {this.getFilteredData().map((dataItem, index) => {
const scratchURL = dataItem.md5 ?
`https://cdn.assets.scratch.mit.edu/internalapi/asset/${dataItem.md5}/get/` :
dataItem.rawURL;
return (
<LibraryItem
iconURL={scratchURL}
- id={itemId}
- key={`item_${itemId}`}
+ id={index}
+ key={`item_${index}`}
name={dataItem.name}
- selected={this.state.selectedItem === itemId}
+ selected={this.state.selectedItem === index}
onSelect={this.handleSelect}
/>
);
--
GitLab