@using BlazorAnimation
@using TIAM.Core.Enums
@using TIAM.Entities.Profiles
@using TIAM.Entities.ServiceProviders
@using TIAM.Entities.Transfers
@using TIAM.Entities.Users
@using TIAM.Models.Dtos.Users
@using TIAM.Services
@using TIAMSharedUI.Shared.Components.Cards
@using TIAMWebApp.Shared.Application.Interfaces
@using TIAMWebApp.Shared.Application.Models.ClientSide.UI
@using TIAMWebApp.Shared.Application.Models.PageModels
@using TIAMWebApp.Shared.Application.Services
@inject IServiceProviderDataService ServiceProviderDataService
@inject IUserDataService UserDataService
@inject AdminSignalRClient AdminSignalRClient
@inject IJSRuntime JsRuntime

<div class="e-card cw-480">
    <div class="e-main d-flex align-items-center">
        <div class="flex-shrink-0">
            <img class="e-photo" src="_content/TIAMSharedUI/images/defaultavatar_60.png" alt="" />
        </div>
        <div class="e-info flex-grow-1 ms-3">
            <div class="e-name">@($"{Company.Name}")</div>
            <p class="e-title"><i class="fa-solid fa-at"></i> @Company.Profile.EmailAddress</p>
            <p class="e-title"><i class="fa-solid fa-location-dot"></i> @Company.Profile.Address.AddressText</p>
        </div>
    </div>

    <hr class="hr" />

    <div class="row">
        <div class="col-12 col-md-6">
            <h4>Information</h4>
            @RenderDetailsItem("fa-solid fa-user", "Contact Name", Company.Profile.Name)
            @RenderDetailsItem("fa-solid fa-circle-info", "Description", Company.Profile.Description ?? string.Empty)
        </div>

        <div class="col-12 col-md-6">
            <h4>Services in this company</h4>
            @{
                if (Company.Products.Count > 0)
                {

                    <DxAccordion SizeMode="@SizeMode.Small" ExpandMode="ExpandMode"
                                 ExpandCollapseAction="ExpandCollapseAction"
                                 AnimationType="LayoutAnimationType.Slide">
                        <Items>
                            @foreach (var item in Company.Products)
                            {
                                <DxAccordionItem Text=@($"{item.Name}")>
                                    
                                    <ContentTemplate>
                                        <div class="py-3 px-3">
                                            <ProductCardComponent DataChanged="RefreshComponent" Product="@item" />
                                        </div>
                                    </ContentTemplate>
                                </DxAccordionItem>
                            }
                        </Items>
                    </DxAccordion>

                }
            }
        </div>
       
        <p>@_msg</p>
    </div>
</div>


@code {
    [Parameter] public required Company Company { get; set; }

    [Parameter] public EventCallback<string> DataChanged { get; set; }

    AccordionExpandMode ExpandMode { get; set; } = AccordionExpandMode.SingleOrNone;
    AccordionExpandCollapseAction ExpandCollapseAction { get; set; } = AccordionExpandCollapseAction.HeaderClick;

    string _msg;
    private bool _isSaveActive = false;

    //private Profile _companyProfile = new Profile();

    void OnPasswordConfirmed(string password)
    {


    }

    protected async Task ChangeName()
    {

        _isSaveActive = false;


        await DataChanged.InvokeAsync(_msg);
    }



    protected override async Task OnInitializedAsync()
    {
        //_companyProfile = Company.Profile;
        // var companyProfiles = await AdminSignalRClient.GetByIdAsync<List<Profile>>(SignalRTags.GetProfileById, Company.ProfileId);
        // if (companyProfiles != null)
        // {            
        //     _companyProfile = companyProfiles[0];
        // }

        await base.OnInitializedAsync();
    }

    protected override async Task OnParametersSetAsync()
    {

        await base.OnParametersSetAsync();
    }

    RenderFragment RenderDetailsItem(string iconCssClass, string caption, string value)
    {
       
        return @<div class="d-flex m-1 align-items-center">
        <div class="icon-container flex-shrink-0">
            <span class="dxbl-image m-1 @iconCssClass"></span>
        </div>
        <div class="text-container m-1 flex-grow-1 ms-2">
            <label>@caption:</label>
            <div>@value</div>
        </div>
    </div>;
    }

    private void RefreshComponent()
    {
        StateHasChanged();
    }
}