Settings, Administration and conversations; threads that fill in

Settings, which held only the theme, now belong to the persona too:
- its profile (update_credentials, a new PATCH in IHttpService): pictures,
  name, biography and fields as written, locked, bot, discoverable,
  indexable, and how its posts start (visibility, language, sensitive
  media, who may quote them); the composer starts at that visibility;
- the root's personas, each used in turn, and a new one made;
- the accounts it muted or blocked and the servers it blocked, each undone
  there, a server blocked from a pasted address or handle;
- its follows, lists, blocks, mutes, blocked servers and bookmarks exported
  and imported as the CSV files Mastodon writes (PortabilityService): an
  import resolves each row through PrivaPub, one at a time, and can stop.

Administration opens to moderators: reports, resolved there; and for
administrators the servers blocked for everyone and the federation
statistics (traffic by server, delivery success and latency, the crawler).

The Direct tab pages conversations, badges the unread ones, and a card
marks one read or takes it off the list; opening one reads it.

A remote thread is read again 4 and 15 seconds after it opens, since
PrivaPub then fetches the replies its servers hold. A thread its
community locked shows a lock instead of a reply button, reactions stay
visible below a content warning, and a searched handle opens its
account's profile whatever else matched.

The e2e tests cover each: the profile saved and read back, a persona made,
servers blocked and imported, follows exported, an instance block and the
statistics as the pasture's admin, a conversation read and removed, and a
reply only Mastodon held appearing in its thread.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw

Components/Admin/ReportsPanel.razor

@@ -0,0 +1,138 @@
+@inherits LocalizableComponentBase
+
+@* The reports moderators handle (/clientapi/moderator/reports): from someone here (never said who) or from another
+   server, about an account and some of its posts; resolved here. *@
+<div class="flex flex-col gap-3 w-full" data-reports>
+	<DToggle LabelText="@Localizer["Show the resolved ones"]" Value="resolved" ValueChanged="ShowResolved" ValueExpression="() => resolved" />
+
+	@if (IsLoading)
+	{
+		<p class="flex w-full items-center justify-center gap-2">
+			<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
+			@Localizer["loading"]
+		</p>
+	}
+	else if (reports.Count == 0)
+	{
+		<p class="text-sm opacity-70">@(resolved ? Localizer["No resolved report."] : Localizer["No open report."])</p>
+	}
+
+	@foreach (var report in reports)
+	{
+		<article class="flex flex-col gap-2 p-3 rounded-xl neo-raised neo-xs" data-report-id="@report.ID">
+			<div class="flex flex-wrap items-center gap-2">
+				<DBadge Size="DSize.Sm" Variant="DBadgeVariant.Soft" Color="DColor.Warning">@CategoryName(report.Category)</DBadge>
+				@if (report.Forwarded)
+				{
+					<DBadge Size="DSize.Sm" Variant="DBadgeVariant.Soft">@Localizer["Forwarded"]</DBadge>
+				}
+				<span class="text-xs opacity-70" title="@report.CreatedAt.ToLocalTime().ToString(SUtility.dateTimeFormat)">
+					@report.CreatedAt.GetPassedTime(Localizer)
+				</span>
+				<span class="flex-1"></span>
+				@if (!report.IsResolved)
+				{
+					<DButton Size="DSize.Sm" Color="DColor.Success" Disabled="@(IsDefaultDisabled || busy.Contains(report.ID))" OnClick="() => Resolve(report)"
+							 data-report-resolve>
+						<i class="ion-md-checkmark"></i><span>@Localizer["Resolve"]</span>
+					</DButton>
+				}
+				else if (report.ResolvedAt is { } resolvedAt)
+				{
+					<span class="text-xs opacity-70">@Localizer["Resolved {0}", resolvedAt.GetPassedTime(Localizer)]</span>
+				}
+			</div>
+			<p class="text-sm">
+				<b>@Localizer["About"]</b>
+				@if (report.TargetAccountId is { Length: > 0 } targetId)
+				{
+					<a class="link link-hover break-all" href="@($"account/{Uri.EscapeDataString(targetId)}")">@report.TargetActorURI</a>
+				}
+				else
+				{
+					<span class="break-all">@report.TargetActorURI</span>
+				}
+			</p>
+			<p class="text-sm">
+				<b>@Localizer["From"]</b>
+				<span class="break-all">@(report.Reporter == "local" ? Localizer["someone here"] : report.Reporter)</span>
+			</p>
+			@if (report.Comment is { Length: > 0 } comment)
+			{
+				<p class="text-sm whitespace-pre-line rounded-lg neo-inset neo-2xs p-2">@comment</p>
+			}
+			@if (report.PostIds.Count > 0 || report.ObjectURIs.Count > 0)
+			{
+				<div class="flex flex-wrap gap-2 text-xs">
+					@foreach (var postId in report.PostIds)
+					{
+						<a class="link" href="@($"expand/{Uri.EscapeDataString(postId)}")">@Localizer["Post {0}", postId]</a>
+					}
+					@* a report from another server names posts by their ids there when we hold none of them *@
+					@if (report.PostIds.Count == 0)
+					{
+						@foreach (var uri in report.ObjectURIs)
+						{
+							<span class="break-all opacity-70">@uri</span>
+						}
+					}
+				</div>
+			}
+		</article>
+	}
+</div>
+
+@code {
+	[Inject] AdminService AdminService { get; set; }
+
+	List<ViewReport> reports = [];
+	bool resolved;
+	HashSet<string> busy = [];
+
+	protected override async Task OnInitializedAsync()
+	{
+		if (CascadingState.IsOffline)
+		{
+			WhenOnline(LoadData);
+			StartOnlinePolling();
+			IsLoading = false;
+			return;
+		}
+
+		await LoadData();
+		IsLoading = false;
+	}
+
+	async Task LoadData() => reports = await AdminService.Reports(resolved);
+
+	async Task ShowResolved(bool value)
+	{
+		resolved = value;
+		IsLoading = true;
+		await LoadData();
+		IsLoading = false;
+	}
+
+	string CategoryName(string category) => category switch
+	{
+		"spam" => Localizer["Spam"],
+		"legal" => Localizer["Illegal"],
+		"violation" => Localizer["Breaks the rules"],
+		_ => Localizer["Other"]
+	};
+
+	async Task Resolve(ViewReport report)
+	{
+		busy.Add(report.ID);
+		var result = await AdminService.Resolve(report.ID);
+		busy.Remove(report.ID);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		reports.Remove(report);
+		Toast.AddResponseSuccess(Localizer["Report resolved."]);
+	}
+}

Components/Admin/ServerBlocksPanel.razor

