@using Microsoft.Extensions.Options
@using OpenArchival.Blazor.Config
@using OpenArchival.Blazor.Theme

@inherits LayoutComponentBase

@inject IOptions<ApplicationOptions> Options;
@inject NavigationManager NavigationManager;

<MudThemeProvider Theme="AppThemeFactory.GetTheme()"/>
<MudPopoverProvider />
<MudDialogProvider />
<MudSnackbarProvider />

<MudLayout Style="min-height: 100vh; display: flex; flex-direction: column;">
    <MudAppBar Elevation="1" >
            @if (!string.IsNullOrEmpty(Options.Value.NavBarTitle)) {
                <MudNavLink Href="/" Style="max-width:400px;">
                    <MudText Typo="Typo.h6" Class="ml-3">@Options.Value.NavBarTitle</MudText>
                </MudNavLink>
            }
            <MudSpacer/>
            <div class="d-flex d-md-none">
                <MudMenu Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" AnchorOrigin="Origin.BottomRight" TransformOrigin="Origin.TopRight">
                    <MudMenuItem Icon="@Icons.Material.Filled.Home" IconColor=Color.Secondary Href="/">Home</MudMenuItem>
                    <MudMenuItem Icon="@Icons.Material.Filled.Star" IconColor=Color.Secondary Href="/featured">Featured</MudMenuItem>
                    <MudMenuItem Icon="@Icons.Material.Filled.Search" IconColor=Color.Secondary Href="/search">Artifacts</MudMenuItem>
                    <MudMenuItem Icon=@Icons.Material.Filled.Book Href="/articles/search"  IconColor=Color.Secondary>Articles</MudMenuItem>
                    <MudMenuItem Href="/about" Icon=@Icons.Material.Filled.QuestionMark IconColor="Color.Secondary">About</MudMenuItem>
                </MudMenu>
            </div>


            <div class="justify-center align-center d-none d-md-flex gap-4">
                <MudNavLink 
                    Icon="@Icons.Material.Filled.Star" 
                    IconColor=Color.Secondary 
                    Ripple=true 
                    Style="max-width:200px;"
                    Href="/featured">
                    Featured 
                </MudNavLink>

                <MudNavLink 
                    Icon="@Icons.Material.Filled.Search" 
                    IconColor=Color.Secondary 
                    Ripple=true 
                    Style="max-width:200px;"
                    Href="/search">
                    Artifacts 
                </MudNavLink>
                
                <MudNavLink Href="/articles/search" Icon=@Icons.Material.Filled.Book IconColor=Color.Secondary Ripple=true Style="max-width: 200px">
                    Articles 
                </MudNavLink>

                <MudNavLink Href="/about" Icon=@Icons.Material.Filled.QuestionMark IconColor="Color.Secondary" Ripple=true Style="max-width:200px;">
                    About 
                </MudNavLink>

                <MudSpacer></MudSpacer>
                <div style="background-color: white; border-radius:10px;" class="pa-2">
                    <MudAutocomplete 
                         Placeholder="Search Archive"
                         T="string"
                         Variant="Variant.Filled | Variant.Outlined"
                         AdornmentIcon="@Icons.Material.Filled.Search"
                         Dense=true
                         Underline=false
                         Style="width:200px; --mud-input-text: white; --mud-input-label-text: white;" 
                         OnKeyDown="OnSearchBarKeyDown"
                         SearchFunc="Search"
                         @bind-Text=_searchBarText/>
                </div>
            </div>

                </MudAppBar>
    <MudMainContent Class="pt-16 pa-4">
        @Body
    </MudMainContent>

    <MudPaper Elevation="0" Class="pa-8 mt-auto" Style="background-color: var(--mud-palette-appbar-background); color: var(--mud-palette-appbar-text); border-radius: 0;">
        <MudContainer MaxWidth="MaxWidth.Large">
            <MudGrid Justify="Justify.Center">
                <MudItem xs="12" sm="8" Class="d-flex flex-wrap gap-4 justify-center justify-sm-start align-center">
                    <MudLink Href="/" Color="Color.Inherit">Home</MudLink>
                    <MudLink Href="/featured" Color="Color.Inherit">Featured</MudLink>
                    <MudLink Href="/search" Color="Color.Inherit">Artifacts</MudLink>
                    <MudLink Href="/articles/search" Color="Color.Inherit">Articles</MudLink>
                    <MudLink Href="/about" Color="Color.Inherit">About</MudLink>
                </MudItem>
                <MudItem xs="12" sm="4" Class="d-flex justify-center justify-sm-end align-center">
                    <a href="https://www.linkedin.com/in/vincenttallen/">Development by Vincent Allen</a>
                </MudItem>
            </MudGrid>
        </MudContainer>
    </MudPaper>
</MudLayout>


<div id="blazor-error-ui" data-nosnippet>
    An unhandled error has occurred.
    <a href="." class="reload">Reload</a>
    <span class="dismiss">🗙</span>
</div>

@code {
    private bool _drawerOpen = true;

    private string _searchBarText = "";
    private void OnSearchBarKeyDown(KeyboardEventArgs args)
    {
        if (args.Key == "Enter" && !string.IsNullOrEmpty(_searchBarText))
        {
            NavigationManager.NavigateTo($"/search/{System.Web.HttpUtility.UrlEncode(_searchBarText)}");
            _searchBarText = "";
        } 
    }

    private Task<IEnumerable<string>> Search(string value, CancellationToken token)
    {
        return Task.FromResult<IEnumerable<string>>([]);
    }
}