Files
decePubClient/Pages/Settings.razor
T
thepraandClaude Opus 5.5 7d4b35f0d7 R2 accounts in decePub: forgotten password, email by code, sessions, the theme kept with the login
Completion program R2, with PrivaPub's routes of the same release.

- Pages/PasswordRecovery.razor (/password-recovery): asks for a login or an address and shows the server's one
  sentence; with ?rc= it takes the code out of the address bar at once, checks it and sets a new password. Login links
  there ("Forgot your password?").
- Settings, the login: its email address with a verified badge, changed with the password and the code emailed to it
  (DOtp), removed with the password; "Sign out everywhere" (every device and persona, asked first).
- A password change takes the new JWT PrivaPub answers and exchanges the persona's token again, since every persona
  token ended with it.
- The theme kept with the login (PageSettings.SyncWithLogin, Settings > General): taken at sign-in and start-up once a
  client saved it, saved 1.5 s after a change here, never posted back when nothing changed, never the language.
- Login, Setup and Join start the session through CascadingState.SignedIn, which takes the login's theme.
- 38 keys in both resx files; CLAUDE.md follows.

Verified: dotnet build decePubClient.csproj -c Release (0 errors, no new warnings).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WpVCoDeM1qUTRp4fXQdfof
2026-10-17 03:21:59 +02:00

210 lines
7.5 KiB
Plaintext

@page "/settings"
@inherits LocalizableComponentBase
<Title>@Localizer["Settings"]</Title>
<section class="block relative w-full h-full neo-inset neo-xs rounded-xl">
<div class="flex flex-col gap-4 p-4 md:p-5 w-full h-full absolute overflow-y-auto">
<DCollapse Icon="DCollapseIcon.Arrow" IsOpen="true">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-cog text-xl"></i> <span>@Localizer["General"]</span>
</p>
</Header>
<ChildContent>
@* Every theme setting; NavMenu's toggle and slider are shortcuts to the dark and hue ones. *@
<div class="flex flex-col gap-4 w-full p-3 md:p-4">
<DToggle LabelText="@Localizer["Follow the system's light or dark setting"]" Value="CascadingState.PublicCacheData.PageSettings.PreferSystemTheming"
ValueChanged="v => Update(s => s.PreferSystemTheming = v)" ValueExpression="() => CascadingState.PublicCacheData.PageSettings.PreferSystemTheming" />
<DToggle LabelText="@Localizer["Dark mode"]" Value="IsDark"
ValueChanged="v => Update(s => s.SetDarkMode(v))" ValueExpression="() => IsDark" />
<DToggle LabelText="@Localizer["Grey"]" Value="IsGray"
ValueChanged="v => Update(s => s.SetGray(v, IsDark))" ValueExpression="() => IsGray" />
@* The theme is the login's: taken at sign-in, saved to it as it changes here (CascadingState.SaveSettingsSoon). *@
<DToggle LabelText="@Localizer["Keep the theme the same on every device signed in to this login"]" Value="CascadingState.PublicCacheData.PageSettings.SyncWithLogin"
ValueChanged="v => Update(s => s.SyncWithLogin = v)" ValueExpression="() => CascadingState.PublicCacheData.PageSettings.SyncWithLogin"
data-sync-with-login />
<DToggle LabelText="@Localizer["Remind me to describe pictures before publishing"]" Value="CascadingState.PublicCacheData.PageSettings.RemindAltText"
ValueChanged="v => Update(s => s.RemindAltText = v)" ValueExpression="() => CascadingState.PublicCacheData.PageSettings.RemindAltText"
data-remind-alt-text />
<label class="flex flex-col gap-2 max-w-md">
<span class="text-sm">@Localizer["Language"]</span>
@* Language names stay in their own language. Changing it reloads the app with the new culture. *@
<DSelect TValue="string" class="w-full" Value="CascadingState.PublicCacheData.PageSettings.CurrentLanguageCode"
ValueChanged="ChangeLanguage" ValueExpression="() => CascadingState.PublicCacheData.PageSettings.CurrentLanguageCode">
<option value="en">English</option>
<option value="it">Italiano</option>
</DSelect>
</label>
<label class="flex flex-col gap-2 max-w-md">
<span class="text-sm">@Localizer["Light theme colour"]</span>
<DRange TValue="short" class="neo-hue-track w-full" Size="DSize.Xs" Min="0" Max="359" Step="1"
Value="CascadingState.PublicCacheData.PageSettings.LightThemeIndexColour" ValueChanged="v => Update(s => s.SetHue(false, v))"
ValueExpression="() => CascadingState.PublicCacheData.PageSettings.LightThemeIndexColour" />
</label>
<label class="flex flex-col gap-2 max-w-md">
<span class="text-sm">@Localizer["Dark theme colour"]</span>
<DRange TValue="short" class="neo-hue-track w-full" Size="DSize.Xs" Min="0" Max="359" Step="1"
Value="CascadingState.PublicCacheData.PageSettings.DarkThemeIndexColour" ValueChanged="v => Update(s => s.SetHue(true, v))"
ValueExpression="() => CascadingState.PublicCacheData.PageSettings.DarkThemeIndexColour" />
</label>
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-funnel text-xl"></i> <span>@Localizer["Filters"]</span>
</p>
</Header>
<ChildContent>
<div class="flex flex-wrap items-center gap-3 w-full p-3 md:p-4">
<p class="flex-1 min-w-48 text-sm">@Localizer["Words, phrases and posts this persona would rather not see, and where."]</p>
<a class="btn btn-sm" href="filters"><i class="ion-md-funnel"></i><span>@Localizer["Manage filters"]</span></a>
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2" data-settings-account>
<i class="ion-md-key text-xl"></i> <span>@Localizer["Login"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<AccountEditor />
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-people text-xl"></i> <span>@Localizer["Personas"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<PersonasEditor />
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-person text-xl"></i> <span>@Localizer["Profile"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<ProfileEditor />
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-archive text-xl"></i> <span>@Localizer["Data import/export"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<div class="flex flex-col gap-6">
<PersonaArchivePanel />
<DataTransfer />
</div>
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-notifications text-xl"></i> <span>@Localizer["Notifications"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<NotificationPolicyEditor />
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
<DCollapse Icon="DCollapseIcon.Arrow">
<Header>
<p class="inline-flex items-center gap-2">
<i class="ion-md-eye-off text-xl"></i> <span>@Localizer["Mutes/Blocks"]</span>
</p>
</Header>
<ChildContent>
<div class="block w-full p-3 md:p-4">
@if (CascadingState.IsSignedIn)
{
<MutesAndBlocks />
}
else
{
<a class="link" href="login">@Localizer["Sign in to PrivaPub"]</a>
}
</div>
</ChildContent>
</DCollapse>
</div>
</section>
@code {
bool IsDark => CascadingState.Status.IsDarkTheme();
bool IsGray => CascadingState.PublicCacheData.PageSettings.IsGray();
Task Update(Action<PageSettings> change) => CascadingState.UpdatePageSettings(change).AsTask();
async Task ChangeLanguage(string languageCode)
{
await Update(settings => settings.CurrentLanguageCode = languageCode);
Navigation.NavigateTo(Navigation.Uri, forceLoad: true);
}
}