@@ -0,0 +1,122 @@
+@inherits LocalizableComponentBase
+
+@* Servers blocked for everyone here (/clientapi/admin/domainblocks): suspended (nothing from or to them) or silenced
+   (kept out of the public feeds), their media refused or not, with a comment for the public and one for the admins. *@
+<div class="flex flex-col gap-3 w-full" data-server-blocks>
+	<EditForm Model="form" OnValidSubmit="Block" class="flex flex-col gap-2 p-3 rounded-xl neo-inset neo-2xs">
+		<DataAnnotationsValidator />
+		<div class="flex flex-wrap gap-2 items-center">
+			<DInput TValue="string" class="flex-1 min-w-48" @bind-Value="form.Domain" Immediate="true" autocomplete="off" maxlength="253"
+					placeholder="@Localizer["A server, e.g. example.social"]" data-server-block-domain>
+				<Prefix><i class="ion-md-globe"></i></Prefix>
+			</DInput>
+			<DToggle LabelText="@Localizer["Suspend (otherwise silence)"]" @bind-Value="form.Suspend" />
+			<DToggle LabelText="@Localizer["Refuse its media"]" @bind-Value="form.RejectMedia" />
+		</div>
+		<DInput TValue="string" @bind-Value="form.PublicComment" Immediate="true" autocomplete="off" maxlength="1000"
+				placeholder="@Localizer["Why, for everyone to read"]" />
+		<DInput TValue="string" @bind-Value="form.PrivateComment" Immediate="true" autocomplete="off" maxlength="1000"
+				placeholder="@Localizer["Why, for the admins only"]" />
+		<ErrorViewer />
+		<DButton Type="submit" Size="DSize.Sm" Color="DColor.Error" class="self-end"
+				 Disabled="@(IsDefaultDisabled || isSaving || string.IsNullOrWhiteSpace(form.Domain))">
+			@Localizer["Block server"]
+		</DButton>
+	</EditForm>
+
+	@if (IsLoading)
+	{
+		<p class="flex w-full items-center justify-center gap-2">
+			<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
+			@Localizer["loading"]
+		</p>
+	}
+	else if (blocks.Count == 0)
+	{
+		<p class="text-sm opacity-70">@Localizer["No server is blocked."]</p>
+	}
+
+	@foreach (var block in blocks)
+	{
+		<div class="flex flex-col gap-1 p-2 rounded-lg neo-raised neo-2xs" data-server-block="@block.Domain">
+			<div class="flex flex-wrap items-center gap-2">
+				<b class="flex-1 min-w-0 truncate">@block.Domain</b>
+				<DBadge Size="DSize.Sm" Variant="DBadgeVariant.Soft" Color="@(block.Severity == "Suspend" ? DColor.Error : DColor.Warning)">
+					@(block.Severity == "Suspend" ? Localizer["Suspended"] : Localizer["Silenced"])
+				</DBadge>
+				@if (block.RejectMedia)
+				{
+					<DBadge Size="DSize.Sm" Variant="DBadgeVariant.Soft">@Localizer["Media refused"]</DBadge>
+				}
+				<span class="text-xs opacity-70" title="@block.CreatedAt.ToLocalTime().ToString(SUtility.dateTimeFormat)">@block.CreatedAt.GetPassedTime(Localizer)</span>
+				<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || busy.Contains(block.Domain))" OnClick="() => Unblock(block)">
+					@Localizer["Unblock"]
+				</DButton>
+			</div>
+			@if (block.PublicComment is { Length: > 0 } publicComment)
+			{
+				<p class="text-xs">@publicComment</p>
+			}
+			@if (block.PrivateComment is { Length: > 0 } privateComment)
+			{
+				<p class="text-xs opacity-70"><i class="ion-md-lock"></i> @privateComment</p>
+			}
+		</div>
+	}
+</div>
+
+@code {
+	[Inject] AdminService AdminService { get; set; }
+
+	List<ViewDomainBlock> blocks = [];
+	DomainBlockForm form = new();
+	bool isSaving;
+	HashSet<string> busy = [];
+
+	protected override async Task OnInitializedAsync()
+	{
+		if (CascadingState.IsOffline)
+		{
+			WhenOnline(LoadData);
+			StartOnlinePolling();
+			IsLoading = false;
+			return;
+		}
+
+		await LoadData();
+		IsLoading = false;
+	}
+
+	async Task LoadData() => blocks = await AdminService.ServerBlocks();
+
+	async Task Block()
+	{
+		isSaving = true;
+		var result = await AdminService.BlockServer(form);
+		isSaving = false;
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		var block = (ViewDomainBlock)result.Data;
+		blocks = [.. blocks.Where(b => b.Domain != block.Domain).Append(block).OrderBy(b => b.Domain, StringComparer.Ordinal)];
+		form = new();
+		Toast.AddResponseSuccess(Localizer["{0} is blocked.", block.Domain]);
+	}
+
+	async Task Unblock(ViewDomainBlock block)
+	{
+		busy.Add(block.Domain);
+		var result = await AdminService.UnblockServer(block.Domain);
+		busy.Remove(block.Domain);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		blocks.Remove(block);
+	}
+}

Components/Admin/StatisticsPanel.razor

