ShortBlogPost.razor

@using LinkDotNet.Blog.Domain
@using LinkDotNet.Blog.Web.Features.Bookmarks
@using LinkDotNet.Blog.Web.Features.Bookmarks.Components
@inject IBookmarkService BookmarkService
@inject IOptions<ApplicationConfiguration> AppConfiguration

<article>
	<div class="blog-card @AltCssClass">
		<div class="meta">
			<div class="photo">
				<PreviewImage PreviewImageUrl="@BlogPost.PreviewImageUrl"
				              PreviewImageUrlFallback="@BlogPost.PreviewImageUrlFallback"
				              LazyLoadImage="@LazyLoadPreviewImage"></PreviewImage>
			</div>
			<ul class="details">
				@if (BlogPost.IsScheduled)
				{
					<li class="schedule">Scheduled</li>
				}
				else if (!BlogPost.IsPublished)
				{
					<li class="draft">Draft</li>
				}
				<li class="date me-4"><span>@BlogPost.UpdatedDate.ToShortDateString()</span></li>
				@if (BlogPost.Tags.Any())
				{
					<li class="tags me-4">
						<ul>
							@foreach (var tag in BlogPost.Tags)
							{
								<li><a class="goto-tag" href="/searchByTag/@(Uri.EscapeDataString(tag))">@tag</a></li>
							}
						</ul>
					</li>
				}
				<li class="read-time me-4">@BlogPost.ReadingTimeInMinutes minute read</li>
                @if (AppConfiguration.Value.UseMultiAuthorMode && BlogPost.AuthorName is not null)
                {
                    <li class="me-4"><i class="user-tie"></i> @BlogPost.AuthorName</li>
                }
            </ul>
		</div>
		<div class="description">
			<div class="header">
				<h4 class="card-title">@BlogPost.Title</h4>
				<BookmarkButton IsBookmarked="isBookmarked" Bookmarked="ToggleBookmark"></BookmarkButton>
			</div>
			<p class="card-content">@MarkdownConverter.ToMarkupString(BlogPost.ShortDescription)</p>
			<p class="read-more">
				<a href="/blogPost/@BlogPost.Id/@BlogPost.Slug" aria-label="@BlogPost.Title">Read the whole article</a>
			</p>
		</div>
	</div>
</article>

@code {
	[Parameter, EditorRequired]
	public required BlogPost BlogPost { get; set; }

	private bool isBookmarked = false;

	[Parameter]
	public bool UseAlternativeStyle { get; set; }

	[Parameter]
	public bool LazyLoadPreviewImage { get; set; }

	private string AltCssClass => UseAlternativeStyle ? "alt" : string.Empty;

	private async Task ToggleBookmark()
	{
		isBookmarked = !isBookmarked;
		await BookmarkService.SetBookmark(BlogPost.Id, isBookmarked);
		StateHasChanged();
	}

	public override Task SetParametersAsync(ParameterView parameters)
	{
		foreach (var parameter in parameters)
		{
			switch (parameter.Name)
			{
				case nameof(BlogPost):
					BlogPost = (BlogPost)parameter.Value;
					break;
				case nameof(UseAlternativeStyle):
					UseAlternativeStyle = (bool)parameter.Value;
					break;
				case nameof(LazyLoadPreviewImage):
					LazyLoadPreviewImage = (bool)parameter.Value;
					break;
			}
		}

		return base.SetParametersAsync(ParameterView.Empty);
	}

	protected override async Task OnAfterRenderAsync(bool firstRender)
	{
		if (firstRender)
		{
			isBookmarked = await BookmarkService.IsBookmarked(BlogPost.Id);
			StateHasChanged();
		}
	}
}