How to connect Appolo with Redux in class component react?

I was asked to created application using class components and fetch date via GraphQL.

I did not have projects like this so I willingly started work.

index.js

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import Footer from './components/footer';
// import { Provider } from 'react-redux';
// import { store } from './Redux/store/index';
import { ApolloClient, InMemoryCache, ApolloProvider, gql } from '@apollo/client';

const client = new ApolloClient({
  uri: 'http://localhost:4000/graphql',
  cache: new InMemoryCache(),
});

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  
  <React.StrictMode>
    <ApolloProvider client={client}>
 <Provider value={client}>
          <Footer />
      </Provider>
      </ApolloProvider>,
18


  </React.StrictMode>
);

then tried to display on app.js

import React, { Component } from 'react';
import gql from "graphql-tag";
import  {Query}  from "react-apollo";

const GET_DATA = gql`
 {
  currencies {
    label
    symbol
  }
}
`

class Footer extends Component{
render(){

    return(
     <Query query={GET_DATA}>
        {({ error, loading, data }) => {
        if (error) return 'something went wrong';
        if (loading) return 'loading...';
        if (data) console.log(data)
        }}
    </Query>
    
    )

    }
  }


  export default Footer

but I get tons of errors like:

ERROR in ./node_modules/@apollo/client/link/http/selectHttpOptionsAndBody.js 31:56-69

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)


ERROR in ./node_modules/@apollo/client/utilities/common/mergeDeep.js 58:55-68

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)


ERROR in ./node_modules/@apollo/client/utilities/graphql/fragments.js 22:17-30

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)


ERROR in ./node_modules/@apollo/client/utilities/graphql/transform.js 137:22-35

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)


ERROR in ./node_modules/@apollo/client/utilities/graphql/transform.js 137:36-49

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)


ERROR in ./node_modules/@apollo/client/utilities/policies/pagination.js 12:24-37

export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)

Anyone know convenient way to display date via graphQL using class components and redux (Appolo have feature of statemenagment by another GraphQL client do not..).