question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cloudinary "multiple" doesn't return array if only one image is selected

See original GitHub issue

Describe the bug When selecting 2 images via Cloudinary media_library, the image strings are saved in markdown as an array. When selecting 1 image, it is saved in markdown as a string. This causes the following error during build:

warn There are conflicting field types in your data.

If you have explicitly defined a type for those fields, you can safely ignore this warning message.
Otherwise, Gatsby will omit those fields from the GraphQL schema.

If you know all field types in advance, the best strategy is to explicitly define them with the `createTypes` action, and skip inference with the `@dontInfer` directive.
See https://www.gatsbyjs.org/docs/actions/#createTypes
MarkdownRemark.frontmatter.images:
 - type: [string]
   value: [ 'https://res.cloudinary.com/testgatsbycloudinarymultiple/image/upload/v1566436788/samples/cloudinary-group.jpg', ... ]
   source: File "src/pages/blog/2019-08-21-multiple-via-cloudinary.md"
 - type: string
   value: 'https://res.cloudinary.com/testgatsbycloudinarymultiple/image/upload/v1566436775/sample.jpg'
   source: File "src/pages/blog/2019-08-21-single-via-cloudinary.md"
success building schema - 0.432 s
success createPages - 0.086 s
success createPagesStatefully - 0.074 s
success onPreExtractQueries - 0.032 s
success update schema - 0.075 s

 ERROR #85907  GRAPHQL

There was an error in your GraphQL query:

- Unknown field 'images' on type 'MarkdownRemarkFrontmatter'.

To Reproduce

  1. Create a post with multiple images via Cloudinary media_library
  2. Create a post with 1 image via Cloudinary media_library
  3. The build now fails because the second post is a string, not an array

Expected behavior When configured for multiple: true, it should always return an array even if only one image is selected.

Applicable Versions:

"gatsby": "^2.13.31",
"gatsby-image": "^2.0.23",
"gatsby-plugin-netlify": "^2.0.6",
"gatsby-plugin-netlify-cms": "^4.1.6",
"netlify-cms-app": "^2.9.6",
"netlify-cms-media-library-cloudinary": "^1.3.2"

CMS configuration

backend:
  name: git-gateway
  branch: master

public_folder: /img

media_library:
  name: cloudinary
  config:
    cloud_name: testgatsbycloudinarymultiple
    api_key: 358577637849857
    multiple: true

collections:
  - name: "blog"
    label: "Blog"
    folder: "src/pages/blog"
    create: true
    slug: "{{year}}-{{month}}-{{day}}-{{slug}}"
    fields:
      - {
          label: "Template Key",
          name: "templateKey",
          widget: "hidden",
          default: "blog-post",
        }
      - { label: "Title", name: "title", widget: "string" }
      - { label: "Publish Date", name: "date", widget: "datetime" }
      - { label: "Description", name: "description", widget: "text" }
      - { label: "Featured Post", name: "featuredpost", widget: "boolean" }
      - { label: "Images", name: "images", widget: image }
      - { label: "Body", name: "body", widget: "markdown" }
      - { label: "Tags", name: "tags", widget: "list" }

Markdown Examples Multiple Images:

---
templateKey: blog-post
title: Multiple Via Cloudinary
date: 2019-08-22T01:49:09.250Z
description: test
featuredpost: false
images:
  - >-
    https://res.cloudinary.com/testgatsbycloudinarymultiple/image/upload/v1566436788/samples/cloudinary-group.jpg
  - >-
    https://res.cloudinary.com/testgatsbycloudinarymultiple/image/upload/v1566436787/samples/imagecon-group.jpg
tags:
  - test
---

Test

Single Image:

---
templateKey: blog-post
title: Single Via Cloudinary
date: 2019-08-22T02:07:23.914Z
description: test
featuredpost: false
images: >-
  https://res.cloudinary.com/testgatsbycloudinarymultiple/image/upload/v1566436775/sample.jpg
tags:
  - test
---
Test

Additional context I created a test repo and published in case that helps: Test Repository: https://github.com/zacharysierakowski/gatsby-cloudinary-multiple-test Test URL: https://gatsby-cloudinary-multiple-test.netlify.com/admin/

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
erquhartcommented, Sep 10, 2019

No just haven’t published yet, I’ll get one out today - note that this will be in beta for a bit, so it will initially only be available via netlify-cms@beta or netlify-cms-app@beta.

1reaction
zacharysierakowskicommented, Sep 5, 2019

@erquhart, this was an easier change than I expected. I created a PR here. If you have some time to check it out, it’d be appreciated. Thanks again!

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to upload two images (not array) with different names ...
You'll need to upload each image individually in its own upload call and specify the public id for that image. Cloudinary does not...
Read more >
(No title)
Since Cloudinary doesn't have a method for multiple uploads, I passed the array of images (previously extracted with Multer) through a forEach.
Read more >
Managing Assets
The Cloudinary APIs provide a variety of methods for managing media assets.
Read more >
Programmatically Uploading Images, Videos, and Other Files
Learn how to upload images, videos, and other files with only a line or two of code - with cloud storage, CDN delivery,...
Read more >
Image Transformations for Developers
It's best practice to include only one action parameter per URL component. If you want to apply multiple actions in a single transformation...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found