Please add a React sample v1.0.0-beta (ChartJs v3)!!!

[paulhayessilex]

How do I make the following work with this plugin using the following???? Can some one get this to work and create a PR to the samples folder? You'd be helping out MANY developers!

"chart.js": "3.0.0-beta.7",
"chartjs-adapter-moment": "^0.1.2",
"chartjs-plugin-annotation": "1.0.0-beta",

import { Chart as Chartjs } from 'chart.js'

import type {
  ChartOptions,
  ChartData,
  ChartType,
  Plugin,
  UpdateMode,
  DefaultDataPoint,
} from 'chart.js'

import { noop } from '../../utils/noop'

export interface IChartProps {
  chartId: string
  data: ChartData
  options: ChartOptions
  type: ChartType
  updateMode?: UpdateMode
  plugins?: Plugin[]
}

export const Chart = ({ data, options, type, plugins, updateMode, chartId }: IChartProps) => {
  const chartInstance = useRef<Chartjs<ChartType, DefaultDataPoint<ChartType>, unknown>>({
    update: noop,
    destroy: noop,
  } as Chartjs)

  useEffect(() => {
    chartInstance.current.options = options
    chartInstance.current.data = data

    chartInstance.current.update(updateMode)
  }, [data, options])

  const nodeRef = useCallback<(instance: HTMLCanvasElement | null) => void>((node) => {
    chartInstance.current.destroy()

    if (node) {
      chartInstance.current = new Chartjs(node, {
        type,
        data,
        options,
        plugins,
      })
    }
  }, [])

  return <canvas ref={nodeRef} id={chartId} />
}

Chart.register = Chartjs.register || noop