Lock post saving when media is being uploaded

[sndrgb]

Hi everybody, I need an help building a gutenberg block. I'm using MediaPlaceholder component as starting for add images (it's a carousel), but I have a lot of problems when I use the "load" button instead of "view library":

<MediaPlaceholder
                        icon="format-gallery"
                        className={ props.className }
                        labels={ {
                            title: __('Carousel'),
                            name: __('images'),
                        } }
                        onSelect={ onSelectImages }
                        accept="image/*"
                        type="image"
                        multiple
                    />

const onSelectImages = function(selectedImages) {
            const array = [ ...images, ...selectedImages ]
            const updatedImages = array.map((img, index) => {
                if (img.media_details) {
                    Object.assign(img, {
                        width: img.width,
                        height: img.height,
                        id: index,
                        imgid: img.id,
                    })
                }

                return Object.assign(img, { id: index })
            });

            setAttributes({ images: updatedImages });
        }

the big problem is that I cannot render on the save function images, because I need size of it and If the editor clicks "update article" before images loads async I cannot get img.media_details.sizes because it returns only an url with a blob like: {url: "blob:" }. what can I do?

[J0ker98]

I'm having the same problem

[paaljoachim]

Hi @sndrgb

Please recheck the issue.
Thanks!

[sndrgb]

I'll check it out soon, thanks a lot!

[adamsilverstein]

This should be fixed by #41120

[paaljoachim]

Thanks for letting us know in this thread Adam @adamsilverstein
I will go ahead and close this issue. It can always be reopened if that is needed.

[adamsilverstein]

Note: this is replaced by #39223