IW4M-Admin/WebfrontCore/Views/Shared/_SideContextMenu.cshtml

@model WebfrontCore.ViewModels.SideContextMenuItems
@{ Layout = null; }

<div class="d-none d-lg-flex col-3">
        <div class="on-this-page-nav pt-0" style="margin-left: 3rem;">
            <div>
                <div class="title">@Model.MenuTitle</div>

                @{
                    var groupedItems = Model.Items.Where(item => item.IsCollapse)
                        .GroupBy(item => item.Meta)
                        .ToList();
                    var index = 0;
                }

                @foreach (var item in Model.Items.Where(item => !item.IsCollapse))
                {
                    <a href="@(item.IsLink ? item.Reference : "#")" class="@(item.IsLink ? "" : "profile-action")" data-action="@(item.IsLink ? "" : item.Reference)" data-action-id="@item.EntityId" data-action-meta="@item.Meta">
                        <div class="@(item.IsButton ? "btn btn-block" : "")" data-title="@item.Tooltip" data-placement="left" data-toggle="@(string.IsNullOrEmpty(item.Tooltip) ? "" : "tooltip")">
                            <i class="@(string.IsNullOrEmpty(item.Icon) ? "" : $"oi {item.Icon}") mr-5 font-size-12"></i>
                            <span class="@(item.IsActive ? "text-primary" : "") text-truncate">@item.Title</span>
                        </div>
                    </a>
                }
                
                @foreach (var group in groupedItems)
                {
                    <details class="collapse-panel mt-0 pb-10 pt-10 pl-20 border-left" @(index == 0 ? "open" : "")>
                        <summary class="collapse-header">
                            @ViewBag.Localization[$"GAME_{group.Key}"]
                        </summary>
                        <div class="collapse-content" style="overflow: scroll; max-height: 30rem; max-width:350px;">
                            @foreach (var item in group)
                            {
                                <a href="@(item.IsLink ? item.Reference : "#")" style="border: 0; padding: 0;" class="@(item.IsLink ? "" : "profile-action")" data-action="@(item.IsLink ? "" : item.Reference)" data-action-id="@item.EntityId" data-action-meta="@item.Meta">
                                    <div class="@(item.IsButton ? "btn btn-block" : "")" data-title="@item.Tooltip" data-placement="left" data-toggle="@(string.IsNullOrEmpty(item.Tooltip) ? "" : "tooltip")">
                                        <i class="@(string.IsNullOrEmpty(item.Icon) ? "" : $"oi {item.Icon}") mr-5 font-size-12"></i>
                                        <span class="@(item.IsActive ? "text-primary" : "") text-truncate">@item.Title</span>
                                    </div>
                                </a>
                            }
                        </div>
                    </details>
                    index++;
                }
            </div>
        </div>
</div>

<div class="modal" id="contextMenuModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-content">
                <div class="content-title">@Model.MenuTitle</div>
                <hr/>
                @foreach (var item in Model.Items)
                {
                    <div class="mt-15 mb-15">
                        <a href="@(item.IsLink ? item.Reference : "#")" class="@(item.IsLink ? "" : "profile-action") no-decoration" data-action="@(item.IsLink ? "" : item.Reference)" data-action-id="@item.EntityId" data-action-meta="@item.Meta">
                            <div class="btn btn-block btn-lg @(item.IsActive ? "btn-primary" : "") text-truncate" data-title="@item.Tooltip" data-toggle="@(string.IsNullOrEmpty(item.Tooltip) ? "" : "tooltip")">
                                <i class="@(string.IsNullOrEmpty(item.Icon) ? "" : $"oi {item.Icon}") mr-5 font-size-12"></i>
                                <span>@item.Title</span>
                            </div>
                        </a>
                    </div>
                }
                <hr/>
                <button class="btn btn-lg btn-danger btn-block mt-15" data-dismiss="modal" type="button">@ViewBag.Localization["WEBFRONT_CONTEXT_MENU_BUTTON_CLOSE"]</button>
            </div>
        </div>
    </div>
</div>