ShortBlogPost.razor

@using System.Net
@using System.Text.RegularExpressions
@using System.Web
@using LinkDotNet.Blog.Domain
@using LinkDotNet.Blog.Web.Features.Services
@using Microsoft.Extensions.Caching.Memory

@inject IMemoryCache MemoryCache
<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.ToString("dd/MM/yyyy")</span></li>
				@if (BlogPost.Tags != null && 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">@readingTime min</li>
			</ul>
		</div>
		<div class="description">
			<h1>@BlogPost.Title</h1>
			<h2></h2>
			<p>@MarkdownConverter.ToMarkupString(BlogPost.ShortDescription)</p>
			<p class="read-more">
				<a href="/blogPost/@BlogPost.Id" aria-label="@BlogPost.Title">Read the whole article</a>
			</p>
		</div>
	</div>
</article>

@code {
	private int readingTime;

	[Parameter]
	public BlogPost BlogPost { get; set; }

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

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

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

	protected override void OnInitialized()
	{
		var key = "reading-time-" + BlogPost.Id;
		readingTime = MemoryCache.GetOrCreate(key, entry =>
		{
			entry.AbsoluteExpirationRelativeToNow = TimeSpan.FromHours(1);
			return ReadingTimeCalculator.CalculateReadingTime(BlogPost.Content);
		});
	}
}