Proyectos de Subversion LeadersLinked - Antes de SPA

import React from "react";

export const EmojiFood = (props) => {
  // props destructuring
  const { onClickEmoji, hidden } = props;
  return (
    <div
      className="smiley-panel-body"
      style={{ display: hidden ? "block" : "none" }}
    >
      <div className="emoji-food">
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f347"
          data-shortname=":grapes:"
          data-index="1"
          title="grapes"
          data-eid="215"
        >
          <span className="emojione emojione-1f347"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f348"
          data-shortname=":melon:"
          data-index="2"
          title="melon"
          data-eid="216"
        >
          <span className="emojione emojione-1f348"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f349"
          data-shortname=":watermelon:"
          data-index="3"
          title="watermelon"
          data-eid="217"
        >
          <span className="emojione emojione-1f349"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34a"
          data-shortname=":tangerine:"
          data-index="4"
          title="tangerine"
          data-eid="218"
        >
          <span className="emojione emojione-1f34a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34b"
          data-shortname=":lemon:"
          data-index="5"
          title="lemon"
          data-eid="801"
        >
          <span className="emojione emojione-1f34b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34c"
          data-shortname=":banana:"
          data-index="6"
          title="banana"
          data-eid="219"
        >
          <span className="emojione emojione-1f34c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34d"
          data-shortname=":pineapple:"
          data-index="7"
          title="pineapple"
          data-eid="220"
        >
          <span className="emojione emojione-1f34d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34e"
          data-shortname=":apple:"
          data-index="8"
          title="red apple"
          data-eid="221"
        >
          <span className="emojione emojione-1f34e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f34f"
          data-shortname=":green_apple:"
          data-index="9"
          title="green apple"
          data-eid="222"
        >
          <span className="emojione emojione-1f34f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f350"
          data-shortname=":pear:"
          data-index="10"
          title="pear"
          data-eid="802"
        >
          <span className="emojione emojione-1f350"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f351"
          data-shortname=":peach:"
          data-index="11"
          title="peach"
          data-eid="223"
        >
          <span className="emojione emojione-1f351"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f352"
          data-shortname=":cherries:"
          data-index="12"
          title="cherries"
          data-eid="224"
        >
          <span className="emojione emojione-1f352"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f353"
          data-shortname=":strawberry:"
          data-index="13"
          title="strawberry"
          data-eid="225"
        >
          <span className="emojione emojione-1f353"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f95d"
          data-shortname=":kiwi:"
          data-index="14"
          title="kiwifruit"
          data-eid="2323"
        >
          <span className="emojione emojione-1f95d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f345"
          data-shortname=":tomato:"
          data-index="15"
          title="tomato"
          data-eid="213"
        >
          <span className="emojione emojione-1f345"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f951"
          data-shortname=":avocado:"
          data-index="16"
          title="avocado"
          data-eid="2288"
        >
          <span className="emojione emojione-1f951"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f346"
          data-shortname=":eggplant:"
          data-index="17"
          title="aubergine"
          data-eid="214"
        >
          <span className="emojione emojione-1f346"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f954"
          data-shortname=":potato:"
          data-index="18"
          title="potato"
          data-eid="2291"
        >
          <span className="emojione emojione-1f954"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f955"
          data-shortname=":carrot:"
          data-index="19"
          title="carrot"
          data-eid="2292"
        >
          <span className="emojione emojione-1f955"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f33d"
          data-shortname=":corn:"
          data-index="20"
          title="ear of maize"
          data-eid="205"
        >
          <span className="emojione emojione-1f33d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f336"
          data-shortname=":hot_pepper:"
          data-index="21"
          title="hot pepper"
          data-eid="1083"
        >
          <span className="emojione emojione-1f336"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f952"
          data-shortname=":cucumber:"
          data-index="22"
          title="cucumber"
          data-eid="2289"
        >
          <span className="emojione emojione-1f952"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f95c"
          data-shortname=":peanuts:"
          data-index="23"
          title="peanuts"
          data-eid="2322"
        >
          <span className="emojione emojione-1f95c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35e"
          data-shortname=":bread:"
          data-index="24"
          title="bread"
          data-eid="236"
        >
          <span className="emojione emojione-1f35e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f950"
          data-shortname=":croissant:"
          data-index="25"
          title="croissant"
          data-eid="2287"
        >
          <span className="emojione emojione-1f950"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f956"
          data-shortname=":french_bread:"
          data-index="26"
          title="baguette bread"
          data-eid="2293"
        >
          <span className="emojione emojione-1f956"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f95e"
          data-shortname=":pancakes:"
          data-index="27"
          title="pancakes"
          data-eid="2324"
        >
          <span className="emojione emojione-1f95e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f9c0"
          data-shortname=":cheese:"
          data-index="28"
          title="cheese wedge"
          data-eid="2092"
        >
          <span className="emojione emojione-1f9c0"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f356"
          data-shortname=":meat_on_bone:"
          data-index="29"
          title="meat on bone"
          data-eid="228"
        >
          <span className="emojione emojione-1f356"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f357"
          data-shortname=":poultry_leg:"
          data-index="30"
          title="poultry leg"
          data-eid="229"
        >
          <span className="emojione emojione-1f357"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f953"
          data-shortname=":bacon:"
          data-index="31"
          title="bacon"
          data-eid="2290"
        >
          <span className="emojione emojione-1f953"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f354"
          data-shortname=":hamburger:"
          data-index="32"
          title="hamburger"
          data-eid="226"
        >
          <span className="emojione emojione-1f354"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35f"
          data-shortname=":fries:"
          data-index="33"
          title="french fries"
          data-eid="237"
        >
          <span className="emojione emojione-1f35f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f355"
          data-shortname=":pizza:"
          data-index="34"
          title="slice of pizza"
          data-eid="227"
        >
          <span className="emojione emojione-1f355"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f32d"
          data-shortname=":hotdog:"
          data-index="35"
          title="hot dog"
          data-eid="2093"
        >
          <span className="emojione emojione-1f32d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f32e"
          data-shortname=":taco:"
          data-index="36"
          title="taco"
          data-eid="2094"
        >
          <span className="emojione emojione-1f32e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f32f"
          data-shortname=":burrito:"
          data-index="37"
          title="burrito"
          data-eid="2095"
        >
          <span className="emojione emojione-1f32f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f959"
          data-shortname=":stuffed_flatbread:"
          data-index="38"
          title="stuffed flatbread"
          data-eid="2296"
        >
          <span className="emojione emojione-1f959"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f95a"
          data-shortname=":egg:"
          data-index="39"
          title="egg"
          data-eid="2320"
        >
          <span className="emojione emojione-1f95a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f373"
          data-shortname=":cooking:"
          data-index="40"
          title="cooking"
          data-eid="257"
        >
          <span className="emojione emojione-1f373"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f958"
          data-shortname=":shallow_pan_of_food:"
          data-index="41"
          title="shallow pan of food"
          data-eid="2295"
        >
          <span className="emojione emojione-1f958"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f372"
          data-shortname=":stew:"
          data-index="42"
          title="pot of food"
          data-eid="256"
        >
          <span className="emojione emojione-1f372"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f957"
          data-shortname=":salad:"
          data-index="43"
          title="green salad"
          data-eid="2294"
        >
          <span className="emojione emojione-1f957"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37f"
          data-shortname=":popcorn:"
          data-index="44"
          title="popcorn"
          data-eid="2096"
        >
          <span className="emojione emojione-1f37f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f371"
          data-shortname=":bento:"
          data-index="45"
          title="bento box"
          data-eid="255"
        >
          <span className="emojione emojione-1f371"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f358"
          data-shortname=":rice_cracker:"
          data-index="46"
          title="rice cracker"
          data-eid="230"
        >
          <span className="emojione emojione-1f358"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f359"
          data-shortname=":rice_ball:"
          data-index="47"
          title="rice ball"
          data-eid="231"
        >
          <span className="emojione emojione-1f359"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35a"
          data-shortname=":rice:"
          data-index="48"
          title="cooked rice"
          data-eid="232"
        >
          <span className="emojione emojione-1f35a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35b"
          data-shortname=":curry:"
          data-index="49"
          title="curry and rice"
          data-eid="233"
        >
          <span className="emojione emojione-1f35b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35c"
          data-shortname=":ramen:"
          data-index="50"
          title="steaming bowl"
          data-eid="234"
        >
          <span className="emojione emojione-1f35c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f35d"
          data-shortname=":spaghetti:"
          data-index="51"
          title="spaghetti"
          data-eid="235"
        >
          <span className="emojione emojione-1f35d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f360"
          data-shortname=":sweet_potato:"
          data-index="52"
          title="roasted sweet potato"
          data-eid="238"
        >
          <span className="emojione emojione-1f360"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f362"
          data-shortname=":oden:"
          data-index="53"
          title="oden"
          data-eid="240"
        >
          <span className="emojione emojione-1f362"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f363"
          data-shortname=":sushi:"
          data-index="54"
          title="sushi"
          data-eid="241"
        >
          <span className="emojione emojione-1f363"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f364"
          data-shortname=":fried_shrimp:"
          data-index="55"
          title="fried shrimp"
          data-eid="242"
        >
          <span className="emojione emojione-1f364"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f365"
          data-shortname=":fish_cake:"
          data-index="56"
          title="fish cake with swirl design"
          data-eid="243"
        >
          <span className="emojione emojione-1f365"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f361"
          data-shortname=":dango:"
          data-index="57"
          title="dango"
          data-eid="239"
        >
          <span className="emojione emojione-1f361"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f366"
          data-shortname=":icecream:"
          data-index="58"
          title="soft ice cream"
          data-eid="244"
        >
          <span className="emojione emojione-1f366"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f367"
          data-shortname=":shaved_ice:"
          data-index="59"
          title="shaved ice"
          data-eid="245"
        >
          <span className="emojione emojione-1f367"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f368"
          data-shortname=":ice_cream:"
          data-index="60"
          title="ice cream"
          data-eid="246"
        >
          <span className="emojione emojione-1f368"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f369"
          data-shortname=":doughnut:"
          data-index="61"
          title="doughnut"
          data-eid="247"
        >
          <span className="emojione emojione-1f369"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36a"
          data-shortname=":cookie:"
          data-index="62"
          title="cookie"
          data-eid="248"
        >
          <span className="emojione emojione-1f36a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f382"
          data-shortname=":birthday:"
          data-index="63"
          title="birthday cake"
          data-eid="268"
        >
          <span className="emojione emojione-1f382"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f370"
          data-shortname=":cake:"
          data-index="64"
          title="shortcake"
          data-eid="254"
        >
          <span className="emojione emojione-1f370"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36b"
          data-shortname=":chocolate_bar:"
          data-index="65"
          title="chocolate bar"
          data-eid="249"
        >
          <span className="emojione emojione-1f36b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36c"
          data-shortname=":candy:"
          data-index="66"
          title="candy"
          data-eid="250"
        >
          <span className="emojione emojione-1f36c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36d"
          data-shortname=":lollipop:"
          data-index="67"
          title="lollipop"
          data-eid="251"
        >
          <span className="emojione emojione-1f36d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36e"
          data-shortname=":custard:"
          data-index="68"
          title="custard"
          data-eid="252"
        >
          <span className="emojione emojione-1f36e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f36f"
          data-shortname=":honey_pot:"
          data-index="69"
          title="honey pot"
          data-eid="253"
        >
          <span className="emojione emojione-1f36f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37c"
          data-shortname=":baby_bottle:"
          data-index="70"
          title="baby bottle"
          data-eid="803"
        >
          <span className="emojione emojione-1f37c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f95b"
          data-shortname=":milk:"
          data-index="71"
          title="glass of milk"
          data-eid="2321"
        >
          <span className="emojione emojione-1f95b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="2615"
          data-shortname=":coffee:"
          data-index="72"
          title="hot beverage"
          data-eid="51"
        >
          <span className="emojione emojione-2615"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f375"
          data-shortname=":tea:"
          data-index="73"
          title="teacup without handle"
          data-eid="259"
        >
          <span className="emojione emojione-1f375"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f376"
          data-shortname=":sake:"
          data-index="74"
          title="sake bottle and cup"
          data-eid="260"
        >
          <span className="emojione emojione-1f376"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37e"
          data-shortname=":champagne:"
          data-index="75"
          title="bottle with popping cork"
          data-eid="2097"
        >
          <span className="emojione emojione-1f37e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f377"
          data-shortname=":wine_glass:"
          data-index="76"
          title="wine glass"
          data-eid="261"
        >
          <span className="emojione emojione-1f377"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f378"
          data-shortname=":cocktail:"
          data-index="77"
          title="cocktail glass"
          data-eid="262"
        >
          <span className="emojione emojione-1f378"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f379"
          data-shortname=":tropical_drink:"
          data-index="78"
          title="tropical drink"
          data-eid="263"
        >
          <span className="emojione emojione-1f379"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37a"
          data-shortname=":beer:"
          data-index="79"
          title="beer mug"
          data-eid="264"
        >
          <span className="emojione emojione-1f37a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37b"
          data-shortname=":beers:"
          data-index="80"
          title="clinking beer mugs"
          data-eid="265"
        >
          <span className="emojione emojione-1f37b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f942"
          data-shortname=":champagne_glass:"
          data-index="81"
          title="clinking glasses"
          data-eid="2297"
        >
          <span className="emojione emojione-1f942"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f943"
          data-shortname=":tumbler_glass:"
          data-index="82"
          title="tumbler glass"
          data-eid="2298"
        >
          <span className="emojione emojione-1f943"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f37d"
          data-shortname=":fork_knife_plate:"
          data-index="83"
          title="fork and knife with plate"
          data-eid="1214"
        >
          <span className="emojione emojione-1f37d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f374"
          data-shortname=":fork_and_knife:"
          data-index="84"
          title="fork and knife"
          data-eid="258"
        >
          <span className="emojione emojione-1f374"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          tabIndex="-1"
          id="1f944"
          data-shortname=":spoon:"
          data-index="85"
          title="spoon"
          data-eid="2299"
        >
          <span className="emojione emojione-1f944"></span>
        </span>
      </div>
    </div>
  );
};