17 lines
699 B
TypeScript
17 lines
699 B
TypeScript
|
// ConnectionBanner: top strip surfacing connection loss. The atom is pure:
|
|||
|
|
// the owner subscribes to connection state and passes `reconnecting` down.
|
|||
|
|
// A null/connecting state upstream should stay quiet too — only an actual
|
|||
|
|
// outage (reconnect backoff in progress) shows the strip.
|
|||
|
|
|
|||
|
|
import css from './ConnectionBanner.module.css'
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* Render the reconnecting banner.
|
|||
|
|
* @param props.reconnecting - true while the connection is in backoff/retry.
|
|||
|
|
* @returns the banner, or null when connected.
|
|||
|
|
*/
|
|||
|
|
export function ConnectionBanner({ reconnecting }: { reconnecting: boolean }) {
|
|||
|
|
if (!reconnecting) return null
|
|||
|
|
return <div className={css.banner}>连接已断开，正在重连…</div>
|
|||
|
|
}
|