Objective
I'm trying to make a Graphology Graph class instance observable using Mobx. This will enable component rendering based on changes to the graph.
I'm aware of this question (and answer): How to make class objects observable in MobX?
However, while that has worked for me in the past, this Class seems to have something tricky. Link to graphology source: https://github.com/graphology/graphology/blob/master/src/graph.js
Attempt
It seems like the node and edge data is stored in _nodes and _edges, therefore I tried the following..
import { observable, decorate, computed, action } from "mobx";import Graph from 'graphology';decorate(Graph, { _nodes: observable, _edges: observable,})export class GraphStore { @observable graph = new Graph({multi: true, allowSelfLoops: false, type: "directed"});})}export const graphStore = new GraphStore()However this returns:
[Error] RangeError: Maximum call stack size exceeded. useObserver (bundle.js:70627) renderWithHooks (bundle.js:96031) updateFunctionComponent (bundle.js:97615) performUnitOfWork (bundle.js:102300) workLoop (bundle.js:102340)...and
[Error] Error: [mobx] Cannot make property '_nodes' observable, it is not configurable and writable in the target objectinvariant — bundle.js:70923fail — bundle.js:70918assertPropertyConfigurable — bundle.js:70994(anonymous function) — bundle.js:74880(anonymous function) — bundle.js:71275...Question
What should I change in order to make the graph object observable?