@inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.PageViewModel>
@using System
@using Dynamicweb.Frontend
@using Dynamicweb.Frontend.Devices
@using Dynamicweb.Ecommerce.ProductCatalog
@using Dynamicweb.Ecommerce.Products
@using Dynamicweb.Ecommerce.Frontend.Cart

@using Dynamicweb.Security.UserManagement
@using Dynamicweb.Frontend.Navigation

@MasterPageFile("Swift-v2_Master.cshtml")

@{
    bool isContentOnly = Dynamicweb.Core.Converter.ToBoolean(Dynamicweb.Context.Current?.Request.QueryString.Get("ContentOnly") ?? "false");
    // Page headers
    LinkViewModel headerLink;
    if (!isContentOnly && ((Pageview.Device == DeviceType.Desktop && (Model.Area?.Item?.TryGetLink("HeaderDesktop", out headerLink) ?? false)) ||
    !isContentOnly && (Pageview.Device == DeviceType.Mobile || Pageview.Device == DeviceType.Tablet) && (Model.Area?.Item?.TryGetLink("HeaderMobile", out headerLink) ?? false)))
    {
        string? headerCss = null;
        var headerPage = ContentViewModelFactory.CreatePageInfoViewModel(Dynamicweb.Content.Services.Pages.GetPage(headerLink.PageId));
        if ((headerPage.Item?.TryGetString("HeaderPosition", out string headerPosition) ?? false) && !headerPosition.Equals("static", StringComparison.OrdinalIgnoreCase))
        {
            headerCss = headerPosition;
        }
        <header data-swift-page-header="@(headerLink.PageId)" class="@headerCss d-print-none" data-dw-colorscheme="@headerPage.ColorScheme?.Id">
            @RenderGrid(headerLink.PageId)
        </header>
    }

    var sidebarNav = Navigation.GetNavigationViewModel(new() {
        StartLevel = 2,
        StopLevel = 5,
        ExpandMode = ExpandMode.All
    });

    async Task RenderNavItem(NavigationTreeNodeViewModel node, bool isGroupNode = false)
    {
        var pageIcon = string.Empty;
        var nodePage = Dynamicweb.Content.Services.Pages.GetPage(node.PageId);
        if (nodePage?.PropertyItem?.TryGetValue("Icon", out object? pageIconValue) ?? false)
        {
            pageIcon = Dynamicweb.Core.Converter.ToString(pageIconValue);
        }
        bool isGroupHeader = isGroupNode && node.Nodes.Any();

        
        if (isGroupHeader)
        {
            <h6 class="fs-8 mb-2 text-muted mt-3 text-uppercase"><a class="text-muted @(node.IsClickable ? "text-decoration-underline" : "text-decoration-none") @(node.IsActive ? "active fw-bold" : null)" aria-current="@(node.IsActive)" href="@(node.IsClickable ? node.Link : null)">@(node.Name)</a></h6>
            
            foreach (var subnode in node.Nodes.Where(n => n.ShowInMenu))
            {
                await RenderNavItem(subnode);
            }
            
            <span class="d-block mt-3"></span>
        }
        
        else
        {
            <a class="list-group-item list-group-item-action rounded hstack gap-2 @(node.IsActive ? "active" : null) @(!node.IsClickable ? "disabled" : null)" aria-current="@(node.IsActive)" href="@(node.IsClickable ? node.Link : null)" disabled="@(!node.IsClickable)">
                @if (pageIcon.EndsWith(".svg", StringComparison.OrdinalIgnoreCase))
                {
                    <span class="icon-2">@ReadFile(pageIcon)</span>
                }
                <span>@node.Name</span>
                @if (node.Nodes.Any())
                {
                    <span class="icon-2 ms-auto">@ReadFile("/Files/Images/Icons/chevron-right.svg")</span>
                }
            </a>
            
            @if(node.InPath && node.Nodes.Any()) 
            {
                <div class="border-3 border-start ps-2">
                    @foreach (var subnode in node.Nodes.Where(n => n.ShowInMenu))
                    {
                        await RenderNavItem(subnode);
                    }           
                </div>
            }
        }
    }
}