@@ -0,0 +1,209 @@
+@inherits LocalizableComponentBase
+
+@* PrivaPub's federation statistics (/clientapi/admin/statistics): the last days at a glance, the servers exchanged with
+   (by traffic, failures, latency or name, 50 a page) and how far the crawler got. Counted per server, never per account. *@
+<div class="flex flex-col gap-4 w-full" data-statistics>
+	<div class="flex flex-wrap gap-2 items-end">
+		<label class="flex flex-col gap-1 text-sm">
+			<span>@Localizer["Period"]</span>
+			<DSelect TValue="int" Size="DSize.Sm" Value="days" ValueChanged="ChangeDays" ValueExpression="() => days">
+				@foreach (var period in Periods)
+				{
+					<option value="@period">@Localizer["{0} days", period]</option>
+				}
+			</DSelect>
+		</label>
+		<label class="flex flex-col gap-1 text-sm">
+			<span>@Localizer["Servers by"]</span>
+			<DSelect TValue="string" Size="DSize.Sm" Value="sort" ValueChanged="ChangeSort" ValueExpression="() => sort">
+				<option value="traffic">@Localizer["Traffic"]</option>
+				<option value="failures">@Localizer["Failures"]</option>
+				<option value="latency">@Localizer["Latency"]</option>
+				<option value="host">@Localizer["Name"]</option>
+			</DSelect>
+		</label>
+	</div>
+
+	@if (IsLoading)
+	{
+		<p class="flex w-full items-center justify-center gap-2">
+			<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
+			@Localizer["loading"]
+		</p>
+	}
+	else if (overview is null)
+	{
+		<p class="text-sm opacity-70">@Localizer["The statistics could not be read."]</p>
+	}
+	else
+	{
+		<DStats class="w-full overflow-x-auto neo-raised neo-xs" data-statistics-overview>
+			<DStat>
+				<Heading>@Localizer["Deliveries that arrived"]</Heading>
+				<ChildContent>@(overview.DeliverySuccess is { } success ? $"{success * 100:0.#}%" : "—")</ChildContent>
+				<Desc>@Localizer["p50 {0} ms, p95 {1} ms", Ms(overview.DeliveryLatencyMs.P50), Ms(overview.DeliveryLatencyMs.P95)]</Desc>
+			</DStat>
+			<DStat>
+				<Heading><span class="capitalize">@Localizer["servers"]</span></Heading>
+				<ChildContent>@overview.Hosts.Active</ChildContent>
+				<Desc>@Localizer["{0} known", overview.Hosts.Known]</Desc>
+			</DStat>
+			<DStat>
+				<Heading>@Localizer["Accounts seen"]</Heading>
+				<ChildContent>@overview.Accounts</ChildContent>
+				<Desc>@Localizer["ledger {0} written, {1} dropped", overview.Ledger.Written, overview.Ledger.Dropped]</Desc>
+			</DStat>
+		</DStats>
+
+		<div class="flex flex-wrap gap-4 text-xs">
+			@foreach (var (title, counts) in Outcomes)
+			{
+				<div class="flex flex-col gap-1 min-w-40">
+					<b class="text-sm">@title</b>
+					@foreach (var (outcome, count) in counts.OrderByDescending(c => c.Value))
+					{
+						<span class="flex justify-between gap-4 tabular-nums"><span>@outcome</span><span>@count</span></span>
+					}
+				</div>
+			}
+		</div>
+
+		@if (hosts is not null)
+		{
+			<DTable Size="DSize.Xs" Zebra="true" WrapperClass="max-h-[28rem] rounded-xl neo-inset neo-2xs" data-statistics-hosts>
+				<thead>
+					<tr>
+						<th>@Localizer["server"]</th>
+						<th>@Localizer["software"]</th>
+						<th class="text-right">@Localizer["In"]</th>
+						<th class="text-right">@Localizer["Out"]</th>
+						<th class="text-right">@Localizer["Refused"]</th>
+						<th class="text-right">@Localizer["Failures"]</th>
+						<th class="text-right">p50</th>
+						<th>@Localizer["Delivery"]</th>
+					</tr>
+				</thead>
+				<tbody>
+					@foreach (var host in hosts.Hosts)
+					{
+						<tr data-statistics-host="@host.Host">
+							<td class="max-w-48 truncate">@host.Host</td>
+							<td>@host.Software @host.Version</td>
+							<td class="text-right tabular-nums">@host.In</td>
+							<td class="text-right tabular-nums">@host.Out</td>
+							<td class="text-right tabular-nums">@host.Refused</td>
+							<td class="text-right tabular-nums">@host.Failures</td>
+							<td class="text-right tabular-nums">@Ms(host.LatencyP50)</td>
+							<td>
+								@if (host.Delivery?.UnavailableUntil is { } until && until > DateTime.UtcNow)
+								{
+									<DBadge Size="DSize.Xs" Color="DColor.Error" title="@until.ToLocalTime().ToString(SUtility.dateTimeFormat)">@Localizer["paused"]</DBadge>
+								}
+								else if (host.Delivery?.ConsecutiveFailures > 0)
+								{
+									<DBadge Size="DSize.Xs" Color="DColor.Warning">@Localizer["{0} failing", host.Delivery.ConsecutiveFailures]</DBadge>
+								}
+							</td>
+						</tr>
+					}
+				</tbody>
+			</DTable>
+			@if (hosts.Total > PageSize)
+			{
+				<DPagination Size="DSize.Xs" Count="@((hosts.Total + PageSize - 1) / PageSize)" Current="page" CurrentChanged="ChangePage"
+							 PreviousAriaLabel="@Localizer["Previous page"]" NextAriaLabel="@Localizer["Next page"]" />
+			}
+			<p class="text-xs opacity-70">@hosts.Attribution</p>
+		}
+
+		@if (crawler is not null)
+		{
+			<div class="flex flex-col gap-1 text-xs" data-statistics-crawler>
+				<b class="text-sm">@Localizer["Crawler"]</b>
+				<span>
+					@(crawler.Enabled ? Localizer["on"] : Localizer["off"]) ·
+					@Localizer["{0} servers touched, {1} only crawled, {2} due, {3} refuse robots", crawler.Touched, crawler.Crawled, crawler.Due, crawler.RobotsDisallowed]
+				</span>
+				@foreach (var host in crawler.Recent)
+				{
+					<span class="flex flex-wrap gap-2">
+						<span class="truncate max-w-48">@host.Host</span>
+						<span class="opacity-70">@host.Software</span>
+						@if (host.LastCrawledAt is { } crawled)
+						{
+							<span class="opacity-70">@crawled.GetPassedTime(Localizer)</span>
+						}
+						@if (host.CrawlError is { Length: > 0 } crawlError)
+						{
+							<span class="text-error">@crawlError</span>
+						}
+					</span>
+				}
+			</div>
+		}
+	}
+</div>
+
+@code {
+	[Inject] AdminService AdminService { get; set; }
+
+	const int PageSize = 50;
+	static readonly int[] Periods = [1, 7, 30, 90];
+
+	ViewStatisticsOverview overview;
+	ViewHostsPage hosts;
+	ViewCrawler crawler;
+	int days = 30;
+	string sort = "traffic";
+	int page = 1;
+
+	(string Title, Dictionary<string, long> Counts)[] Outcomes =>
+	[
+		(Localizer["Received"], overview.Inbound),
+		(Localizer["Delivered"], overview.Outbound),
+		(Localizer["Channels"], overview.Channels)
+	];
+
+	protected override async Task OnInitializedAsync()
+	{
+		if (CascadingState.IsOffline)
+		{
+			WhenOnline(LoadData);
+			StartOnlinePolling();
+			IsLoading = false;
+			return;
+		}
+
+		await LoadData();
+		IsLoading = false;
+	}
+
+	async Task LoadData()
+	{
+		overview = await AdminService.Overview(days);
+		hosts = await AdminService.Hosts(days, sort, page);
+		crawler = await AdminService.Crawler();
+	}
+
+	static string Ms(int? value) => value?.ToString() ?? "—";
+
+	async Task ChangeDays(int value)
+	{
+		days = value;
+		page = 1;
+		await LoadData();
+	}
+
+	async Task ChangeSort(string value)
+	{
+		sort = value;
+		page = 1;
+		hosts = await AdminService.Hosts(days, sort, page);
+	}
+
+	async Task ChangePage(int value)
+	{
+		page = value;
+		hosts = await AdminService.Hosts(days, sort, page);
+	}
+}

Components/Composer.razor

@@ -258,9 +258,18 @@
 		_ => default
 	};
 
