From C#

@inject ISednaUi Ui
@inject IOrderService Orders

@code {
    private Order? _order;
    private string? _failure;     // decided while prerendering, said once interactive

    protected override async Task OnInitializedAsync()
    {
        try { _order = await Orders.GetAsync(Id); }
        catch (OrderNotFoundException) { _failure = $"Order {Id} no longer exists."; }
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        // The first render with a circuit behind it. Interop works from here, and it
        // runs once, so the toast is shown once.
        if (!firstRender || _failure is null) return;
        await Ui.ToastAsync(_failure, ToastKind.Danger, timeoutMs: 0);
    }
}

@inject ISednaSettings Settings
@implements IDisposable

<div class="sedna-col sedna-gap-2">
    <div class="segmented">
        <label class="segmented-option">
            <input type="radio" name="ex-variant" checked="@(Settings.Current.Variant == "dark")"
                   @onchange="@(() => Settings.SetVariantAsync("dark"))" />
            <span><i class="ri-moon-line"></i> Dark</span>
        </label>
        <label class="segmented-option">
            <input type="radio" name="ex-variant" checked="@(Settings.Current.Variant == "light")"
                   @onchange="@(() => Settings.SetVariantAsync("light"))" />
            <span><i class="ri-sun-line"></i> Light</span>
        </label>
        <label class="segmented-option">
            <input type="radio" name="ex-variant" checked="@(Settings.Current.Variant == "system")"
                   @onchange="@(() => Settings.SetVariantAsync("system"))" />
            <span><i class="ri-computer-line"></i> System</span>
        </label>
    </div>

    <div class="card">
        <div class="card-body">
            <div class="kv"><span class="k">Variant</span><span class="v">@Settings.Current.Variant</span></div>
            <div class="kv"><span class="k">Theme</span><span class="v">@Settings.Current.Theme</span></div>
            <div class="kv"><span class="k">Compact</span><span class="v">@Settings.Current.Compact</span></div>
            <div class="kv"><span class="k">Read from the browser</span><span class="v">@Settings.IsLive</span></div>
        </div>
    </div>
</div>

@code {
    // Subscribe before StartAsync, so the initial value arrives as a change like any other and
    // this component has one code path instead of two.
    protected override void OnInitialized() => Settings.Changed += Refresh;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender) await Settings.StartAsync();
    }

    // Raised from a JavaScript callback, so the render has to be marshalled onto the circuit's
    // thread. Calling StateHasChanged directly here throws.
    private void Refresh(SednaUiSettings settings) => InvokeAsync(StateHasChanged);

    public void Dispose() => Settings.Changed -= Refresh;
}

@inject ISednaUi Ui

<div class="card">
    <div class="card-body">
        <div class="kv"><span class="k">Browser time zone</span><span class="v">@(_zone ?? "not read yet")</span></div>
        <div class="kv"><span class="k">Stored instant</span><span class="v">@Stored</span></div>
        <div class="kv"><span class="k">On this reader's clock</span><span class="v">@Local</span></div>
    </div>
</div>

@code {
    // What an app stores: an instant in UTC. The zone is the one part of rendering it
    // that only the browser knows. This one is half an hour before Europe's spring
    // transition, which is why an offset would not do — it is true until it is not.
    private static readonly DateTime Instant = new(2027, 3, 28, 0, 30, 0, DateTimeKind.Utc);

    // The configured fallback: what the first server render has to use, because it has
    // no browser to ask and no cookie on a first visit.
    private TimeZoneInfo _zoneInfo = TimeZoneInfo.Utc;
    private string? _zone;

    private string Stored => Instant.ToString("yyyy-MM-dd HH:mm") + " UTC";

    private string Local =>
        TimeZoneInfo.ConvertTimeFromUtc(Instant, _zoneInfo).ToString("yyyy-MM-dd HH:mm")
        + " (" + _zoneInfo.Id + ")";

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (!firstRender) return;

        // Interop, so never during prerendering. An IANA id — TryFindSystemTimeZoneById
        // takes those on every platform, and a browser that reports nothing leaves the
        // fallback standing rather than guessing.
        _zone = await Ui.GetTimeZoneAsync();
        if (_zone is not null && TimeZoneInfo.TryFindSystemTimeZoneById(_zone, out var found))
        {
            _zoneInfo = found;
        }

        StateHasChanged();
    }
}