Feature frontend-collective#860 Add icon in node renderer

Implementation of the feature frontend-collective#860

Author: BBE78

src/node-renderer-default.css

@@ -65,6 +65,7 @@
 }
 
 .rst__rowContents,
+.rst__rowIcon,
 .rst__rowLabel,
 .rst__rowToolbar,
 .rst__moveHandle,
@@ -85,7 +86,7 @@
   flex: 1 0 auto;
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  /*justify-content: space-between;*/
   background-color: white;
 }
 
@@ -104,6 +105,13 @@
   border-left: solid #bbb 1px;
 }
 
+.rst__rowIcon {
+  padding-right: 8px;
+}
+.rst__rowIcon img {
+  vertical-align: middle;
+}
+
 .rst__rowLabel {
   flex: 0 1 auto;
   padding-right: 20px;

src/node-renderer-default.js

@@ -17,6 +17,7 @@ class NodeRendererDefault extends Component {
       node,
       title,
       subtitle,
+      icon,
       draggedNode,
       path,
       treeIndex,
@@ -34,6 +35,7 @@ class NodeRendererDefault extends Component {
     } = this.props;
     const nodeTitle = title || node.title;
     const nodeSubtitle = subtitle || node.subtitle;
+    const nodeIcon = icon || node.icon;
     const rowDirectionClass = rowDirection === 'rtl' ? 'rst__rtl' : null;
 
     let handle;
@@ -132,6 +134,12 @@ class NodeRendererDefault extends Component {
                   rowDirectionClass
                 )}
               >
+                {nodeIcon && (
+                  <div className={classnames('rst__rowIcon', rowDirectionClass)}>
+                    <img alt="icon here" src={nodeIcon} />
+                  </div>
+                )}
+                
                 <div className={classnames('rst__rowLabel', rowDirectionClass)}>
                   <span
                     className={classnames(
@@ -193,13 +201,15 @@ NodeRendererDefault.defaultProps = {
   canDrop: false,
   title: null,
   subtitle: null,
+  icon: null,
   rowDirection: 'ltr',
 };
 
 NodeRendererDefault.propTypes = {
   node: PropTypes.shape({}).isRequired,
   title: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
   subtitle: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
+  icon: PropTypes.string,
   path: PropTypes.arrayOf(
     PropTypes.oneOfType([PropTypes.string, PropTypes.number])
   ).isRequired,