How to add custom images in the Product image slider on the PDP and Quick View

We can use this solution to add a personalized images or custom images to the “ProductDetails.ImageGallery.View” on PDP and Quick view, to show on the slider on option selection

_.extend(ProductDetailsImageGalleryView.prototype, {
                    initialize: _.wrap(ProductDetailsImageGalleryView.prototype.initialize, function wrapInitialice(fn) {
                        fn.apply(this, _.toArray(arguments).slice(1));
                        let self = this;
                        pdp.on('afterOptionSelection', _.debounce(function (data) {
                            const defaultImages = item.item.itemimages_detail[pdp.getSelectedMatrixChilds()[0].custitem_jj_colour]?.urls || []; //default slider images
                            const customImages= [] //array of custom images with the object fotmat a { url: "image URL", altText: "Name"}
                            self.images = [...[customImages], ...defaultImages];
                            self.render();
                            self.initSliderZoom(true);
                            }
                        }, 250, false));
                    })
                })