pass in null for the delete callback when x should not be displayed

src/components/asset-panel/selector.jsx

@@ -23,14 +23,13 @@ const Selector = props => {
                     <SpriteSelectorItem
                         assetId={item.assetId}
                         className={styles.listItem}
-                        costumeCount={items.length}
                         costumeURL={item.url}
                         id={index}
                         key={`asset-${index}`}
                         name={item.name}
                         selected={index === selectedItemIndex}
                         onClick={onItemClick}
-                        onDeleteButtonClick={onDeleteClick}
+                        onDeleteButtonClick={items.length > 1 ? onDeleteClick : null}
                     />
                 ))}
             </Box>

src/components/sprite-selector-item/sprite-selector-item.jsx

@@ -22,7 +22,7 @@ const SpriteSelectorItem = props => (
         }}
         id={`${props.name}-${contextMenuId}`}
     >
-        {(props.selected && props.costumeCount > 1) ? (
+        {(props.selected && props.onDeleteButtonClick) ? (
             <CloseButton
                 className={styles.deleteButton}
                 size={CloseButton.SIZE_SMALL}
@@ -38,34 +38,37 @@ const SpriteSelectorItem = props => (
             />
         ) : null}
         <div className={styles.spriteName}>{props.name}</div>
-        <ContextMenu id={`${props.name}-${contextMenuId++}`}>
-            {props.onDuplicateButtonClick ? (
-                <MenuItem onClick={props.onDuplicateButtonClick}>
-                    <FormattedMessage
-                        defaultMessage="duplicate"
-                        description="Menu item to duplicate in the right click menu"
-                        id="gui.spriteSelectorItem.contextMenuDuplicate"
-                    />
-                </MenuItem>
-            ) : null}
-            <MenuItem onClick={props.onDeleteButtonClick}>
-                <FormattedMessage
-                    defaultMessage="delete"
-                    description="Menu item to delete in the right click menu"
-                    id="gui.spriteSelectorItem.contextMenuDelete"
-                />
-            </MenuItem>
-        </ContextMenu>
+        {props.onDuplicateButtonClick || props.onDeleteButtonClick ? (
+            <ContextMenu id={`${props.name}-${contextMenuId++}`}>
+                {props.onDuplicateButtonClick ? (
+                    <MenuItem onClick={props.onDuplicateButtonClick}>
+                        <FormattedMessage
+                            defaultMessage="duplicate"
+                            description="Menu item to duplicate in the right click menu"
+                            id="gui.spriteSelectorItem.contextMenuDuplicate"
+                        />
+                    </MenuItem>
+                ) : null}
+                {props.onDeleteButtonClick ? (
+                    <MenuItem onClick={props.onDeleteButtonClick}>
+                        <FormattedMessage
+                            defaultMessage="delete"
+                            description="Menu item to delete in the right click menu"
+                            id="gui.spriteSelectorItem.contextMenuDelete"
+                        />
+                    </MenuItem>
+                ) : null }
+            </ContextMenu>
+        ) : null}
     </ContextMenuTrigger>
 );
 
 SpriteSelectorItem.propTypes = {
     className: PropTypes.string,
-    costumeCount: PropTypes.number,
     costumeURL: PropTypes.string,
     name: PropTypes.string.isRequired,
     onClick: PropTypes.func,
-    onDeleteButtonClick: PropTypes.func.isRequired,
+    onDeleteButtonClick: PropTypes.func,
     onDuplicateButtonClick: PropTypes.func,
     selected: PropTypes.bool.isRequired
 };

src/containers/sprite-selector-item.jsx

@@ -20,6 +20,7 @@ class SpriteSelectorItem extends React.Component {
         this.props.onClick(this.props.id);
     }
     handleDelete () {
+        // @todo add i18n here
         // eslint-disable-next-line no-alert
         if (window.confirm('Are you sure you want to delete this sprite?')) {
             this.props.onDeleteButtonClick(this.props.id);
@@ -43,7 +44,7 @@ class SpriteSelectorItem extends React.Component {
         return (
             <SpriteSelectorItemComponent
                 onClick={this.handleClick}
-                onDeleteButtonClick={this.handleDelete}
+                onDeleteButtonClick={onDeleteButtonClick ? this.handleDelete : null}
                 onDuplicateButtonClick={onDuplicateButtonClick ? this.handleDuplicate : null}
                 {...props}
             />
@@ -53,12 +54,11 @@ class SpriteSelectorItem extends React.Component {
 
 SpriteSelectorItem.propTypes = {
     assetId: PropTypes.string,
-    costumeCount: PropTypes.number,
     costumeURL: PropTypes.string,
     id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     name: PropTypes.string,
     onClick: PropTypes.func,
-    onDeleteButtonClick: PropTypes.func.isRequired,
+    onDeleteButtonClick: PropTypes.func,
     onDuplicateButtonClick: PropTypes.func,
     selected: PropTypes.bool
 };