Image is not rendering correctly when using ContentReference

Hi,

I am using following code to select image to display on page:

        [CultureSpecific]
        [Display(Name = "Right Sub Menu", GroupName = GroupNames.Properties.Content, Order = 90)]
        [UIHint(UIHint.Image)]
        public virtual ContentReference RightSection { get; set; }

This opensup a popup to select the image, but some times after selecting image it's not displayed imediately, infact a broken image is displayed. But after closing popup & reopening it displayes the selected image, also some times previously uploaded images are not rendered on frontend, but when i upload a new image it renders correctly in frontend. following is the code that i am using in frontend:

<div class="product-menu-alllist">
                        @if (TopItem.RightSection != null)
                        {
                            try
                            {
                                // Get the the MediaData object being rendered
                                var currentContent = !ContentReference.IsNullOrEmpty(TopItem.RightSection)
                                                        ? EPiServer.ServiceLocation.ServiceLocator.Current.GetInstance<EPiServer.IContentLoader>().Get<MediaData>(TopItem.RightSection)
                                                        : null;
                                if (currentContent is ImageFile) // Images should be rendered with an image tag and an alt text
                                {
                                    var image = (ImageFile)currentContent;<div class="banner-product-header"><img src="@UrlResolver.Current.GetUrl(image.ContentLink)" alt="@image.Description" class="img-fluid" /></div>                                    
                                }
                            }
                            catch { }
                        }</div>

Thanks