Cloudinary "multiple" doesn't return array if only one image is selected
See original GitHub issueDescribe 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
- Create a post with multiple images via Cloudinary media_library
- Create a post with 1 image via Cloudinary media_library
- 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:
- Created 4 years ago
- Comments:5 (5 by maintainers)
Top 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 >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
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
ornetlify-cms-app@beta
.@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!