Offline: what to hold back and what to refuse

An agent app is mostly a conversation with a server. When the connection goes, the honest screen says so, keeps what the person typed, and doesn't pretend that anything was sent.

Composer has two states for this, and they differ. { kind: "offline" } locks the box: it is disabled and shows its reason, which defaults to "You're offline. Your message will wait here." or your own text through reason. Use it only if your app really does keep the message, because the default sentence promises it and a locked box can't take new text. { kind: "held", reason } keeps typing open and says why sending waits, which suits an app that queues. Either way, the send button does nothing until you change the state back to ready.

Deciding that the app is offline is the hard part. navigator.onLine is a boolean, and the online and offline events fire on window when it changes, but MDN calls it inherently unreliable: true only means a network connection, not that your server can be reached, and it can lag after a connection drops. It advises showing hints from it and not disabling features. So treat it as a hint, and move the composer to offline or held when a request to your own server actually fails.

PageState draws a page that can't load. Its offline kind is for a service that can't be reached from here: it has its own icon and is announced as an error is. Give it a title that says the connection is the cause and one action to retry. Use error, with the request id, when your server answered with a failure. Don't use unavailable, which means the page doesn't exist or isn't the person's, and never reveals which.