SharpRSS/WebSharpRSS/Shared/CategoryGuide.razor

@using CodeHollow.FeedReader
@using SharpRss.Models
@using ToolQit
@using ToolQit.Containers
@using ToolQit.Extensions
@using WebSharpRSS.Models;
<style>
    .cat-item {
        background: var(--background-color);
        width: 100%;
        display: flex;
        position: relative;
        box-sizing: border-box;
        text-align: start;
        align-items: center;
        padding-top: 8px;
        padding-bottom: 8px;
        padding-left: 12px;
        justify-content: flex-start;
        text-decoration: none;
    }
    .cat-item:hover {
        background: var(--hover-bg-color);
    }
    .cat-item-text {
        flex: 1 1 auto;
        min-width: 0;
    }
    .cat-item-icon {
        display: inline-flex;
        min-width: 56px;
        flex-shrink: 0;
    }
    
    .feed-item {
        background: var(--background-color);
        width: 100%;
        display: flex;
        position: relative;
        box-sizing: border-box;
        text-align: start;
        align-items: center;
        padding-top: 8px;
        padding-bottom: 8px;
        padding-left: 30px;
        justify-content: flex-start;
        text-decoration: none;
    }
    .feed-item:hover {
        background: var(--hover-bg-color);
    }
    .feed-item-text {
        flex: 1 1 auto;
        min-width: 0;
    }
    .feed-item-icon {
        display: inline-flex;
        min-width: 56px;
        flex-shrink: 0;
    }
    
</style>

<div>
    <MudText>@HeaderText</MudText>
    @foreach (GuideItemModel guideModel in GuideItems)
    {
        <GuideItem Model="@guideModel" ItemClicked="ItemClicked"/>
        #if false
        <div>
            <div @onclick="@(() => guideItem.ItemClick())" class="cat-item mud-ripple" style="--hover-bg-color: @Colors.Blue.Accent1; --background-color: @(guideItem.IsSelected ? Colors.Blue.Accent2 : "transparent")">
                <div class="cat-item-icon">
                    @if (guideItem.FaviconUrl != null)
                    {
                        <MudImage ObjectFit="ObjectFit.ScaleDown" Src="@guideItem.FaviconUrl" />
                    }
                    else
                    {
                        <MudIcon Class="pointer-events-none" Icon="@guideItem.Icon" Size="Size.Medium" />
                    }

                </div>
                <div class="cat-item-text">
                    <MudText Class="pointer-events-none" Typo="Typo.subtitle1">@guideItem.Title</MudText>
                </div>
            </div>
            @* Feeds *@
            @if (guideItem.IsExpanded && guideItem.Feeds != null)
            {
                foreach (FeedModel feed in guideItem.Feeds)
                {
                    if (feed == null || feed.Base == null) continue;
                    <div @onclick="() => ItemClicked(feed)" class="feed-item mud-ripple" style="--hover-bg-color: @Colors.Blue.Accent1; --background-color: @(feed.IsSelected ? Colors.Blue.Accent2 : "transparent")">
                        <div class="feed-item-icon">
                            @*@if (!guideFeed.FaviconUrl.IsNullEmptyWhiteSpace())
                                {
                                    <MudImage ObjectFit="ObjectFit.ScaleDown" Src="@guideFeed.FaviconUrl"/>
                                }
                                else
                                {
                                    <MudIcon Icon="@Icons.Material.Filled.RssFeed" Size="Size.Medium"/>
                                }*@
                            <MudIcon Icon="@Icons.Material.Filled.RssFeed" Size="Size.Medium"/>
                        </div>
                        <div class="feed-item-text">
                            <MudText Class="pointer-events-none">@feed.Base.Title</MudText>
                        </div>
                    </div>
                }
            }
        </div>
        #endif
    }
</div>

@code {
    [Parameter]
    public string HeaderText { get; set; } = string.Empty;
    [Parameter]
    public HashSet<GuideItemModel> GuideItems { get; set; } = new HashSet<GuideItemModel>();
    [Parameter]
    public Action<CategoryModel>? CatItemClicked { get; set; }
    [Parameter]
    public Action<FeedModel>? FeedItemClicked { get; set; }
    
    GuideItemModel? _selectedItem;

    void ItemClicked(GuideItemModel model)
    {
        model.IsExpanded = !model.IsExpanded;
        if (_selectedItem != model)
        {
            if (_selectedItem != null)
                _selectedItem.IsSelected = false;
            _selectedItem = model;
            _selectedItem.IsSelected = true;
        }
        if (model.Feeds != null && model.Feeds.Count >= 1)
        {
            if (model.CategoryModel != null)
                CatItemClicked?.Invoke(model.CategoryModel);
        }
        else
        {
            if (model.FeedModel != null)
                FeedItemClicked?.Invoke(model.FeedModel);
        }
    }
}