Midi not updating notation

[pwkip]

When I update notation in the textarea <Notation /> is updated correctly, but <Midi /> is not affected.

Code to reproduce the problem:

import React, {useState} from 'react';
import { Notation, Midi } from 'react-abc';

function App() {

  const [notation,setNotation] = useState('CDEF GABc|');

  return (
    <div className="App">
      <textarea value={notation} onChange={(e) => setNotation(e.target.value) } />
      <Notation notation={notation} />
      <Midi notation={notation} />
    </div>
  );
}

export default App;

[orsi-k]

if anyone runs into the same problem and comes here looking for a solution, this answer helped me: https://stackoverflow.com/questions/60177932/react-transition-group-and-react-abc-abcjs-midi-will-not-work-at-the-same-time/
giving Midi its own key caused it to refresh