Skip to content

Customize UI when circuit is paused #36534

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
guardrex merged 2 commits into from
Jan 13, 2026
Merged

Customize UI when circuit is paused #36534

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d134445
Customize UI when circuit is paused
guardrex Dec 23, 2025
4dd8af7
Update aspnetcore/blazor/fundamentals/signalr.md
guardrex Dec 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions aspnetcore/blazor/fundamentals/signalr.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -507,7 +507,7 @@ In the `Program` file, call <xref:Microsoft.AspNetCore.Builder.ComponentEndpoint

## Reflect the server-side connection state in the UI

If the client detects a lost connection to the server, a default UI is displayed to the user while the client attempts to reconnect:
If the client detects a lost connection (circuit) to the server, a default UI is displayed to the user while the client attempts to reconnect:

:::moniker range=">= aspnetcore-9.0"

Expand Down Expand Up @@ -541,12 +541,13 @@ If reconnection succeeds, user state is often lost. Custom code can be added to

To create UI elements that track reconnection state, the following table describes:

* A set of `components-reconnect-*` CSS classes (**Css class** column) that are set or unset by Blazor on an element with an `id` of `components-reconnect-modal`.
* A set of `components-reconnect-*` CSS classes (**CSS class** column) that are set or unset by Blazor on an element with an `id` of `components-reconnect-modal`.
* A `components-reconnect-state-changed` event (**Event** column) that indicates a reconnection status change.

| CSS class | Event | Indicates&hellip; |
| --- | --- | --- |
| `components-reconnect-show` | `show` | A lost connection. The client is attempting to reconnect. The reconnection modal is shown. |
| `components-reconnect-paused` | `paused` | The connection is paused. For more information, see [Pause and resume circuits](xref:blazor/state-management/server#pause-and-resume-circuits). |
| `components-reconnect-hide` | `hide` | An active connection is re-established to the server. The reconnection model is closed. |
| `components-reconnect-retrying` | `retrying` | The client is attempting to reconnect. |
| `components-reconnect-failed` | `failed` | Reconnection failed, probably due to a network failure. |
Expand Down