¿Cómo puedo cambiar el texto "No se pudo volver a conectar al servidor" en Blazor?

Estoy usando el lado del servidor Blazor.

Cuando la aplicación Blazor se desconecte al servidor remoto, mostrará esto:

Quiero cambiar el texto ('No se pudo volver a conectar al servidor ...', etc.) de la imagen de arriba.

Quiero cambiarlo al idioma de nuestro país.

Encontré el archivo del proyecto pero no encontré nada al respecto.

¿Cómo puedo cambiarlo? Gracias.

La aplicación Blazor verificará si hay un elemento html con id ={dialogId} en la página:

1. Si dicho elemento no existe, utilizará el controlador predeterminado para mostrar el mensaje.
2. Si este elemento existe, este elemento classserá:
   • establecido como components-reconnect-showcuando intente volver a conectarse al servidor,
   • establecido como components-reconnect-failedcuando no pudo conectarse al servidor.
   • configurado como components-reconnect-refusedsi el navegador llegara al servidor mientras el servidor rechaza la conexión activamente

Por defecto, el dialogIdes components-reconnect-modal. Por lo tanto, puede crear un elemento en la página y usar CSS para controlar el contenido y los estilos que desee.

Manifestación:

Por ejemplo, creo tres partes de contenido para mostrar dentro de Pages/_Host.cshtml:

<div id="components-reconnect-modal" class="my-reconnect-modal components-reconnect-hide">
    <div class="show">
        <p>
            This is the message when attempting to connect to server
        </p>
    </div>
    <div class="failed">
        <p>
            This is the custom message when failing 
        </p>
    </div>
    <div class="refused">
        <p>
            This is the custom message when refused
        </p>
    </div>
</div>

<app>
    @(await Html.RenderComponentAsync<App>(RenderMode.ServerPrerendered))
</app>

<script src="_framework/blazor.server.js"></script>

Y luego agreguemos un poco de CSS para controlar el estilo:

<style>
    .my-reconnect-modal > div{
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
        overflow: hidden;
        background-color: #fff;
        opacity: 0.8;
        text-align: center;
        font-weight: bold;
    }
    .components-reconnect-hide > div
    {
        display: none;
    }

    .components-reconnect-show > div
    {
        display: none;
    }
    .components-reconnect-show > .show
    {
        display: block;
    }

    .components-reconnect-failed > div
    {
        display: none;
    }
    .components-reconnect-failed > .failed
    {
        display: block;
    }

    .components-reconnect-refused >div
    {
        display: none;
    }
    .components-reconnect-refused > .refused
    {
        display: block;
    }
</style>

Finalmente, recibiremos el siguiente mensaje cuando intentemos conectarnos o no podamos conectarnos:

Para el lado de JavaScript de las cosas, Blazor expone una pequeña API a través del window.Blazorobjeto.

Una parte de esta API es la defaultReconnectionHandlerque le permite personalizar la experiencia de reconexión, incluida la configuración de diferentes opciones para la cantidad de repeticiones, etc.

Sin embargo, también es posible cambiar la lógica para mostrar el ReconnectionDisplay

Una implementación simple se ve así y le permite controlar el proceso:

function createOwnDisplay() {
    return {
        show: () => { alert("put code that shows a toast , ui, or whaterver here"); },
        hide: () => { console.log('foo'); },
        failed: () => { console.log('foo'); },
        rejected: () => { console.log('foo'); }
    };
}

Blazor.defaultReconnectionHandler._reconnectionDisplay = createOwnDisplay();