collective / volto-hydra

A volto addon to let you edit content in realtime when you have many frontends written in any framework
1 stars 2 forks source link

Uploading image directly from sidebar is broken #76

Open MAX-786 opened 3 months ago

MAX-786 commented 3 months ago

Extending #72

Currently directly uploading the image from the sidebar is currently broken. Until the image widget is fixed, we can upload the image on content page and then use object_browser to use that image.

MAX-786 commented 3 months ago

IDK where to put this so I am putting it here. Also, when using object_browser, this sends the api response like:

{
    "align": "center",
    "size": "l",
    "@type": "image",
    "image_scales": {
        "image": [
            {
                "content-type": "image/jpeg",
                "download": "@@images/image-848-11c80f8ca60933a4421a29c6b98ac2c8.jpeg",
                "filename": "IMG-20240627-WA0003.jpg",
                "height": 789,
                "scales": {
                    "icon": {
                        "download": "@@images/image-32-a04a7c2a13e0a8444932a43079871305.jpeg",
                        "height": 29,
                        "width": 32
                    }, ...// more scales
                "size": 19961,
                "width": 848
            }
          }
        ]
    },
    "url": "http://localhost:3000/img-20240627-wa0003.jpg"
}

So the url given above cannot be used in frontend for the <img> as it is, it needs to be formatted. So in order to have a valid url you can do this:

const image_url = data.blocks[id]?.image_scales ? `${data.blocks[id].url}/++api++/${data.blocks[id]?.image_scales.image[0].download}` : data.blocks[id].url;