/**
 * @jsxRuntime classic
 * @jsx jsx
 */
import { Fragment, useCallback, useMemo } from 'react';

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { jsx } from '@emotion/react';
import { getRandomHex } from '@atlaskit/media-common';
import { useFilePreview } from '@atlaskit/media-file-preview';
import { MediaImage } from '@atlaskit/media-ui';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
import { InlineImageCardLoadingView } from './views/loading-view';
export const InlineImageCard = ({
  dimensions,
  identifier,
  renderError,
  alt,
  isLazy,
  ssr,
  crop,
  stretch
}) => {
  // Generate unique traceId for file
  const traceContext = useMemo(() => ({
    traceId: getRandomHex(8)
  }), []);

  // Ignored via go/ees007
  // eslint-disable-next-line @atlaskit/editor/enforce-todo-comment-format
  // TODO do we need to handle nonCriticalError
  const {
    preview,
    error: previewError,
    onImageError,
    onImageLoad,
    getSsrScriptProps,
    copyNodeRef
  } = useFilePreview({
    identifier,
    ssr,
    dimensions,
    traceContext
  });
  const memoizedOnImageLoad = useCallback(() => {
    onImageLoad(preview);
  }, [onImageLoad, preview]);
  if (previewError) {
    return renderError({
      error: previewError
    });
  }
  if (!preview) {
    return jsx(InlineImageCardLoadingView, null);
  }
  return jsx(Fragment, null, jsx(MediaImage, {
    dataURI: preview.dataURI,
    alt: alt,
    previewOrientation: preview.orientation,
    onImageLoad: expValEquals('platform_editor_perf_lint_cleanup', 'isEnabled', true) ? memoizedOnImageLoad : () => {
      onImageLoad(preview);
    },
    onImageError: onImageError,
    loading: isLazy ? 'lazy' : undefined,
    forceSyncDisplay: !!ssr,
    crop: crop,
    stretch: stretch,
    ref: copyNodeRef
  }), getSsrScriptProps &&
  // eslint-disable-next-line react/jsx-props-no-spreading
  jsx("script", getSsrScriptProps()));
};