+	// a new post starts with the visibility the persona chose in Settings
+	MessageType DefaultVisibility => CascadingState.Persona?.Source?.Privacy switch
+	{
+		"private" => MessageType.FollowersOnly,
+		"unlisted" => MessageType.Unlisted,
+		_ => MessageType.Public
+	};
+
 	protected override async Task OnInitializedAsync()
 	{
 		form.GroupId = GroupId;
+		form.MessageType = DefaultVisibility;
 		form.QuotedStatusId = Quoting?.Id;
 		if (Editing is not null)
 		{
@@ -421,14 +430,14 @@
 		if (result.Data is ScheduledStatus scheduled)
 		{
 			Toast.AddResponseSuccess(Localizer["Scheduled for {0}.", scheduled.ScheduledAt.ToLocalTime().ToString(SUtility.dateTimeFormatExt)]);
-			form = new() { GroupId = GroupId };
+			form = new() { GroupId = GroupId, MessageType = DefaultVisibility };
 			await OnPublished.InvokeAsync(null);
 			return;
 		}
 
 		Toast.AddResponseSuccess(form.IsLocated ? Localizer["Located post published."] : Localizer["Published."]);
 		var published = result.Data as FeedPost;
-		form = new() { GroupId = GroupId };
+		form = new() { GroupId = GroupId, MessageType = DefaultVisibility };
 		await OnPublished.InvokeAsync(published);
 	}
 

Components/Content.razor

@@ -60,9 +60,19 @@
 			}
 			else if (Post.Conversation is { } conversation)
 			{
-				<p class="inline-flex flex-wrap items-center gap-2 min-w-0 text-xs">
+				<p class="flex flex-wrap items-center gap-2 min-w-0 text-xs" data-conversation-id="@conversation.Id">
 					<i class="ion-md-mail @(conversation.Unread ? "text-primary" : null)" aria-hidden="true"></i>
-					<span class="truncate">@string.Join(", ", conversation.Accounts.Select(a => "@" + a.Acct))</span>
+					<span class="flex-1 min-w-0 truncate">@string.Join(", ", conversation.Accounts.Select(a => "@" + a.Acct))</span>
+					@if (conversation.Unread)
+					{
+						<DBadge Size="DSize.Xs" Color="DColor.Primary" data-conversation-unread>@Localizer["unread"]</DBadge>
+						<DButton Size="DSize.Xs" Disabled="IsDefaultDisabled" OnClick="ReadConversation" title="@Localizer["Mark as read"]" data-conversation-read>
+							<i class="ion-md-checkmark"></i>
+						</DButton>
+					}
+					<DButton Size="DSize.Xs" Disabled="IsDefaultDisabled" OnClick="RemoveConversation" title="@Localizer["Remove from the list"]" data-conversation-remove>
+						<i class="ion-md-close"></i>
+					</DButton>
 				</p>
 			}
 
@@ -139,6 +149,28 @@
 						@Body(status)
 					}
 
