Merge pull request #1872 from cboard-org/fix-wrong-render-of-images-on-change-fixed-board

Add unique key property to tile buttons for rendering consistency

Author: RodriSanchez1

src/components/Board/Board.component.js

@@ -261,6 +261,7 @@ export class Board extends Component {
         onFocus={() => {
           this.handleTileFocus(tile.id);
         }}
+        key={tile.id}
       >
         <Symbol
           image={tile.image}

src/components/Board/Tile/Tile.component.js

@@ -25,7 +25,12 @@ const propTypes = {
   /**
    * Type of tile
    */
-  variant: PropTypes.oneOf(['button', 'folder', 'board'])
+  variant: PropTypes.oneOf(['button', 'folder', 'board']),
+  /**
+   * Unique key for the tile, used for React reconciliation
+   * and should be unique among siblings.
+   */
+  key: PropTypes.string
 };
 
 const defaultProps = {};