Как установить ApolloProvider в antd pro v5 | получение Не удалось найти "клиента" в контексте или передано в качестве опции

Question

Я использую antd pro v5 с graphql.

Я определил макет ApolloLayout

export class ApolloLayout extends React.Component<IProps, {}> {
  constructor(props: IProps) {
    super(props);
  }

  render() {
    return (
      <>
        <ApolloProvider client={client}>{this.props.children}</ApolloProvider>
      </>
    );
  }
}

и завернутый ApolloLayout в pages/contacts/index.tsx

...
  return (
    <>
      <ApolloLayout>
        <PageContainer>
          ...
          <CreateGroupForm name={value} unsetForm={() => setGroupEditable(false)} />
          ...
        </PageContainer>
      </ApolloLayout>
    </>
  );

И мой pages/contacts/CreateGroupForm.tsx является

const AddGroupForm: React.FC<AddGroupProps & FormikProps<AddGroupValues> & any> = ({
...
...
...
})
export default compose(
  withApollo,
  withFormik<AddGroupProps, AddGroupValues>({
    enableReinitialize: true,
    mapPropsToValues: ({ id, name, create, unsetForm }) => {
      return {
        name,
      };
    },
    validationSchema: Yup.object().shape({
      name: Yup.string().required('Group name is required'),
    }),
    handleSubmit: (values, formikBag) => {
      console.log(values);
    },
  }),
  withCreateContactGroup()
)(AddGroupForm);

где withCreateContactGroup генерируется сгенерированным graphql-codegen hoc

но я получаю ошибкуInvariant Violation: Could not find "client" in the context or passed in as an option. Wrap the root component in an <ApolloProvider>, or pass an ApolloClient instance in via options.