+					@* the reactions stand outside the content warning: they are not what it hides *@
+					@if (status.EmojiReactions.Count > 0)
+					{
+						<div class="flex flex-wrap gap-1" data-reactions>
+							@foreach (var reaction in status.EmojiReactions)
+							{
+								<DButton Size="DSize.Xs" Active="reaction.Me" Disabled="@(IsDefaultDisabled || isActing || Compact || Post.Located)"
+										 OnClick="() => React(reaction.Name, !reaction.Me)" title="@reaction.Name">
+									@if (reaction.Url is { Length: > 0 } image)
+									{
+										<img alt="@reaction.Name" class="h-4 w-4 object-contain" src="@image" />
+									}
+									else
+									{
+										<span>@reaction.Name</span>
+									}
+									<span class="tabular-nums">@reaction.Count</span>
+								</DButton>
+							}
+						</div>
+					}
+
 					@if (Post.Located)
 					{
 						<p class="inline-flex gap-2 items-center text-xs opacity-70">
@@ -151,13 +183,27 @@
 					{
 						<footer class="flex gap-2 mt-1 justify-between">
 							<div class="flex gap-2">
-								<DButton Size="DSize.Sm" Active="isReplying" Disabled="IsDefaultDisabled" OnClick="ToggleReply" title="@Localizer[isReplying ? "Close" : "Reply"]">
-									<i aria-hidden="true" class="@(isReplying ? "ion-md-close-circle" : "ion-md-text") text-lg text-success"></i>
-									@if (status.RepliesCount > 0)
-									{
-										<span>@status.RepliesCount</span>
-									}
-								</DButton>
+								@if (status.Privapub?.Locked == true)
+								{
+									@* its community's moderators locked the thread: no reply is taken *@
+									<span class="btn btn-sm btn-disabled" title="@Localizer["Locked by its community's moderators"]" data-locked>
+										<i aria-hidden="true" class="ion-md-lock text-lg"></i>
+										@if (status.RepliesCount > 0)
+										{
+											<span>@status.RepliesCount</span>
+										}
+									</span>
+								}
+								else
+								{
+									<DButton Size="DSize.Sm" Active="isReplying" Disabled="IsDefaultDisabled" OnClick="ToggleReply" title="@Localizer[isReplying ? "Close" : "Reply"]">
+										<i aria-hidden="true" class="@(isReplying ? "ion-md-close-circle" : "ion-md-text") text-lg text-success"></i>
+										@if (status.RepliesCount > 0)
+										{
+											<span>@status.RepliesCount</span>
+										}
+									</DButton>
+								}
 								<DButton Size="DSize.Sm" Active="status.Reblogged" Disabled="IsDefaultDisabled || isActing || !CanBoost(status)"
 										 OnClick="() => Act(status.Reblogged ? StatusAction.Unreblog : StatusAction.Reblog)" title="@Localizer["Boost"]">
 									<i aria-hidden="true" class="ion-md-repeat text-lg text-info"></i>
@@ -243,7 +289,8 @@
 								</DDropdown>
 								@if (IncludeExpand)
 								{
-									<NavLink class="btn btn-sm" href="@($"expand/{Uri.EscapeDataString(status.Id)}")" title="@Localizer["Expand"]">
+									<NavLink class="btn btn-sm" href="@($"expand/{Uri.EscapeDataString(status.Id)}")" title="@Localizer["Expand"]"
+											 @onclick="OpenConversation">
 										<i aria-hidden="true" class="ion-md-expand text-lg"></i>
 									</NavLink>
 								}
@@ -294,6 +341,7 @@
 
 @code {
 	[Inject] StatusService StatusService { get; set; }
+	[Inject] TimelineService TimelineService { get; set; }
 	[Inject] InstanceService InstanceService { get; set; }
 	[Inject] ProvenanceService ProvenanceService { get; set; }
 
@@ -443,27 +491,6 @@
 			<Content Post="FeedPost.Of(quoted)" Compact="true" IncludeExpand="false" CssContainer="neo-inset! shadow-none" />
 		}
 
-		@if (status.EmojiReactions.Count > 0)
-		{
-			<div class="flex flex-wrap gap-1" data-reactions>
-				@foreach (var reaction in status.EmojiReactions)
-				{
-					<DButton Size="DSize.Xs" Active="reaction.Me" Disabled="@(IsDefaultDisabled || isActing || Compact || Post.Located)"
-							 OnClick="() => React(reaction.Name, !reaction.Me)" title="@reaction.Name">
-						@if (reaction.Url is { Length: > 0 } image)
-						{
-							<img alt="@reaction.Name" class="h-4 w-4 object-contain" src="@image" />
-						}
-						else
-						{
-							<span>@reaction.Name</span>
-						}
-						<span class="tabular-nums">@reaction.Count</span>
-					</DButton>
-				}
-			</div>
-		}
-
 		@if (status.Tags.Count > 0)
 		{
 			<div class="flex flex-wrap gap-1">
@@ -576,6 +603,41 @@
 		Toast.AddResponseSuccess(Localizer["Voted."]);
 	}
 
+	// a conversation opened is read
+	async Task OpenConversation()
+	{
+		if (Post.Conversation is not { Unread: true } conversation)
+			return;
+		var result = await TimelineService.ReadConversation(conversation.Id);
+		if (!result.IsInvalid)
+			conversation.Unread = false;
+	}
+
+	async Task ReadConversation()
+	{
+		var result = await TimelineService.ReadConversation(Post.Conversation.Id);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		Post.Conversation.Unread = false;
+	}
+
+	// off the persona's list until a newer message; the messages stay
+	async Task RemoveConversation()
+	{
+		var result = await TimelineService.RemoveConversation(Post.Conversation.Id);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		await OnDeleted.InvokeAsync(Post);
+	}
+
 	async Task Delete()
 	{
 		isActing = true;

Components/Feed/FeedTabs.razor

@@ -18,6 +18,10 @@
 							{
 								<DBadge Size="DSize.Xs" Color="DColor.Primary" title="@Localizer["{0} unread", UnreadNotifications]" data-unread>@UnreadNotifications</DBadge>
 							}
+							else if (type is TimelineType.Direct && UnreadConversations > 0)
+							{
+								<DBadge Size="DSize.Xs" Color="DColor.Primary" title="@Localizer["{0} unread", UnreadConversations]" data-unread-conversations>@UnreadConversations</DBadge>
+							}
 						</Header>
 					</DTab>
 				}
@@ -98,6 +102,8 @@
 	[Parameter] public List<MastodonList> Lists { get; set; } = [];
 	/// <summary>Groups of notifications newer than the persona's marker; a badge on the Notifications tab.</summary>
 	[Parameter] public int UnreadNotifications { get; set; }
+	/// <summary>How many of the newest direct conversations hold a message the persona has not read.</summary>
+	[Parameter] public int UnreadConversations { get; set; }
 	[Parameter] public IEnumerable<NerdRow> Stats { get; set; } = [];
 	[Parameter] public bool IsComposing { get; set; }
 	[Parameter] public EventCallback OnCompose { get; set; }

Components/Settings/DataTransfer.razor

@@ -0,0 +1,150 @@
+@inherits LocalizableComponentBase
+
+@* The persona's follows, lists, blocks, mutes, blocked servers and bookmarks, exported and imported as the CSV files
+   Mastodon writes, which most fediverse servers read too: a persona moves here from another server, or away, with what
+   it gathered there. An import acts one row at a time, through PrivaPub, and can be stopped. *@
+<div class="flex flex-col gap-5 w-full">
+	<section class="flex flex-col gap-2" data-export>
+		<h3 class="font-semibold text-sm">@Localizer["Export"]</h3>
+		<p class="text-sm opacity-70">@Localizer["Files in Mastodon's format, which most fediverse servers import."]</p>
+		<div class="flex flex-wrap gap-2">
+			@foreach (var data in Kinds)
+			{
+				<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || exporting is not null || importing is not null)" OnClick="() => Export(data)"
+						 data-export-kind="@data">
+					@if (exporting == data)
+					{
+						<DLoading Size="DSize.Xs" />
+					}
+					else
+					{
+						<i class="ion-md-download"></i>
+					}
+					<span>@Name(data)</span>
+				</DButton>
+			}
+		</div>
+	</section>
+
+	<section class="flex flex-col gap-2" data-import>
+		<h3 class="font-semibold text-sm">@Localizer["Import"]</h3>
+		<div class="flex flex-wrap gap-2 items-end">
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["What the file holds"]</span>
+				<DSelect TValue="PortableData" Size="DSize.Sm" @bind-Value="importKind" disabled="@(importing is not null)" data-import-kind>
+					@foreach (var data in Kinds)
+					{
+						<option value="@data">@Name(data)</option>
+					}
+				</DSelect>
+			</label>
+			<DFileInput Size="DSize.Sm" Accept=".csv,text/csv" OnChange="Pick" disabled="@(importing is not null)" data-import-file />
+			@if (importing is null)
+			{
+				<DButton Size="DSize.Sm" Color="DColor.Primary" Disabled="@(IsDefaultDisabled || file is null || exporting is not null)" OnClick="Import"
+						 data-import-start>
+					<i class="ion-md-cloud-upload"></i><span>@Localizer["Import"]</span>
+				</DButton>
+			}
+			else
+			{
+				<DButton Size="DSize.Sm" Color="DColor.Warning" OnClick="Stop">@Localizer["Stop"]</DButton>
+			}
+		</div>
+		@if (report is not null)
+		{
+			<div class="flex flex-col gap-1" data-import-report>
+				<DProgress class="w-full max-w-md" Value="@(report.Done + report.Failed.Count)" Max="@Math.Max(1, report.Total)" />
+				<span class="text-sm tabular-nums">
+					@Localizer["{0} of {1} done, {2} could not be.", report.Done, report.Total, report.Failed.Count]
+				</span>
+				<ErrorViewer AdditionalErrors="report.Failed" />
+			</div>
+		}
+	</section>
+</div>
+
+@code {
+	[Inject] PortabilityService PortabilityService { get; set; }
+	[Inject] IBlazorDownloadFileService DownloadFile { get; set; }
+	[Inject] ILoggingService Logger { get; set; }
+
+	// an export file of 5000 rows stays well under this
+	const long MaximumFileSize = 4 * 1024 * 1024;
+	static readonly PortableData[] Kinds = Enum.GetValues<PortableData>();
+
+	PortableData? exporting;
+	PortableData? importing;
+	PortableData importKind = PortableData.Follows;
+	string file;
+	ImportReport report;
+	CancellationTokenSource stopping;
+
+	protected override void OnInitialized() => IsLoading = false;
+
+	string Name(PortableData data) => data switch
+	{
+		PortableData.Follows => Localizer["Follows"],
+		PortableData.Lists => Localizer["Lists"],
+		PortableData.Blocks => Localizer["Blocked accounts"],
+		PortableData.Mutes => Localizer["Muted accounts"],
+		PortableData.ServerBlocks => Localizer["Blocked servers"],
+		_ => Localizer["Bookmarks"]
+	};
+
+	async Task Export(PortableData data)
+	{
+		exporting = data;
+		var bytes = await PortabilityService.Export(data, CascadingState.PersonaId);
+		exporting = null;
+		await DownloadFile.DownloadFileAsync(PortabilityService.FileName(data), bytes, "text/csv");
+	}
+
+	async Task Pick(InputFileChangeEventArgs eventArgs)
+	{
+		file = null;
+		report = null;
+		if (eventArgs.File.Size > MaximumFileSize)
+		{
+			Toast.AddWarning(Localizer["Supplied file \"{0}\" with size {1} exceeds the maximum of {2}.", eventArgs.File.Name,
+				eventArgs.File.Size.GetFileSize(Localizer), MaximumFileSize.GetFileSize(Localizer)]);
+			return;
+		}
+
+		try
+		{
+			using var reader = new StreamReader(eventArgs.File.OpenReadStream(MaximumFileSize));
+			file = await reader.ReadToEndAsync();
+		}
+		catch (Exception ex)
+		{
+			await Logger.ProcessError(ex, $"{nameof(DataTransfer)}.{nameof(Pick)}:{eventArgs.File.Name}");
+			Toast.AddWarning(Localizer["The file \"{0}\" could not be read.", eventArgs.File.Name]);
+		}
+	}
+
+	async Task Import()
+	{
+		importing = importKind;
+		stopping = new();
+		report = new();
+		var progress = new Progress<ImportReport>(step =>
+		{
+			report = step;
+			StateHasChanged();
+		});
+		report = await PortabilityService.Import(importKind, file, progress, stopping.Token);
+		importing = null;
+		stopping.Dispose();
+		stopping = null;
+		Toast.AddResponseSuccess(Localizer["{0} of {1} done, {2} could not be.", report.Done, report.Total, report.Failed.Count]);
+	}
+
+	void Stop() => stopping?.Cancel();
+
+	public override async ValueTask DisposeAsync()
+	{
+		stopping?.Cancel();
+		await base.DisposeAsync();
+	}
+}

Components/Settings/MutesAndBlocks.razor

@@ -0,0 +1,229 @@
+@inherits LocalizableComponentBase
+
+@* The accounts the current persona muted or blocked (/api/v1/mutes, /api/v1/blocks), and the servers it blocked
+   (/api/v1/domain_blocks), each one undone here. A server blocked hides everything from it and removes the persona's
+   followers there. *@
+@if (IsLoading)
+{
+	<p class="flex w-full items-center justify-center gap-2">
+		<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
+		@Localizer["loading"]
+	</p>
+}
+else
+{
+	<div class="flex flex-col gap-5 w-full">
+		<section class="flex flex-col gap-2" data-mutes>
+			<h3 class="font-semibold text-sm">@Localizer["Muted accounts"]</h3>
+			@if (mutes.Count == 0)
+			{
+				<p class="text-sm opacity-70">@Localizer["Nobody is muted."]</p>
+			}
+			@foreach (var account in mutes)
+			{
+				<div class="flex items-center gap-2 min-w-0" data-account-id="@account.Id">
+					<img class="size-8 rounded-full object-cover" src="@account.Avatar" alt="" />
+					<a class="flex-1 min-w-0 truncate link link-hover" href="@($"account/{Uri.EscapeDataString(account.Id)}")">
+						<b>@account.Name</b> <span class="text-xs opacity-70">@@@account.Acct</span>
+					</a>
+					<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || busy.Contains(account.Id))" OnClick="() => Undo(account, AccountAction.Unmute)">
+						@Localizer["Unmute"]
+					</DButton>
+				</div>
+			}
+			@if (mutesMaxId is not null)
+			{
+				<DButton Size="DSize.Sm" class="self-start" Disabled="IsDefaultDisabled" OnClick="MoreMutes">@Localizer["Load more"]</DButton>
+			}
+		</section>
+
+		<section class="flex flex-col gap-2" data-blocks>
+			<h3 class="font-semibold text-sm">@Localizer["Blocked accounts"]</h3>
+			@if (blocks.Count == 0)
+			{
+				<p class="text-sm opacity-70">@Localizer["Nobody is blocked."]</p>
+			}
+			@foreach (var account in blocks)
+			{
+				<div class="flex items-center gap-2 min-w-0" data-account-id="@account.Id">
+					<img class="size-8 rounded-full object-cover" src="@account.Avatar" alt="" />
+					<a class="flex-1 min-w-0 truncate link link-hover" href="@($"account/{Uri.EscapeDataString(account.Id)}")">
+						<b>@account.Name</b> <span class="text-xs opacity-70">@@@account.Acct</span>
+					</a>
+					<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || busy.Contains(account.Id))" OnClick="() => Undo(account, AccountAction.Unblock)">
+						@Localizer["Unblock"]
+					</DButton>
+				</div>
+			}
+			@if (blocksMaxId is not null)
+			{
+				<DButton Size="DSize.Sm" class="self-start" Disabled="IsDefaultDisabled" OnClick="MoreBlocks">@Localizer["Load more"]</DButton>
+			}
+		</section>
+
+		<section class="flex flex-col gap-2" data-domain-blocks>
+			<h3 class="font-semibold text-sm">@Localizer["Blocked servers"]</h3>
+			<EditForm Model="draft" OnValidSubmit="BlockDomain" class="flex flex-wrap gap-2 items-center">
+				<DInput TValue="string" class="flex-1 min-w-48" @bind-Value="draft.Domain" Immediate="true" autocomplete="off" maxlength="253"
+						placeholder="@Localizer["A server, e.g. example.social"]" data-domain-new>
+					<Prefix><i class="ion-md-globe"></i></Prefix>
+				</DInput>
+				<DButton Type="submit" Size="DSize.Sm" Color="DColor.Error" Disabled="@(IsDefaultDisabled || string.IsNullOrWhiteSpace(draft.Domain) || busy.Contains(Domain(draft.Domain)))">
+					@Localizer["Block server"]
+				</DButton>
+			</EditForm>
+			@if (domains.Count == 0)
+			{
+				<p class="text-sm opacity-70">@Localizer["No server is blocked."]</p>
+			}
+			@foreach (var domain in domains)
+			{
+				<div class="flex items-center gap-2 min-w-0" data-domain="@domain">
+					<i class="ion-md-globe opacity-70"></i>
+					<span class="flex-1 min-w-0 truncate">@domain</span>
+					<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || busy.Contains(domain))" OnClick="() => UnblockDomain(domain)">
+						@Localizer["Unblock"]
+					</DButton>
+				</div>
+			}
+		</section>
+	</div>
+}
+
+@code {
+	[Inject] AccountService AccountService { get; set; }
+
+	sealed class DomainDraft
+	{
+		public string Domain { get; set; }
+	}
+
+	List<Account> mutes = [];
+	List<Account> blocks = [];
+	List<string> domains = [];
+	string mutesMaxId;
+	string blocksMaxId;
+	DomainDraft draft = new();
+	// the accounts and servers whose undo is on its way
+	HashSet<string> busy = [];
+	string loadedPersonaId;
+
+	protected override async Task OnParametersSetAsync()
+	{
+		if (CascadingState.PersonaId == loadedPersonaId)
+			return;
+		loadedPersonaId = CascadingState.PersonaId;
+
+		if (CascadingState.IsOffline)
+		{
+			WhenOnline(LoadData);
+			StartOnlinePolling();
+			IsLoading = false;
+			return;
+		}
+
+		await LoadData();
+		IsLoading = false;
+	}
+
+	async Task LoadData()
+	{
+		mutes = [];
+		blocks = [];
+		mutesMaxId = null;
+		blocksMaxId = null;
+		await Task.WhenAll(MoreMutes(), MoreBlocks());
+		domains = await AccountService.DomainBlocks();
+	}
+
+	async Task MoreMutes()
+	{
+		var result = await AccountService.Mutes(mutesMaxId);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		var page = (AccountPage)result.Data;
+		mutes.AddRange(page.Accounts.Where(a => mutes.All(m => m.Id != a.Id)));
+		mutesMaxId = page.MaxId;
+	}
+
+	async Task MoreBlocks()
+	{
+		var result = await AccountService.Blocks(blocksMaxId);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		var page = (AccountPage)result.Data;
+		blocks.AddRange(page.Accounts.Where(a => blocks.All(b => b.Id != a.Id)));
+		blocksMaxId = page.MaxId;
+	}
+
+	async Task Undo(Account account, AccountAction action)
+	{
+		busy.Add(account.Id);
+		var result = await AccountService.Act(account.Id, action);
+		busy.Remove(account.Id);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		if (action is AccountAction.Unmute)
+			mutes.RemoveAll(m => m.Id == account.Id);
+		else
+			blocks.RemoveAll(b => b.Id == account.Id);
+	}
+
+	// what a person types as a server (a URL, a handle's host, any case) as the bare host PrivaPub keys it by
+	static string Domain(string typed)
+	{
+		var text = typed?.Trim().TrimStart('@') ?? "";
+		if (Uri.TryCreate(text.Contains("://") ? text : "https://" + text, UriKind.Absolute, out var uri))
+			text = uri.Host;
+		return text.ToLowerInvariant();
+	}
+
+	async Task BlockDomain()
+	{
+		var domain = Domain(draft.Domain);
+		if (domain.Length == 0 || domains.Contains(domain))
+		{
+			draft = new();
+			return;
+		}
+
+		busy.Add(domain);
+		var result = await AccountService.BlockDomain(domain);
+		busy.Remove(domain);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		draft = new();
+		domains = [.. domains.Append(domain).Order()];
+		Toast.AddResponseSuccess(Localizer["{0} is blocked.", domain]);
+	}
+
+	async Task UnblockDomain(string domain)
+	{
+		busy.Add(domain);
+		var result = await AccountService.UnblockDomain(domain);
+		busy.Remove(domain);
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		domains.Remove(domain);
+	}
+}

