Changed Home Page to SSR (fixes #1)

Wave/Components/PageComponent.razor

@@ -0,0 +1,24 @@
+@typeparam T
+
+@foreach (var item in Items) {
+	@ChildContent(item)
+}
+
+@code {
+	[SupplyParameterFromQuery]
+	public int Page { get; set; } = 0;
+
+	[Parameter]
+	public required RenderFragment<T> ChildContent { get; set; }
+	[Parameter]
+	public required Func<int, int, ValueTask<IEnumerable<T>>> LoadCallback { get; set; }
+	
+	[Parameter]
+	public int ItemsPerPage { get; set; } = 10;
+
+	private List<T> Items { get; } = [];
+
+	protected override async Task OnInitializedAsync() {
+		foreach (var i in await LoadCallback(Page * ItemsPerPage, ItemsPerPage)) Items.Add(i);
+	}
+}

Wave/Components/Pages/Home.razor

@@ -4,13 +4,12 @@
 @using Wave.Data
 @using Wave.Utilities
 
-@rendermode InteractiveServer
-@attribute [StreamRendering]
 @inject IOptions<Customization> Customizations
 @inject IOptions<Features> Features
 @inject NavigationManager Navigation
 @inject IDbContextFactory<ApplicationDbContext> ContextFactory;
 @inject IStringLocalizer<Home> Localizer
+@inject IMessageDisplay Message
 
 <HeadContent>
 	<meta property="og:type" content="website">
@@ -62,14 +61,7 @@
 	}
 </section>
 
-<!-- TODO: somehow get status message -->
+@if (Featured is {} featured) {
-
-@if (Busy) {
-	<div class="flex place-content-center h-full text-primary">
-		<span class="loading loading-spinner loading-lg"></span>
-	</div>
-} else {
-	@if (Articles.FirstOrDefault() is {} featured) {
 	<article class="mb-6">
 		<ArticleLink Article="featured">
 			<div class="hero bg-secondary text-secondary-content border-l-8 border-current shadow rounded-box">
@@ -97,65 +89,60 @@
 			</div>
 		</ArticleLink>
 	</article>
-	} else {
+} else {
 	<h2 class="text-2xl lg:text-4xl mb-6">@Localizer["NoArticles_Title"]</h2>
 	<p>@Localizer["NoArticles_Message"]</p>
-	}
-
-	<ArticleTileArray>
-		@foreach (var article in Articles.Skip(1)) {
-			<ArticleTile Article="article" />
-		}
-	</ArticleTileArray>
 }
 
-@if (HasMore) {
+<ArticleTileArray>
-	<div class="flex place-content-center">
+	<PageComponent LoadCallback="LoadArticles">
-		<button class="btn btn-wide" @onclick="More">@Localizer["More"]</button>
+		<ArticleTile Article="context" />
+	</PageComponent>
+</ArticleTileArray>
+
+<div class="grid place-content-center my-3">
+	<div class="join">
+		<a class="join-item btn" href="/?page=@(Page-1)" disabled="@(Page < 1)">«</a>
+		<button class="join-item btn">Page @(Page+1)</button>
+		<a class="join-item btn" href="/?page=@(Page+1)" disabled="@(Page >= TotalPages-1)">»</a>
 	</div>
-}
+</div>
 
 @code {
 	[CascadingParameter(Name = "TitlePrefix")]
 	private string TitlePrefix { get; set; } = default!;
+	[SupplyParameterFromQuery]
+	public int Page { get; set; } = 0;
 
-	private List<Article> Articles { get; } = [];
+	private int TotalPages { get; set; } = 1;
-	private bool HasMore { get; set; }
-	private bool Busy { get; set; } = true;
 
-	protected override async Task OnAfterRenderAsync(bool firstRender) {
+	private Article? Featured { get; set; }
-		if (firstRender) {
+
+	protected override async Task OnInitializedAsync() {
 		try {
 			await using var context = await ContextFactory.CreateDbContextAsync();
 
 			var query = context.Set<Article>()
 				.Include(a => a.Author).Include(a => a.Categories)
-					.OrderByDescending(a => a.PublishDate);
+				.OrderByDescending(a => a.PublishDate).ThenBy(a => a.Id);
-				var articles = await query.Take(11).ToListAsync();
+
-				HasMore = (await query.CountAsync()) > 11;
+			Featured = await query.FirstOrDefaultAsync();
-				Articles.AddRange(articles);
+			TotalPages = (int) Math.Ceiling((await query.CountAsync() - 1) / 10.0);
-			} finally {
+		} catch {
-				Busy = false;
+			Message.ShowError(Localizer["Articles_Load_Error"]);
-				await InvokeAsync(StateHasChanged);
-			}
 		}
 	}
 
-	private async Task More() {
+	private async ValueTask<IEnumerable<Article>> LoadArticles(int page, int count) {
 		try {
-			Busy = HasMore = true;
 			await using var context = await ContextFactory.CreateDbContextAsync();
-
+			return await context.Set<Article>()
-			var query = context.Set<Article>()
 				.Include(a => a.Author).Include(a => a.Categories)
-				.OrderByDescending(a => a.PublishDate)
+				.OrderByDescending(a => a.PublishDate).ThenBy(a => a.Id)
-				.Skip(Articles.Count);
+				.Skip(page + 1).Take(count).ToListAsync();
-			var articles = await query.Take(10).ToListAsync();
+		} catch {
-			Articles.AddRange(articles);
+			Message.ShowError(Localizer["Articles_Load_Error"]);
-			HasMore = (await query.CountAsync()) > 10;
+			return [];
-		} finally {
-			Busy = false;
 		}
 	}
-
 }