Как настроить loader в react-router для проверки доступа без изменения логики внутри компонента?

Один из способов настроить loader в react-router для проверки доступа без изменения логики внутри компонента - использовать компоненты высшего порядка (HOC) и контейнеры.

1. Создайте контейнер компонент (например, `AuthContainer`), который будет отвечать за проверку авторизации:
```jsx
import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';

const AuthContainer = (WrappedComponent) => {
  class WithAuth extends Component {
    constructor(props) {
      super(props);
      this.state = {
        isAuthenticated: false,
        isLoading: true,
      };
    }

    componentDidMount() {
      // выполните здесь проверку авторизации
      // если проверка пройдена, установите isAuthenticated в true
      // если проверка не пройдена, перенаправьте на другую страницу
      // и установите isAuthenticated в false
    }

    render() {
      const { isAuthenticated, isLoading } = this.state;

      if (isLoading) {
        return <div>Loading...</div>; // отобразите loader
      }

      if (!isAuthenticated) {
        return <Redirect to="/login" />; // перенаправляем на другую страницу
      }

      return <WrappedComponent {...this.props} />;
    }
  }

  return WithAuth;
};

export default AuthContainer;
```

2. Используйте созданный контейнер `AuthContainer` для обертки компонента `About`:
```jsx
import React from 'react';
import AuthContainer from './AuthContainer';

const About = () => {
  return (
    <div>
      <h1>About</h1>
      <p>This is the About page.</p>
    </div>
  );
};

export default AuthContainer(About);
```

Теперь, компонент `About` будет автоматически проверять авторизацию при каждом монтировании и перенаправлять на другую страницу, если проверка не пройдена. Во время проверки, будет отображаться loader (в примере - "Loading...").