How do I do this with date adapters?

[Darhagonable]

Hi! I'm working on a page which lets one see historical view of sensor values over time with different options for timespan.
I can't find any example of how to use date adapters as mentioned in the documentation. I made my own system to handle the dates shown but its far from perfect. I'm trying to make it work similar to the graphs google is showing for example GameStop Stock market were one can choose between different timespans to view for and the x-axis adjusts accordingly.

I'm using chartjs-react to be able to write the chart as a simple react component.

My current bad code:

function graph({sensor, timespan}) {
  let signals = [];
  let min;
  let max;
  let xAxisFormat = () => {};

  function clone(obj) {
    return JSON.parse(JSON.stringify(obj));
  }
  function filterValues(min, max) {
    signals = clone(sensor).SensorSignals.filter((signal) => {
      const timestamp = Date.parse(signal.updatedAt); 
      return timestamp > min && timestamp < max;
    });
  }
  function parseDates(signals) {
    for(var signal of signals) {
      signal.updatedAt = Date.parse(signal.updatedAt);
    }
  }
  function caseAction(min, max, timeStringFormat, filter = true, timeString = false) {
    if(filter) filterValues(min, max);
    parseDates(signals);
    xAxisFormat = (ticks) => {
      if(timeString) return new Date(ticks).toLocaleTimeString([], timeStringFormat);
      return new Date(ticks).toLocaleDateString([], timeStringFormat);
    };
  }

  switch(timespan) {
    case "today":
      min = new Date().setHours(0,0,0,0);
      max = new Date().setHours(23,59,59,999);
      caseAction(min, max, {hour: "2-digit", minute: "2-digit"}, true, true);
      break;
    case "1week":
      min = new Date().setDate(new Date().getDate() - 7);
      max = Date.parse(new Date());
      caseAction(min, max, {weekday: "short", day: "numeric", month: "short"});
      break;
    case "1month":
      min = new Date().setMonth(new Date().getMonth() - 1);
      max = Date.parse(new Date());
      caseAction(min, max, {day: "numeric", month: "short"});
      break;
    case "6months":
      min = new Date().setMonth(new Date().getMonth() - 6);
      max = Date.parse(new Date());
      caseAction(min, max, {month: "short", year: "numeric"});
      break;
    case "1year":
      min = new Date().setFullYear(new Date().getFullYear() - 1);
      max = Date.parse(new Date());
      caseAction(min, max, {month: "short", year: "numeric"});
      break;
    case "alltime":
      signals = clone(sensor).SensorSignals;
      caseAction(null ,null , {month: "short", year: "numeric"}, false);
      break;
  }


return (
  <ReactChart
    type="line"
    data={{
      datasets: [{
        data: signals
      }]
    }}
    options={{
      parsing: {
        xAxisKey: "updatedAt",
        yAxisKey: "value"
      },
      scales: {
        x: {
          type: "linear",
          min: min,
          max: max,
          ticks: {
            callback(ticks) {return xAxisFormat(ticks);}
          },
          afterTickToLabelConversion: function(chart) {
            chart.ticks[0].value = null;
            chart.ticks[chart.ticks.length - 1].value = null;
          }
        }
      }
    }}
  />
);
}

Could anyone help me figure out how to do something similar but better using the date adapters or generally know some better way of doing this?