calendar.js

const ProfileImage = () => (
  <li>
    <a>
      <span class="image"><img src="images/img.jpg" alt="Profile Image" /></span>
      <span>
        <span>John Smith</span>
        <span class="time">3 mins ago</span>
      </span>
      <span class="message">
        Film festivals used to be do-or-die moments for movie makers. They were where...
      </span>
    </a>
  </li>
)

const SeeAllAlert = () => (
  <li>
    <div class="text-center">
      <a>
        <strong>See All Alerts</strong>
        <i class="fa fa-angle-right"></i>
      </a>
    </div>
  </li>
)

const PresentationDiv = () => (
  <li role="presentation" class="dropdown">
    <a href="javascript:;" class="dropdown-toggle info-number" data-toggle="dropdown" aria-expanded="false">
      <i class="fa fa-envelope-o"></i>
      <span class="badge bg-green">6</span>
    </a>
    <ul id="menu1" class="dropdown-menu list-unstyled msg_list" role="menu">
      {ProfileImage*4}
      {SeeAllAlert}
    </ul>
  </li>
)