Chart is not rerendered after changes for dataset

[DrankedSnake]

I change base collections with data from parent component and update dataset explicitly. But after click on select option in parent component only first dataset rendered in chart. I have try to check is function responsible for updating dataset was called again in second time. Seems like function called and dataset changed but chart displayed previous state. Also in some reason tooltip does not work for after updates in dataset.

import { Bar } from "solid-chartjs"
import { Tank } from "../../../types"
import { Show, createResource, onMount, OnEffectFunction } from "solid-js";
import { Chart, Legend, Tooltip } from "chart.js";
import { createStore } from "solid-js/store";

type TanksChartProps = {
    tanks: Array<Tank>
}

export default function TanksChart(props: TanksChartProps){
    onMount(()=>{Chart.register(Legend, Tooltip)})
    const [data, setData] = createStore(
        {
            labels: [],
            datasets: []
        }
    )

    const prepareDataset = () => {
        if (props.tanks){
            let labels = [];
            let currentVolumes = [];
            let bunkeringVolumes = [];

            for (let index = 0; index < props.tanks.length; index++){
                labels.push(props.tanks[index].name)
                currentVolumes.push(props.tanks[index].current_volume)
                bunkeringVolumes.push(props.tanks[index].bunkering_volume)
            }
            console.log(labels)
            setData(
                {
                    labels: labels,
                    datasets: [
                        {
                            label: "Current volume",
                            data: currentVolumes,
                            backgroundColor: "rgba(255, 205, 86, 0.5)",
                            borderColor: "rgb(255, 205, 86)",
                            borderWidth: 1
                        },
                        {
                            label: "Bunkering volume",
                            data: bunkeringVolumes,
                            backgroundColor: "rgba(154, 205, 86, 0.5)",
                            borderColor: "rgb(255, 205, 86)",
                            borderWidth: 1
                        },
                    ]
                }
            )
        }else {
            setData(
                {
                    labels: [],
                    datasets: []
                }
            );
        }

    };

    const chartOptions = {
        responsive: true,
        maintainAspectRatio: false,
        plugins: {
            legend: {
                display: true,
            }
        },
        scales: {
            x: {
                stacked: true,
            },
            y: {
                stacked: true
            }
        }
    }
    
    return (
        <div>
            <Show 
                when={props.tanks}
                fallback={
                    <Bar data={data} options={chartOptions} width={500} height={500}/>
                }
            >
                {prepareDataset()}
                <Bar data={data} fallback={console.log("rerender of chart")} options={chartOptions} width={500} height={500}/>
            </Show>
        </div>
    )
}

[DrankedSnake]

For now I stuck and could not understand what is wrong. Probably I use incorrectly solid chart js.

[DrankedSnake]

Uhh. Seems like I found the issue. In my example I am using createStore signal to detect changes in nested objects. After using createSignal all works fine and chart rerender after changes in dataset. I am closing the issue.