@using Insight.Web.Models.Account;

<MudDrawer @bind-Open="_visible" Anchor="Anchor.End" Elevation="0" Variant="@DrawerVariant.Temporary" ClipMode="DrawerClipMode.Always" Width="400px" Style="max-width:auto;">
    <MudDrawerHeader>
        <MudText Typo="Typo.h6">
            Password
        </MudText>
    </MudDrawerHeader>
    <MudStack Justify="Justify.Center" Class="px-6">
        <EditForm Model="@_model" OnValidSubmit="()=>Submit(_model)">
            <DataAnnotationsValidator />
            <MudStack Justify="Justify.Center" Spacing="5">
                <MudItem>
                    <MudTextField Label="Current" Variant="Variant.Text" @bind-Value="_model.OldPassword" For="()=>_model.OldPassword"
                                  Margin="Margin.Dense" InputType="@(_passwordCurrentVisible ? InputType.Text : InputType.Password)"
                                  Adornment="Adornment.End" AdornmentIcon="@(_passwordCurrentVisible ? Icons.Material.Filled.VisibilityOff : Icons.Material.Filled.Visibility)"
                                  OnAdornmentClick="()=>_passwordCurrentVisible = !_passwordCurrentVisible" />
                </MudItem>
                <MudItem>
                    <MudTextField Label="New" Variant="Variant.Text" @bind-Value="_model.NewPassword" For="()=>_model.NewPassword"
                                  Margin="Margin.Dense" InputType="@(_passwordNewVisible ? InputType.Text : InputType.Password)"
                                  Adornment="Adornment.End" AdornmentIcon="@(_passwordNewVisible ? Icons.Material.Filled.VisibilityOff : Icons.Material.Filled.Visibility)"
                                  OnAdornmentClick="()=>_passwordNewVisible = !_passwordNewVisible" />
                </MudItem>
                <MudItem>
                    <MudTextField Label="Confirm New" Variant="Variant.Text" @bind-Value="_model.ConfirmNewPassword" For="()=>_model.ConfirmNewPassword"
                                  Margin="Margin.Dense" InputType="@(_passwordCofirmVisible ? InputType.Text : InputType.Password)"
                                  Adornment="Adornment.End" AdornmentIcon="@(_passwordCofirmVisible ? Icons.Material.Filled.VisibilityOff : Icons.Material.Filled.Visibility)"
                                  OnAdornmentClick="()=>_passwordCofirmVisible = !_passwordCofirmVisible" />
                </MudItem>
                <MudItem Class="d-flex justify-center mt-7">
                    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Secondary" Size="Size.Large" DisableElevation Style="width: 100%;">
                        Change Password
                    </MudButton>
                </MudItem>
            </MudStack>
        </EditForm>
    </MudStack>
</MudDrawer>

@code{
    private bool _visible;

    private bool _passwordCurrentVisible;
    private bool _passwordNewVisible;
    private bool _passwordCofirmVisible;

    private ChangePasswordModel _model = new();

    public void Toggle()
    {
        _visible = !_visible;
        StateHasChanged();
    }
}