React - как сделать общий компонент для использования на всех страницах

---

React Js

Я хочу использовать панель загрузки на всех страницах из вызова функций, таких как ShowLoadingPanel() и HideLoadingPanel(). Как я могу добиться этого, создав общий компонент, чтобы мне не нужно было объявлять его на всех страницах?

Что я уже пробовал:

Страница1

<pre>import React from "react";
import { LoadPanel } from "devextreme-react/load-panel";

export default class extends React.Component {
  state = {
    loadPanelVisible: true,
  };

  componentDidMount() {
    this.setState({
      loadPanelVisible: false,
    });
  }

  render() {
    return (
      <React.Fragment>
        <LoadPanel visible={this.state.loadPanelVisible} />
      </React.Fragment>
    );
  }
}

Страница 2

<pre>import React from "react";
import { LoadPanel } from "devextreme-react/load-panel";

export default class extends React.Component {
  state = {
    loadPanelVisible: true,
  };

  componentDidMount() {
    this.setState({
      loadPanelVisible: false,
    });
  }

  render() {
    return (
      <React.Fragment>
        <LoadPanel visible={this.state.loadPanelVisible} />
      </React.Fragment>
    );
  }
}

---