Проблемы с запросом childImageSharp в Gatsby и Drupal

Я работаю над проектом с использованием Gatsby и Drupal CMS и в настоящее время сталкиваюсь с проблемой, связанной с gatsby-plugin-image и изображениями, приходящими из CMS.

Я пытаюсь заменить все свои теги <img> на компоненты, но, похоже, я пропускаю что-то в определении типа или запросе GraphQL, так как получаю это предупреждение во время процесса сборки:

warn Вы не можете использовать childImageSharp вместе с undefined.undefined — используйте вместо этого publicURL. Часть запроса childImageSharp в этом файле вернет null:undefined

Вот мое определение типа для соответствующего параграфа Drupal:

module.exports = schema => [
  schema.buildObjectType({
    name: 'paragraph__image',
    fields: {
      id: 'ID!',
      drupal_id: 'String',
      drupal_internal__id: 'Int',
      drupal_internal__revision_id: 'Int',
      status: 'Boolean',
      internal: 'Internal!',
      type: {
        type: 'String',
        resolve: source => source.internal.type || '',
      },
      legend: {
        type: 'String',
        resolve: source =>
          source.field_paragraph_image_legend
            ? source.field_paragraph_image_legend || ''
            : '',
      },
      image: {
        type: 'Image',
        resolve: (source, args, context) => {
          const imageFile = context.nodeModel.getNodeById({
            type: 'file__image',
            id: source.relationships.field_paragraph_image_image___NODE,
          });

          if (!source.field_paragraph_image_image) return {};
          if (!imageFile) return {};

          return {
            fileName: source.field_paragraph_image_image.filename || '',
            alt: source.field_paragraph_image_image.alt || '',
            title: source.field_paragraph_image_image.title || '',
            height: source.field_paragraph_image_image.height,
            width: source.field_paragraph_image_image.width,
            url: imageFile.uri.url || '',
            imageStyleUri: imageFile.image_style_uri
              ? imageFile.image_style_uri
              : '',
          };
        },
      },
      imageBis: {
        type: 'File',
        resolve: (source, args, context) => {
          const imageFile = context.nodeModel.getNodeById({
            type: 'file__image',
            id: source.relationships.field_paragraph_image_image___NODE,
          });

          if (!source.field_paragraph_image_image) return {};
          if (!imageFile) return {};

          return {
            fileName: source.field_paragraph_image_image.filename || '',
            alt: source.field_paragraph_image_image.alt || '',
            title: source.field_paragraph_image_image.title || '',
            height: source.field_paragraph_image_image.height,
            width: source.field_paragraph_image_image.width,
            url: imageFile.uri.url || '',
            imageStyleUri: imageFile.image_style_uri
              ? imageFile.image_style_uri
              : '',
          };
        },
      },
      displayMode: {
        type: 'String',
        resolve: source => source.field_display_mode || '',
      },
    },
    interfaces: ['Node'],
    extensions: {
      infer: false,
    },
  }),
];

Поле, которое я хочу запросить, это “imageBis”, которое является дубликатом “image”, но я изменил тип с “Image” на “File”.

А вот компонент, содержащий мой gql-запрос:

import React from 'react';
import { graphql } from 'gatsby';
import classNames from 'classnames';

import absolutePath from 'utils/absolutePath';
import getTitleNode from 'utils/getters';
import unbreakableSpaceWithPunctuation from 'utils/unbreakableSpaceWithPunctuation';

import * as styles from './paragraphImage.module.css';

type Internal = {
  type: string;
};

type Image = {
  url: string;
  alt: string;
};

type Paragraph = {
  drupal_internal__id: number;
  internal: Internal;
  legend: string;
  image: Image;
  startPosition: number;
  endPosition: number;
  displayMode: string;
};

interface Props {
  paragraph: Paragraph;
  stickyBarLink: string;
}

const ParagraphImage = (props: Props) => {
  const paragraphId = props.paragraph.drupal_internal__id;

  const classesImage = classNames(styles.img, {
    [`${styles.imgCenter}`]: props.paragraph.displayMode === 'center_position',
  });
  const classesImageContainer = classNames(styles.imgContainer, {
    [`${styles.imgContainerCenter}`]:
      props.paragraph.displayMode === 'center_position',
  });

  return (
    <div className={styles.alignRight} id={props.stickyBarLink}>
      <div id={`summary-start-${paragraphId}`} />
      <div className={classesImageContainer}>
        <img
          className={classesImage}
          src={absolutePath(props.paragraph.image.url)}
          alt={getTitleNode(props.paragraph.image.alt)}
          loading="lazy"
        />

        {props.paragraph.legend && (
          <legend className={styles.legend}>
            {unbreakableSpaceWithPunctuation(props.paragraph.legend)}
          </legend>
        )}
      </div>
      <div id={`summary-end-${paragraphId}`} />
    </div>
  );
};

export const query = graphql`
  fragment ParagraphImage on paragraph__image {
    drupal_internal__id
    internal {
      type
    }
    legend
    image {
      url
      alt
    }
    imageBis {
      publicURL
      childImageSharp {
        gatsbyImageData
      }
    }
    displayMode
  }
`;

export default ParagraphImage;

Я что-то упускаю в запросе?

Большое спасибо за любую помощь.