View Component Loading Issue on Production ASP.NET Core

Question

I am working on an application where I want to load View Component. On local machine it is working with out any problem or error but when I make deployment it is not working properly and gives me error of 500. Here is my implementation.

Jquery Function

function UPdateHistoryGrid() {
   
    $("#notification-history").empty();
    var _url = '@Url.Action("NotificationHistory", "Notification")';
    $.ajax({
        type: "GET",
        url: _url,           
        success: function (result) {
            $("#notification-history").html(result);
        },
        error(res) {
            console.log(res)
        }
    });
      
};

Controller action method

     public IActionResult NotificationHistory()
            {
                return ViewComponent("NotificationHistory");
            }

View Component .cs

public class NotificationHistoryViewComponent : ViewComponent
    {
   
        protected readonly IHttpNetClientService _apiService;
        IUserProfileInfoProvider _userInfoProvider;

        public NotificationHistoryViewComponent(IHttpNetClientService HttpService,
            IUserProfileInfoProvider userInfo)
        {
            _apiService = HttpService;
            _userInfoProvider = userInfo;
        }
        public async Task<IViewComponentResult> InvokeAsync()
        {
            var model = new NotificationParentModel();           
            var NotificationApiJsonResult = await _apiService.GetAllAsync(Notification_API_URL.GetAllNotificationsHistory.GetEnumDescription(), _userInfoProvider.GetUserInfo().Id, _userInfoProvider.GetToken());
            var notificationData = JsonConvert.DeserializeObject<ResponseDTO<IEnumerable<GMDNotificationDTO>>>(NotificationApiJsonResult);
           
            model.NotificaitonList = notificationData.Data.ToList();           
            return await Task.FromResult((IViewComponentResult)View("NotificationHistory", model));
        }
    }

View Code

@using GMDSuperAdmin.Helper
@model GMDSuperAdmin.Models.NotificationParentModel

<div class="notificationCard-Container text-container @(!Model.IsToday ? "mt-5" : "") bg-white px-0">
    <div class="position-relative">
        <h5 class="text-center py-3">Notification History</h5>
    </div>

    @{
        if (Model.NotificaitonList.Count() > 0)
        {
            foreach (var item in Model.NotificaitonList)
            {
                <div class="row message-row message-row-2 mx-0 py-1" id="clickable-row">
                   
                    <div class="row mx-0 main-notificationRow justify-content-between" id="translate-row" @*onclick="selectedNotification(this, @item.NOtificationId)"*@>
                        <div class="d-flex align-items-center py-2">
                            <div class="notification-list_img document-noti mx-2 mt-1 mx-lg-3">
                                <i class="fas fa-file-alt"></i>
                            </div>

                            <div class="notifierInfo">
                                <p class="message-paragraph mb-0">
                                    @item.NotificationDescription
                                </p>
                            </div>
                        </div>
                        
                        <div class="notification-time pt-1 pb-2 mx-2">
                            <p class="message-paragraph text-right mb-0">
                                @(DateTimeHelper.TimeAgo(item.CreatedDate))
                            </p>
                        </div>
                    </div>
                </div>
            }
        }
        else
        {
            <div class="row message-row py-1 mx-0" id="clickable-row">

                <div class="row mx-0 main-notificationRow" id="translate-row">
                    <div class="col-12 col-lg-12">
                        <p class="message-paragraph text-muted mb-0 text-center">
                            <b>No Notification Found!</b>
                        </p>
                    </div>
                </div>
            </div>
        }
    }

</div>

Answer 1

Please rename your view component as default. NotificatioHistory.cshtml to Default.cshtml. Some time it makes issues with custom names on production so the recommended way is to use Default.cshtml.

public class NotificationHistoryViewComponent : ViewComponent
{
    protected readonly IHttpNetClientService _apiService;
    IUserProfileInfoProvider _userInfoProvider;

    public NotificationHistoryViewComponent(IHttpNetClientService HttpService,
        IUserProfileInfoProvider userInfo)
    {
        _apiService = HttpService;
        _userInfoProvider = userInfo;
    }
    public async Task<IViewComponentResult> InvokeAsync()
    {
        var model = new NotificationParentModel();           
        var NotificationApiJsonResult = await _apiService.GetAllAsync(Notification_API_URL.GetAllNotificationsHistory.GetEnumDescription(),
            _userInfoProvider.GetUserInfo().Id, _userInfoProvider.GetToken());
        var notificationData = JsonConvert.DeserializeObject<ResponseDTO<IEnumerable<GMDNotificationDTO>>>(NotificationApiJsonResult);
       
        model.NotificaitonList = notificationData.Data.ToList();           
        return View(model); //// Change this ... 
    }
}