import {renderHook} from '@testing-library/react-hooks'
import useTemplate from '../useTemplate'

const transforms = {
  socialImage: {
    url: `https://res.cloudinary.com/mabx-eu-dev/image/upload/c_crop,h_0.4935,w_0.3425,x_0.4378,y_0.2033/v1/volvo/elders-image-swap-2_i2n0d7`,
    crop: {
      aspectRatio: 1.04,
      x: 43.78,
      y: 20.33,
      width: 34.25,
      height: 49.35,
    },
  },
}

const socialImage = {
  name: `elders-image-swap-2`,
  objectID: `62999762e0f4b727de648485`,
  url: `https://res.cloudinary.com/mabx-eu-dev/image/upload/v1/volvo/elders-image-swap-2_i2n0d7`,
  datasets: {},
}

const props = {
  content: {
    socialImage,
  },
}

const propsWithTransforms = {
  content: {
    socialImage,
    transforms,
  },
}

describe(`useTemplate`, () => {
  it(`passes through props`, () => {
    const {result} = renderHook((props) => useTemplate(props), {
      initialProps: props,
    })
    expect(result.current).toEqual(
      expect.objectContaining({
        ...props.content,
      })
    )
    expect(result.current.socialImage).toEqual(
      expect.objectContaining({
        url: socialImage.url,
      })
    )
  })

  it(`overrides values with transforms if present`, () => {
    const {result} = renderHook((props) => useTemplate(props), {
      initialProps: propsWithTransforms,
    })
    expect(result.current.socialImage).toEqual(
      expect.objectContaining({
        ...socialImage,
        ...transforms.socialImage,
        url: transforms.socialImage.url,
      })
    )
  })
})