Cacher is the code snippet organizer for pro developers

import React, { Component } from "react";
import Box from "./Box";

export default class BoxContainer extends Component {
  static defaultProps = {
    numBoxes: 18,
    allColors: [
      "purple",
      "magenta",
      "violet",
      "pink",
      "orange",
      "blue",
      "yellow"
    ]
  };
  render() {
    const boxes = Array.from({ length: this.props.numBoxes }).map(() => (
      <Box color={this.props.allColors} />
    ));
    return <div className="BoxContainer">{boxes}</div>;
  }
}