JSFiddle - React, Tailwind, and code Playground

by Black Label

HTML

<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/data.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script src="https://code.highcharts.com/stock/modules/export-data.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>

JavaScript

const rawData = [{
    "eventId": "c0nmqcdsvg8q9deq0m30",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.05,
        "updateTime": "2021-02-19T07:48:01.072000Z"
      }
    },
    "timestamp": "2021-02-19T07:48:01.072000Z"
  },
  {
    "eventId": "c0nmimfae9qf8j0ni8ug",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.05,
        "updateTime": "2021-02-19T07:31:37.195000Z"
      }
    },
    "timestamp": "2021-02-19T07:31:37.195000Z"
  },
  {
    "eventId": "c0nmb0cmksjn6fnmek40",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.1,
        "updateTime": "2021-02-19T07:15:13.736000Z"
      }
    },
    "timestamp": "2021-02-19T07:15:13.736000Z"
  },
  {
    "eventId": "c0nm3ani3sc4tff6o5lg",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.05,
        "updateTime": "2021-02-19T06:58:50.348000Z"
      }
    },
    "timestamp": "2021-02-19T06:58:50.348000Z"
  },
  {
    "eventId": "c0nlrknae9qf8j0jd61g",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.2,
        "updateTime": "2021-02-19T06:42:26.798000Z"
      }
    },
    "timestamp": "2021-02-19T06:42:26.798000Z"
  },
  {
    "eventId": "c0nljuu4aaj3ehi66l70",
    "targetName": "projects/bv2b8auslfo000c8vh1g/devices/bjejbgfbluqg00dltv60",
    "eventType": "temperature",
    "data": {
      "temperature": {
        "value": 21.15,
        "updateTime": "2021-02-19T06:26:03.456000Z"
      }
    },
    "timestamp":...