<main id="content" data-swift-customer-center data-dw-colorscheme="@(Model.ColorScheme?.Id ?? Model.Area?.ColorScheme?.Id)">
	
	<div data-swift-container class="grid row-gap-0 py-3 py-lg-5">

		<aside class="g-col-12 g-col-lg-4 g-col-xl-3 d-none d-lg-block pe-lg-4">
            
            @if (Model.CurrentUser is not null)
            {
                @RenderPartial("Users/UserView/Detail/UserInfo.cshtml", Model.CurrentUser)
            }
            
            @if (sidebarNav?.Nodes?.Any() ?? false)
            {
                <nav class="list-group gap-1 fs-7 rounded-0 pt-1" style="--bs-border-width: 0;" role="navigation">
                    @foreach (var node in sidebarNav.Nodes.Where(n => n.ShowInMenu))
                    {
                        await RenderNavItem(node, (sidebarNav.Nodes.Count(n => (n.Nodes.Any())) > 0));
                    }
                </nav>
            }

            @if (Model.CurrentUser is not null)
            {			
                <span class="border-top d-block mb-3"></span>
                <nav class="list-group gap-1 fs-7 pt-1" role="navigation" style="--bs-list-group-border-width: 0;">

                    @if (UserContext.Current.ImpersonatingUser != null)
                    {
                        <a href="Default.aspx?ID=@(Model.ID)&DwExtranetRemoveSecondaryUser=1" class="list-group-item list-group-item-action rounded hstack gap-2">
                            <span class="icon-2">@ReadFile("/Files/Images/Icons/arrows-repeat.svg")</span>
                            <span>
                                @Translate("Switch back to") @(UserContext.Current.ImpersonatingUser.Name)
                            </span>
                        </a>
                    }
                    <a href="/Admin/Public/ExtranetLogoff.aspx?redirect=no" class="list-group-item list-group-item-action rounded hstack gap-2">
                        <span class="icon-2">@ReadFile("/Files/Images/Icons/arrow-left-from-bracket.svg")</span>
                        @Translate("Sign out")
                    </a>
                </nav>
            }
           
		</aside>

		<div class="g-col-12 g-col-lg-8 g-col-xl-9">
			@Model.Grid("Grid", "Grid", "default:true;sort:1", "Page")
		</div>

	</div>
	
</main>

@{ // Page footers
    LinkViewModel footerLink;
    if (!isContentOnly && ((Pageview.Device == DeviceType.Desktop) && (Model.Area?.Item?.TryGetLink("FooterDesktop", out footerLink) ?? false)) ||
    !isContentOnly && ((Pageview.Device == DeviceType.Mobile || Pageview.Device == DeviceType.Tablet) && (Model.Area?.Item?.TryGetLink("FooterMobile", out footerLink) ?? false)))
    {
        var footerPage = ContentViewModelFactory.CreatePageInfoViewModel(Dynamicweb.Content.Services.Pages.GetPage(footerLink.PageId));
        <footer class="d-print-none" data-swift-page-footer="@(footerLink.PageId)" data-dw-colorscheme="@footerPage.ColorScheme?.Id">
            @RenderGrid(footerLink.PageId)
        </footer>
    }
}

@if (isContentOnly)
{    
    return;
}

@* Cart command results *@
@{
    var cartResult = Model.Cart?.GetCartCommandResult();
}

<div id="swiftCartResult" hx-swap-oob="true outerHTML:#swiftCartResult">
    @if (cartResult != null && cartResult.Messages.Any())
    {
        foreach (var message in cartResult.Messages)
        {
            <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
                <div class="toast toast-animate-in" role="alert" aria-live="assertive" aria-atomic="true" x-data="" x-init="const toast = new bootstrap.Toast($el, { autohide: true, delay: 5000 }); toast.show();">
                    <div class="toast-header">
                        <strong class="me-auto d-flex gap-2">
                            @if (message.IsSuccess) {
                                <div class="icon-2 text-success">
                                    @ReadFile("/Files/Images/Icons/circle-check.svg")
                                </div>
                            } else {
                                <div class="icon-2 text-danger">
                                    @ReadFile("/Files/Images/Icons/exclamation-triangle.svg")
                                </div>
                            }
                            @Translate($"{message.ResultType.ToString()}_Title")
                        </strong>
                        @if (!string.IsNullOrEmpty(message.Name)) {
                            <small>@message.Name</small>
                        }
                        else if (!string.IsNullOrEmpty(message.Id)) {
                            <small>@message.Id</small>
                        }
                        <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
                    </div>
                    <div class="toast-body">
                        @Translate($"{message.ResultType.ToString()}_Text")
                    </div>
                </div>
            </div>
        }
    }
</div>

@* Favorite toast *@
<div aria-live="polite" aria-atomic="true" data-dw-colorscheme="@(Model.Area?.ColorScheme?.Id ?? "light")">
    <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
        <div id="favoriteNotificationToast" class="toast toast-animate-in" role="alert" aria-live="assertive" aria-atomic="true">
            <div class="toast-header">
                <strong class="me-auto">@Translate("Favorite list updated")</strong>
                <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="@Translate("Close")"></button>
            </div>
            <div class="toast-body d-flex gap-3">
                <div id="favoriteNotificationToast_Image"></div>
                <div id="favoriteNotificationToast_Text"></div>
            </div>
        </div>
    </div>
</div>

@* Modal for dynamic content *@
<div class="modal fade js-product" id="DynamicModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-md">
        <div class="modal-content" id="DynamicModalContent" data-dw-colorscheme="@(Model.Area?.ColorScheme?.Id ?? "light")">
            @* The content here comes from an external request *@
        </div>
    </div>
</div>

@* Offcanvas for dynamic content *@
<div class="offcanvas offcanvas-end border-0" tabindex="-1" id="DynamicOffcanvas" data-dw-colorscheme="@(Model.Area?.ColorScheme?.Id ?? "light")">
    @* The content here comes from an external request *@
</div>