Components/Settings/PersonasEditor.razor

@@ -0,0 +1,78 @@
+@inherits LocalizableComponentBase
+
+@* The root's personas (/clientapi/avatar/private): each one used in turn, and a new one made. Personas are never linked
+   to one another: no server, PrivaPub's included, shows that they share a root. *@
+<div class="flex flex-col gap-4 w-full" data-personas>
+	<div class="flex flex-col gap-2">
+		@foreach (var persona in CascadingState.Personas)
+		{
+			<div class="flex items-center gap-2 min-w-0" data-persona="@persona.UserName">
+				<img class="size-8 rounded-full object-cover" src="@(persona.PictureURL ?? "imgs/icon-192.png")" alt="" />
+				<span class="flex-1 min-w-0 truncate"><b>@(persona.Name ?? persona.UserName)</b> <span class="text-xs opacity-70">@persona.Handle</span></span>
+				@if (persona.Id == CascadingState.PersonaId)
+				{
+					<DBadge Size="DSize.Sm" Variant="DBadgeVariant.Soft" Color="DColor.Primary">@Localizer["in use"]</DBadge>
+				}
+				else
+				{
+					<DButton Size="DSize.Sm" Disabled="@(IsDefaultDisabled || switching is not null)" OnClick="() => Use(persona)">@Localizer["Use"]</DButton>
+				}
+			</div>
+		}
+	</div>
+
+	<EditForm Model="form" OnValidSubmit="Create" class="flex flex-col gap-2 p-3 rounded-xl neo-inset neo-2xs" data-persona-new>
+		<DataAnnotationsValidator />
+		<b class="text-sm">@Localizer["A new persona"]</b>
+		<div class="flex flex-wrap gap-2">
+			<DInput TValue="string" class="flex-1 min-w-40" @bind-Value="form.UserName" Immediate="true" autocomplete="off"
+					maxlength="@PrivaPub.ClientModels.Constants.MaxAvatarNameLength" placeholder="@Localizer["user name (a-z, 0-9, _)"]" data-persona-username>
+				<Prefix>@@</Prefix>
+			</DInput>
+			<DInput TValue="string" class="flex-1 min-w-40" @bind-Value="form.Name" Immediate="true" autocomplete="off"
+					maxlength="@PrivaPub.ClientModels.Constants.MaxAvatarNameLength" placeholder="@Localizer["Display name"]" data-persona-name />
+		</div>
+		<DTextarea @bind-Value="form.Biography" Immediate="true" rows="3" autocomplete="off" maxlength="@ProfileForm.NoteLength"
+				   placeholder="@Localizer["Biography"]" data-persona-biography />
+		<ErrorViewer />
+		<DButton Type="submit" Size="DSize.Sm" Color="DColor.Primary" class="self-end" Disabled="@(IsDefaultDisabled || isSaving)" data-persona-create>
+			<i class="ion-md-person-add"></i><span>@Localizer["Make the persona"]</span>
+		</DButton>
+	</EditForm>
+</div>
+
+@code {
+	[Inject] AuthService AuthService { get; set; }
+
+	InsertAvatarForm form = new();
+	bool isSaving;
+	string switching;
+
+	protected override void OnInitialized() => IsLoading = false;
+
+	async Task Use(ViewAvatar persona)
+	{
+		switching = persona.Id;
+		var result = await CascadingState.SwitchPersona(persona.Id);
+		switching = null;
+		if (result.IsInvalid)
+			Toast.AddResponseError(result);
+	}
+
+	async Task Create()
+	{
+		isSaving = true;
+		form.UserName = form.UserName?.Trim().TrimStart('@').ToLowerInvariant();
+		var result = await AuthService.CreatePersona(form);
+		isSaving = false;
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		form = new();
+		await CascadingState.ReloadPersonas();
+		Toast.AddResponseSuccess(Localizer["Persona made."]);
+	}
+}

