Handle React component failures gracefully

[ekelen]

Perhaps with Error Boundaries.

I haven't used them before, but they can allow us to gracefully catch problems rendering components.

Maybe @appigram can give some guidance :)

[appigram]

Hi @ekelen . You can copy ErrorBoundry implementation from Depviz repo https://github.com/moul/depviz/tree/master/web/src/ui/components/ErrorBoundary and wrap any component, like I did for Visualizer, or wrap a whole App component to catch any app bugs, like

<ErrorBoundary>
    {rendererBlock}
 </ErrorBoundary>

You can modify ErrorBoundary component to send custom error message as prop, and/or leave error stack for main components. Hope it helps :-)

GitHub

moul/depviz

👓 dependency visualizer for GitHub & GitLab (a.k.a., "auto-roadmap") - moul/depviz

[moul]

moved to #2