@using Netina.AdminPanel.PWA.Pages
@using Radzen.Blazor
@using Netina.AdminPanel.PWA.Models

@inherits LayoutComponentBase
@inject NavigationManager NavigationManager
@inject IUserUtility UserUtility
@inject IBrowserViewportService BrowserViewportService
<style>

    body .pwa-updater[b-pwa-updater] {
        --pwa-updater-bar-height: 40px;
        --pwa-updater-font-size: 16px;
        --pwa-updater-bar-color: rgba(253, 216, 53, 1);
        --pwa-updater-bar-backcolor: #444;
        padding-top: 35px;
        padding-right: 10px;
        padding-bottom: 35px;
        padding-left: 10px;
    }

    body .pwa-updater-updatenow-button {
        border: dashed 2px rgba(253, 216, 53, 1) !important;
        font-family: iranyekan !important;
        font-weight: 800 !important;
    }

    body .pwa-updater-close-button {
        color: #fff !important;
    }

</style>

<AuthorizeView>

    <Authorized>

        <MudRTLProvider RightToLeft="true">
            <MudThemeProvider IsDarkMode="@MainTheme.IsDarkMode" Theme="@MainTheme.MyCustomTheme" />
            <MudDialogProvider />
            <MudSnackbarProvider />

            <MudLayout>
                <MudAppBar Elevation="1" class="py-2">
                    <MudHidden Breakpoint="Breakpoint.MdAndUp">
                        <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" OnClick="@ToggleDrawer" Edge="Edge.Start"/>
                    </MudHidden>


                    <RadzenGravatar class="h-14 w-14" Email="@_user?.Email"/>
                    <MudStack class="mr-2" Spacing="0">
                        <MudText Color="Color.Inherit" Typo="Typo.body1"><b>@_user?.FullName</b></MudText>
                        <MudText Color="Color.Inherit" Typo="Typo.caption">@_user?.PhoneNumber</MudText>
                    </MudStack>
                    <MudSpacer/>
                    <MudToggleIconButton @bind-Toggled="@MainTheme.IsDarkMode"
                                         Icon="@Icons.Material.Outlined.DarkMode" Color="@Color.Default" Title="تاریک"
                                         ToggledIcon="@Icons.Material.Filled.LightMode" ToggledColor="@Color.Default" ToggledTitle="روشن"/>
                    <MudIconButton Size="Size.Medium" Color="Color.Error" OnClick="LogoutAsync" Icon="@Icons.Material.Outlined.ExitToApp"/>
                </MudAppBar>
                <MudDrawer @bind-Open="open" ClipMode="DrawerClipMode.Always" Elevation="2">
                    <SideBarUi />
                </MudDrawer>
                <MudMainContent class="bg-[--mud-palette-background-grey] h-screen overflow-y-auto">
                    @Body
                </MudMainContent>
            </MudLayout>
        </MudRTLProvider>

        @* <MudRTLProvider RightToLeft="true">
        <MudThemeProvider IsDarkMode="@MainTheme.IsDarkMode" Theme="@MainTheme.MyCustomTheme"/>
        <MudDialogProvider/>
        <MudSnackbarProvider/>
        <MudLayout>
        <MudAppBar class="py-2" Color="Color.Transparent" Fixed="false" Elevation="2">
        <MudHidden Breakpoint="Breakpoint.MdAndUp">
        <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" OnClick="@ToggleDrawer" Edge="Edge.Start"/>
        </MudHidden>


        <RadzenGravatar class="h-14 w-14" Email="@_user?.Email"/>
        <MudStack class="mr-2" Spacing="0">
        <MudText Color="Color.Inherit" Typo="Typo.body1"><b>@_user?.FullName</b></MudText>
        <MudText Color="Color.Inherit" Typo="Typo.caption">@_user?.PhoneNumber</MudText>
        </MudStack>
        <MudSpacer/>
        <MudToggleIconButton @bind-Toggled="@MainTheme.IsDarkMode"
        Icon="@Icons.Material.Outlined.DarkMode" Color="@Color.Default" Title="تاریک"
        ToggledIcon="@Icons.Material.Filled.LightMode" ToggledColor="@Color.Default" ToggledTitle="روشن"/>
        <MudIconButton Size="Size.Medium" Color="Color.Error" OnClick="LogoutAsync" Icon="@Icons.Material.Outlined.ExitToApp"/>
        </MudAppBar>

        <MudDrawer @bind-Open="@open" ClipMode="DrawerClipMode.Always" Breakpoint="Breakpoint.MdAndUp" Elevation="1" Variant="@DrawerVariant.Responsive">
        <SideBarUi/>
        </MudDrawer>

        <MudMainContent class="h-screen">
        @Body
        </MudMainContent>
        </MudLayout>
        <div dir="ltr">
        <PWAUpdater Align="PWAUpdater.Aligns.Buttom" Text="@_updateText" ButtonCaption="اپدیت کنید"/>
        </div>
        </MudRTLProvider> *@
    </Authorized>

    <NotAuthorized>
        <MudRTLProvider RightToLeft="true">
            <MudThemeProvider Theme="@MainTheme.MyCustomTheme" />
            <MudDialogProvider />
            <MudSnackbarProvider />

            <MudLayout>
                <div>
                    <LoginPage />
                    <div dir="ltr">
                        <PWAUpdater Text="@_updateText" ButtonCaption="اپدیت کنید" />
                    </div>
                </div>
            </MudLayout>
        </MudRTLProvider>
    </NotAuthorized>

</AuthorizeView>

@code
{

    private string _updateText = "! نسخه جدید پنل ادمین رسید";
    private ApplicationUserSDto? _user;
    bool open = false;
    void ToggleDrawer() => open = !open;
    private async Task LogoutAsync()
    {
        await UserUtility.LogoutAsync();
        NavigationManager.NavigateTo("login", true, true);
    }

    protected override void OnInitialized()
    {
        string? version = typeof(Program)?.Assembly.GetName()?.Version?.ToString();
        if (version != null)
            _updateText = $"نسخه جدید پنل ادمین رسید - {version}";

        base.OnInitialized();
    }

    protected override async Task OnInitializedAsync()
    {
        var screen = await BrowserViewportService.GetCurrentBreakpointAsync();
        if (screen > Breakpoint.Md)
            open = true;
        _user = await UserUtility.GetUserAsync();
        await base.OnInitializedAsync();
    }
}