Layout does not update when the chart gets a different set of data - revision and layout.datarevision don't work

I am trying to update a whole bar chart using Plotly React.
First I have a bar chart with bars on vertical, then after I click wherever on the chart I would like to rotate the chart 90 degrees and have the bars on horizontal with different data. So X axis becames Y and vice-versa.

I have tried using the revision prop of the <Plot /> component and the layout.dataverision property but it doesn't work.
When I click on the chart, it just empties.

I have

  const onUpdate = (event) => {
    console.log('update', event);
  };

which logs the appropriate data and layout in console before and after the click.

Basically the data updates but the layout does not and the issue comes from the x and y axis trying to display the same type data and not assessing what is the new data.

// here xaxis thinks it has to display strings
// and yaxis thinks it has to display numbers
// which is correct only for the first set of data
xaxis: {autorange: true, range: Array(2), type: "category"},
yaxis: {autorange: true, range: Array(2), type: "linear"}
// the second set of data reverses the x and y axes, so the new properties should be:
xaxis: {autorange: true, range: Array(2), type: "linear"},
yaxis: {autorange: true, range: Array(2), type: "category"}

How can I make Plotly asses the new data and update the layout accordingly ?

Thank you.

https://codesandbox.io/s/elegant-williams-jofx90?file=/src/BarChart.js

import { useEffect, useState } from "react";
import Plot from "react-plotly.js";

export default function BarChart() {
  const [chart, setChart] = useState({
    data: [],
    layout: {
      title: "Some BarChart",
      showlegend: true,
      legend: {
        x: 0,
        y: -0.4,
        orientation: "h"
      },
      autosize: true,
      barmode: "stack",
      datarevision: 0
    },
    config: { responive: true },
    revision: 0
  });

  useEffect(() => {
    const farm1 = {
      x: ["Ducks", "Cows", "Pigs", "Chickens"],
      y: [10, 12, 14, 16],
      name: "Farm 1",
      type: "bar",
      marker: { color: "#000" },
      hovertemplate: "%{x} - %{y:.0f} <extra></extra>"
    };
    const farm2 = {
      x: ["Ducks", "Cows", "Pigs", "Chickens"],
      y: [8, 10, 12, 14],
      name: "Farm 2",
      type: "bar",
      marker: { color: "#FE7100" },
      hovertemplate: "%{x} - %{y:.0f} <extra></extra>"
    };

    setChart((prevState) => ({
      data: [farm1, farm2],
      layout: { ...prevState.layout }
    }));
  }, [setChart]);

  const onUpdate = (event) => {
    console.log("update", event);
  };

  const onClick = (event) => {
    const farm1 = {
      x: [10, 12, 14, 16],
      y: ["Ducks", "Cows", "Pigs", "Chickens"],
      name: "Farm 1",
      type: "bar",
      marker: { color: "#000" },
      hovertemplate: "%{x} - %{y:.0f} <extra></extra>",
      orientation: "h"
    };

    const farm2 = {
      x: [8, 10, 12, 14],
      y: ["Ducks", "Cows", "Pigs", "Chickens"],
      name: "Farm 2",
      type: "bar",
      marker: { color: "#FE7100" },
      hovertemplate: "%{x} - %{y:.0f} <extra></extra>",
      orientation: "h"
    };

    setChart((prevState) => ({
      data: [farm1, farm2],
      layout: {
        ...prevState.layout,
        datarevision: prevState.layout.datarevision + 1
      },
      revision: prevState.revision + 1
    }));

    console.log(event.points[0].x.replaceAll("<br>", " ").trim());
  };

  return (
    <Plot
      data={chart.data}
      layout={chart.layout}
      config={chart.config}
      revision={chart.revision}
      style={{ width: "100%", height: "100%" }}
      useResizeHandler
      onClick={onClick}
      onUpdate={onUpdate}
    />
  );
}

Start with the reproduction in src/BarChart.js from the linked CodeSandbox and inspect how the Plot component receives data, layout, revision, and layout.datarevision before and after the click. Reproduce the axis swap and compare the rendered chart with the logged props; done when replacing the data updates both axis types and the chart no longer empties.