Components/Settings/ProfileEditor.razor

@@ -0,0 +1,210 @@
+@inherits LocalizableComponentBase
+
+@* The current persona's profile (/api/v1/accounts/update_credentials): its pictures, name, biography and fields as it
+   wrote them, whether it approves followers by hand, is a bot, is listed and searchable, and how its new posts start.
+   PrivaPub tells the persona's followers' servers of the change. *@
+@if (IsLoading)
+{
+	<p class="flex w-full items-center justify-center gap-2">
+		<DLoading Variant="DLoadingVariant.Dots" LabelText="@Localizer["loading"]" />
+		@Localizer["loading"]
+	</p>
+}
+else if (account is null)
+{
+	<p class="w-full text-center"><i class="ion-ios-remove-circle-outline"></i> @Localizer["No persona"]</p>
+}
+else
+{
+	<EditForm Model="form" OnValidSubmit="Save" class="flex flex-col gap-4 w-full" data-profile-editor>
+		<div class="relative w-full">
+			<img class="w-full h-28 md:h-36 object-cover rounded-xl" src="@(form.Header?.Base64Preview ?? account.Header)" alt="@Localizer["Header"]" />
+			<img class="absolute -bottom-6 left-4 size-20 rounded-full object-cover neo-raised neo-xs" src="@(form.Avatar?.Base64Preview ?? account.Avatar)"
+				 alt="@Localizer["Avatar"]" />
+		</div>
+		<div class="flex flex-wrap gap-3 pt-6">
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["Avatar"]</span>
+				<DFileInput Size="DSize.Sm" Accept="image/png,image/jpeg,image/gif,image/webp" OnChange="e => Pick(e, true)" data-profile-avatar />
+			</label>
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["Header"]</span>
+				<DFileInput Size="DSize.Sm" Accept="image/png,image/jpeg,image/gif,image/webp" OnChange="e => Pick(e, false)" data-profile-header />
+			</label>
+		</div>
+
+		<label class="flex flex-col gap-1 max-w-md">
+			<span class="text-sm">@Localizer["Display name"]</span>
+			<DInput TValue="string" @bind-Value="form.DisplayName" Immediate="true" autocomplete="off" maxlength="@ProfileForm.DisplayNameLength"
+					data-profile-name />
+		</label>
+		<label class="flex flex-col gap-1">
+			<span class="text-sm">@Localizer["Biography"]</span>
+			<DTextarea @bind-Value="form.Note" Immediate="true" rows="4" autocomplete="off" maxlength="@ProfileForm.NoteLength" data-profile-note />
+			<span class="text-xs opacity-70 tabular-nums self-end">@(form.Note?.Length ?? 0)/@ProfileForm.NoteLength</span>
+		</label>
+
+		<fieldset class="flex flex-col gap-2">
+			<legend class="text-sm font-semibold pb-1">@Localizer["Profile fields"]</legend>
+			@foreach (var field in form.Fields)
+			{
+				<div class="flex flex-wrap gap-2" data-profile-field="@form.Fields.IndexOf(field)">
+					<DInput TValue="string" class="flex-1 min-w-36" @bind-Value="field.Name" Immediate="true" autocomplete="off"
+							maxlength="@ProfileForm.FieldLength" placeholder="@Localizer["Label"]" />
+					<DInput TValue="string" class="flex-[2] min-w-48" @bind-Value="field.Value" Immediate="true" autocomplete="off"
+							maxlength="@ProfileForm.FieldLength" placeholder="@Localizer["Content"]" />
+				</div>
+			}
+		</fieldset>
+
+		<div class="flex flex-col gap-3">
+			<DToggle LabelText="@Localizer["Approve followers by hand"]" @bind-Value="form.Locked" data-profile-locked />
+			<DToggle LabelText="@Localizer["This persona is automated (a bot)"]" @bind-Value="form.Bot" />
+			<DToggle LabelText="@Localizer["List it in the directory and suggest it to others"]" @bind-Value="form.Discoverable" />
+			<DToggle LabelText="@Localizer["Let its public posts be found by search"]" @bind-Value="form.Indexable" />
+		</div>
+
+		<fieldset class="flex flex-wrap gap-4">
+			<legend class="text-sm font-semibold pb-1">@Localizer["New posts"]</legend>
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["Visibility"]</span>
+				<DSelect TValue="MessageType" Size="DSize.Sm" @bind-Value="form.Privacy" data-profile-privacy>
+					@foreach (var type in Visibilities)
+					{
+						<option value="@type">@Localizer[type.ToString()]</option>
+					}
+				</DSelect>
+			</label>
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["Language"]</span>
+				<DSelect TValue="string" Size="DSize.Sm" @bind-Value="form.Language">
+					<option value="">—</option>
+					@foreach (var (languageCode, languageName) in Languages.All)
+					{
+						<option value="@languageCode">@languageName</option>
+					}
+				</DSelect>
+			</label>
+			<label class="flex flex-col gap-1 text-sm">
+				<span>@Localizer["Who may quote them"]</span>
+				<DSelect TValue="QuotePolicy" Size="DSize.Sm" @bind-Value="form.QuotePolicy">
+					@foreach (var policy in Enum.GetValues<QuotePolicy>())
+					{
+						<option value="@policy">@QuotePolicyName(policy)</option>
+					}
+				</DSelect>
+			</label>
+			<DToggle class="self-end" LabelText="@Localizer["Mark media as sensitive"]" @bind-Value="form.Sensitive" />
+		</fieldset>
+
+		<ErrorViewer AdditionalErrors="pictureErrors" />
+
+		<div class="flex flex-wrap gap-2 justify-end">
+			<DButton Size="DSize.Sm" OnClick="Reset" Disabled="@(IsDefaultDisabled || isSaving)">@Localizer["Reset"]</DButton>
+			<DButton Type="submit" Size="DSize.Sm" Color="DColor.Primary" Disabled="@(IsDefaultDisabled || isSaving)" data-profile-save>
+				<i class="ion-md-checkmark"></i><span>@Localizer["Save"]</span>
+			</DButton>
+		</div>
+	</EditForm>
+}
+
+@code {
+	[Inject] AccountService AccountService { get; set; }
+	[Inject] AuthService AuthService { get; set; }
+	[Inject] ILoggingService Logger { get; set; }
+
+	// PrivaPub keeps pictures up to 20 MB and resizes them
+	const long MaximumPictureSize = 20 * 1024 * 1024;
+	static readonly MessageType[] Visibilities = [MessageType.Public, MessageType.Unlisted, MessageType.FollowersOnly];
+
+	Account account;
+	ProfileForm form = new();
+	string loadedPersonaId;
+	bool isSaving;
+	List<string> pictureErrors = [];
+
+	protected override async Task OnParametersSetAsync()
+	{
+		if (CascadingState.PersonaId == loadedPersonaId)
+			return;
+		loadedPersonaId = CascadingState.PersonaId;
+
+		if (CascadingState.IsOffline)
+		{
+			WhenOnline(LoadData);
+			StartOnlinePolling();
+			IsLoading = false;
+			return;
+		}
+
+		await LoadData();
+		IsLoading = false;
+	}
+
+	async Task LoadData()
+	{
+		// the account as the persona sees itself, with its Source
+		account = await AuthService.CurrentAccount();
+		Reset();
+	}
+
+	void Reset()
+	{
+		pictureErrors = [];
+		form = account is null ? new() : ProfileForm.Of(account);
+	}
+
+	string QuotePolicyName(QuotePolicy policy) => policy switch
+	{
+		QuotePolicy.Followers => Localizer["Its followers"],
+		QuotePolicy.Nobody => Localizer["Nobody"],
+		_ => Localizer["Anyone"]
+	};
+
+	async Task Pick(InputFileChangeEventArgs eventArgs, bool isAvatar)
+	{
+		pictureErrors = [];
+		var file = eventArgs.File;
+		if (file.Size > MaximumPictureSize)
+		{
+			pictureErrors.Add(Localizer["Supplied file \"{0}\" with size {1} exceeds the maximum of {2}.", file.Name,
+				file.Size.GetFileSize(Localizer), MaximumPictureSize.GetFileSize(Localizer)]);
+			return;
+		}
+
+		try
+		{
+			using var memoryStream = new MemoryStream();
+			await using var fileStream = file.OpenReadStream(MaximumPictureSize);
+			await fileStream.CopyToAsync(memoryStream);
+			var picture = new UploadMedia { FileName = file.Name, ContentType = file.ContentType, Size = file.Size, Blob = memoryStream.ToArray() };
+			picture.Base64Preview = $"data:{picture.ContentType};base64,{Convert.ToBase64String(picture.Blob)}";
+			if (isAvatar)
+				form.Avatar = picture;
+			else
+				form.Header = picture;
+		}
+		catch (Exception ex)
+		{
+			await Logger.ProcessError(ex, $"{nameof(ProfileEditor)}.{nameof(Pick)}:{file.Name}");
+			pictureErrors.Add(Localizer["The file \"{0}\" could not be read.", file.Name]);
+		}
+	}
+
+	async Task Save()
+	{
+		isSaving = true;
+		var result = await AccountService.UpdateProfile(form);
+		isSaving = false;
+		if (result.IsInvalid)
+		{
+			Toast.AddResponseError(result);
+			return;
+		}
+
+		account = (Account)result.Data;
+		CascadingState.PersonaChanged(account);
+		Reset();
+		Toast.AddResponseSuccess(Localizer["Profile saved."]);
+	}
+}