diff --git a/src/components/library-item/library-item.jsx b/src/components/library-item/library-item.jsx index 9d14c562f..bd7047fcb 100644 --- a/src/components/library-item/library-item.jsx +++ b/src/components/library-item/library-item.jsx @@ -36,10 +36,12 @@ class LibraryItemComponent extends React.PureComponent { /> ) : null} - + {this.props.iconSource ? ( + + ) : null} {this.props.insetIconURL ? (
@@ -147,7 +149,7 @@ LibraryItemComponent.propTypes = { extensionId: PropTypes.string, featured: PropTypes.bool, hidden: PropTypes.bool, - iconSource: ScratchImage.propTypes.imageSource, + iconSource: ScratchImage.ImageSourcePropType, insetIconURL: PropTypes.string, internetConnectionRequired: PropTypes.bool, name: PropTypes.oneOfType([ diff --git a/src/components/library/library.jsx b/src/components/library/library.jsx index 22bf74d5a..79602ff7d 100644 --- a/src/components/library/library.jsx +++ b/src/components/library/library.jsx @@ -54,7 +54,7 @@ const getAssetTypeForFileExtension = function (fileExtension) { * @returns {object} - an `imageSource` ready to be passed to a `ScratchImage`. */ const getItemImageSource = function (item) { - if (item.hasOwnProperty('rawURL')) { + if (item.rawURL) { return { uri: item.rawURL }; @@ -62,11 +62,13 @@ const getItemImageSource = function (item) { // TODO: adjust libraries to be more storage-friendly; don't use split() here. const md5 = item.md5 || item.baseLayerMD5; - const [assetId, fileExtension] = md5.split('.'); - return { - assetId: assetId, - assetType: getAssetTypeForFileExtension(fileExtension) - }; + if (md5) { + const [assetId, fileExtension] = md5.split('.'); + return { + assetId: assetId, + assetType: getAssetTypeForFileExtension(fileExtension) + }; + } }; class LibraryComponent extends React.Component { diff --git a/src/components/scratch-image/scratch-image.jsx b/src/components/scratch-image/scratch-image.jsx index bd3a6c8eb..32ba2ace8 100644 --- a/src/components/scratch-image/scratch-image.jsx +++ b/src/components/scratch-image/scratch-image.jsx @@ -68,18 +68,20 @@ class ScratchImage extends React.PureComponent { * @returns {object} - the new state values, if any. */ _loadImageSource (imageSource) { - if (imageSource.uri) { - ScratchImage.pendingImages.delete(this); - return { - imageURI: imageSource.uri, - lastRequestedAsset: null - }; - } - if (this.state.lastRequestedAsset !== imageSource.assetId) { - ScratchImage.pendingImages.add(this); - return { - lastRequestedAsset: imageSource.assetId - }; + if (imageSource) { + if (imageSource.uri) { + ScratchImage.pendingImages.delete(this); + return { + imageURI: imageSource.uri, + lastRequestedAsset: null + }; + } + if (this.state.lastRequestedAsset !== imageSource.assetId) { + ScratchImage.pendingImages.add(this); + return { + lastRequestedAsset: imageSource.assetId + }; + } } // Nothing to do - don't change any state. return {}; @@ -116,16 +118,18 @@ class ScratchImage extends React.PureComponent { } } +ScratchImage.ImageSourcePropType = PropTypes.oneOfType([ + PropTypes.shape({ + assetId: PropTypes.string.isRequired, + assetType: PropTypes.oneOf(Object.values(storage.AssetType)).isRequired + }), + PropTypes.shape({ + uri: PropTypes.string.isRequired + }) +]); + ScratchImage.propTypes = { - imageSource: PropTypes.oneOfType([ - PropTypes.shape({ - assetId: PropTypes.string.isRequired, - assetType: PropTypes.oneOf(Object.values(storage.AssetType)).isRequired - }), - PropTypes.shape({ - uri: PropTypes.string.isRequired - }) - ]).isRequired + imageSource: ScratchImage.ImageSourcePropType.isRequired }; export default ScratchImage;