Implementing side guide.

This commit is contained in:
Max 2023-04-29 19:40:16 +02:00
parent 40a61d5396
commit fd72011480
2 changed files with 46 additions and 27 deletions

View File

@ -9,6 +9,8 @@
<ItemGroup>
<PackageReference Include="CodeHollow.FeedReader" Version="1.2.6" />
<PackageReference Include="Serilog" Version="2.12.0" />
<PackageReference Include="Serilog.Sinks.Console" Version="4.1.0" />
</ItemGroup>
</Project>

View File

@ -1,41 +1,58 @@
@using WebSharpRSS.Models
@using MudBlazor.Utilities
@using CodeHollow.FeedReader
@using Serilog
<MudList DisableGutters="true">
<MudListItem>
<MudNavMenu>
<MudNavLink Href="/" Icon="@Icons.Material.Filled.Home">Home</MudNavLink>
</MudNavMenu>
</MudListItem>
<MudDivider/>
<MudListItem>
<MudTreeView Items="Categories" Hover="true" ExpandOnClick="true" @bind-SelectedValue="SelectedItem">
<ItemTemplate>
<MudTreeViewItem @bind-Expanded="@context.IsExpanded" Icon="@context.CategoryIcon" Text="@context.CategoryTitle" Value="@context">
<ChildContent>
<MudTable Items="@context.Feeds">
<RowTemplate Context="feedContext">
<MudTd>
<MudText>@feedContext.Title</MudText>
</MudTd>
</RowTemplate>
</MudTable>
</ChildContent>
</MudTreeViewItem>
</ItemTemplate>
</MudTreeView>
</MudListItem>
</MudList>
<MudStack Spacing="2">
<MudNavMenu>
<MudNavLink Href="/" Icon="@Icons.Material.Filled.Home">Home</MudNavLink>
</MudNavMenu>
<MudList DisableGutters="true" Clickable="true" Color="Color.Warning" SelectedItemChanged="Callback">
<MudListSubheader>
Categories
</MudListSubheader>
@foreach (CategoryTreeItem cat in Categories)
{
/* Category item*/
<MudListItem Class="pl-4" Text="@cat.CategoryTitle" Icon="@cat.CategoryIcon" @bind-Expanded="@cat.IsExpanded">
<NestedList>
@if (cat.IsExpanded)
{
foreach (Feed feed in cat.Feeds)
{
/* Feed item */
<MudListItem Value="feed">
<MudImage ObjectFit="ObjectFit.ScaleDown" Height="16" Width="16" Class="d-inline" Src="https://fedoramagazine.org/wp-content/themes/fedoramagazine-1.15/favicon.ico"/>
<MudText Class="d-inline">@feed.Title</MudText>
</MudListItem>
}
}
</NestedList>
</MudListItem>
}
</MudList>
</MudStack>
@code {
public HashSet<CategoryTreeItem> Categories = new HashSet<CategoryTreeItem>();
protected override void OnInitialized()
{
Categories.Add(new CategoryTreeItem() { CategoryTitle = "Test cat.", CategoryIcon = Icons.Material.Filled.RssFeed });
Log.Verbose("Setting up test data");
Categories.Add(new CategoryTreeItem() { CategoryTitle = "Social", CategoryIcon = Icons.Material.Filled.People });
Categories.Add(new CategoryTreeItem() { CategoryTitle = "Blogs", CategoryIcon = Icons.Material.Filled.RssFeed });
Categories.Add(new CategoryTreeItem() { CategoryTitle = "Tech", CategoryIcon = Icons.Material.Filled.Computer });
Categories.Add(new CategoryTreeItem() { CategoryTitle = "News", CategoryIcon = Icons.Material.Filled.Newspaper });
}
CategoryTreeItem SelectedItem { get; set; }
private void Callback(MudListItem obj)
{
switch (obj.Value)
{
case CategoryTreeItem catTreeItem:
break;
case Feed feed:
break;
}
}
}