static-cms icon indicating copy to clipboard operation
static-cms copied to clipboard

Setting media_folder on a file widget results in empty media selection on image widget

Open preetamslot opened this issue 1 year ago • 9 comments

To make it work you have to declare media_folder on both widgets.

 {
              label: t("video"),
              name: "video",
              choose_url: true,
              media_folder: "public/video",
              hint: t("video_hint"),
              widget: "file",
              required: false,
               
            },
             {
              label: t("image"),
              name: "thumbnail",
              widget: "image",
              required: true,
            },

preetamslot avatar Oct 15 '23 11:10 preetamslot

Can you clarify what you mean by an empty media selection? Can you provide a video of this happening or a repository where this issue occurs?

KaneFreeman avatar Oct 25 '23 18:10 KaneFreeman

Sorry for the late reply!

the bug is that if you declare a media_folder on one file field you have to declare it on all file fields. Declaring it on one (in this case video) the thumbnail field wont work, it does not use the default "media folder" settings

preetamslot avatar Oct 31 '23 14:10 preetamslot

Could you provide your full configuration? Or at least this collections configuration and what your global medai_folder configuration is?

KaneFreeman avatar Oct 31 '23 15:10 KaneFreeman

One thing of note, though, keep in mind that media_folder can take an absolute (starts with /) or relative path (does not start with /). If you provide a relative path (like you have here, media_folder: "public/video",) then it will always be relative to the entry's file location.

Relative

On collection: folder: path/to/some/where On field: media_folder: "public/video"

Files will be saved to : path/to/some/where/public/video

Absolute

On collection: folder: path/to/some/where On field: media_folder: "/public/video"

Files will be saved to : public/video

KaneFreeman avatar Oct 31 '23 15:10 KaneFreeman

Could you provide your full configuration? Or at least this collections configuration and what your global medai_folder configuration is?

const config = {
  locale: lang,
  site_url: url,
  logo_url: "https://nebulix.unfolding.io/logo.svg",
  local_backend: true,
  backend: {
    name: "test-repo",
  },
  search: "true",
  media_folder: "src/assets",
  public_folder: "/src/assets",
  media_library: {
    max_file_size: 8012000,
    folder_support: true,
  },
  collections: [page, post, settings],
};

preetamslot avatar Nov 01 '23 08:11 preetamslot

It looks like your collections (page, post, settings) are stored elsewhere. Can you provide the collection configuration for the one having trouble please?

KaneFreeman avatar Nov 01 '23 12:11 KaneFreeman

The project I am working on I based of a other template I made, here you can see the collections https://github.com/unfolding-io/nebulix/tree/main/src/cms

preetamslot avatar Nov 01 '23 12:11 preetamslot

I am having a lot of trouble replicating your issue. It might be more helpful to know what you are attempting to accomplish.

Right now if I use your config and put in a video field where there is another image or file widget that doesn't have a media_folder configured it is putting it where it should be.

Example

locale: en
logo_url: 'https://nebulix.unfolding.io/logo.svg'
local_backend: true
backend:
  name: github
  branch: main
  repo: staticjscms/static-cms-github
search: 'true'
media_folder: src/assets
public_folder: /src/assets
media_library:
  max_file_size: 2012000
  folder_support: true
collections:
  - name: page
    identifier_field: name
    folder: src/content/page
    label: Pages
    format: frontmatter
    extension: mdx
    icon: page
    create: true
    editor:
      preview: false
      frame: false
    fields:
      - label: Title
        name: title
        widget: string
        pattern:
          - '.{5,}'
          - Must have at least 20 characters
      - label: Body
        name: body
        widget: markdown
        required: false
        show_raw: true
      - label: Video
        name: "video"
        choose_url: true
        media_folder: "public/video"
        hint: Video Hint
        widget: "file"
        required: false
      - label: Featured Image
        name: thumbnail
        widget: image
        required: true
      - label: OG Image
        name: og_image
        widget: image
        required: false
        hint: OG Image here!

If you fill that out and save, it saving like this:

video: src\content\page\public\video\video-name.mp4
thumbnail: /src/assets/thumbnail.png
og_image: /src/assets/og_image.jpg

KaneFreeman avatar Nov 01 '23 12:11 KaneFreeman

It might be more helpful to know what you are attempting to accomplish.

Hey @KaneFreeman , sorry for digging this up, but the issue here is not with saving a file - it is with viewing already uploaded files in the media library.

I came onto this in my project (NextJS). Main config important parts:

{
  "media_folder": "public/cms",
  "public_folder": "cms",
  "collections": [
    {
      "name": "config",
      "files": [
        {
          "name": "test",
          "file": "src/data/test.json",
          "fields": [
            {
              "name": "list",
              "widget": "list",
              "fields": [
                {
                  "name": "slug",
                  "widget": "string"
                },
                {
                  "name": "image",
                  "widget": "image",
                  "allow_multiple": false,
                  "media_folder": "/public/images/test/{{fields.slug}}",
                  "public_folder": "images/test/{{fields.slug}}",
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

Result in media browser:

2024-07-28_00-05

I can see that media browser is doing post with data:

{"branch":"master","action":"getMedia","params":{"branch":"master","mediaFolder":"public/cms","publicFolder":"cms"}}

so it is referencing main media_folder directory and not the one from the collection.

The post response returns at least 3 results/images and media browser is not showing even them.

So the question here remains: what should media browser show in this case?

My guess is that it should show images only in the specified collection directory (here: /public/images/test/{{fields.slug}} ) as we are not allowed to put other values in the image field anyway - media browser is saving correctly to the collection media_folder directory.

elrender avatar Jul 27 '24 22:07 elrender