First of all, STOP using class components. This whole inheritance thing can quickly backfire.

You should be using composition where you have a component with slots to receive any component. Every component stays focused on doing a specific thing and you add or remove slots as you need.

This is much easier to manage. Is more flexible and allows more variations since the composition happens when you are using the component rather than when you are defining it.

<Page
header={<SomeHeaderComponent />}
footer={<SomeFooterComponent />}
sidePanel={<SomeSidePanelComponent />}
>
Put any content here
</Page>


You may even jump into hooks if you want to go headless but thats more to simplify components by moving the logic to hooks.