Prop Drilling vs. Redux

Nature of issue?

• Question about the source code

Hello,
I was wondering why there is plenty of prop-drilling from the root-level components down, even when sub-components are connected to redux. For example IDE and Nav components are both connected, but IDE passes down a lot of the properties manually. This leads to very verbose code that can be hard to read in my opinion and means that I spend a lot of time going up and down the hierarchy following props when they just come from redux in the end. There are also some performance considerations where a change of state will re-render all the components down from the route connect() call to where the prop is used, rather than just the section that needs re-rendering

For the Nav item, I have made an example refactoring here: https://github.com/meiamsome/p5.js-web-editor/commit/89f850c1e837b8b28aa86450e874623890c53327

I would be happy to PR some similar refactoring for other components if you think that makes sense.

Start by tracing how the IDE and Nav components receive props from the root-level components and where their Redux connect() calls occur. Review the linked Nav refactoring commit as a reference. Before implementation, get agreement on which components are in scope; done should mean an agreed prop-drilling reduction with the existing behavior preserved.