feat: establish NekoNest Cloud control and relay
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
"use client";
|
||||
|
||||
import { useSyncExternalStore } from "react";
|
||||
|
||||
function subscribeToConnectivity(onStoreChange: () => void) {
|
||||
const handleOnline = () => onStoreChange();
|
||||
const handleOffline = () => onStoreChange();
|
||||
|
||||
window.addEventListener("online", handleOnline);
|
||||
window.addEventListener("offline", handleOffline);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("online", handleOnline);
|
||||
window.removeEventListener("offline", handleOffline);
|
||||
};
|
||||
}
|
||||
|
||||
function getOfflineSnapshot() {
|
||||
return !navigator.onLine;
|
||||
}
|
||||
|
||||
function getServerOfflineSnapshot() {
|
||||
return false;
|
||||
}
|
||||
|
||||
export function ConnectivityBanner() {
|
||||
const offline = useSyncExternalStore(
|
||||
subscribeToConnectivity,
|
||||
getOfflineSnapshot,
|
||||
getServerOfflineSnapshot,
|
||||
);
|
||||
|
||||
if (!offline) return null;
|
||||
|
||||
return (
|
||||
<div className="connectivity-banner" role="status" aria-live="polite">
|
||||
<strong>当前设备离线</strong>
|
||||
<span>
|
||||
页面内容可能已经过期。恢复网络后请重新加载;已提交的操作先核对状态,避免重复。
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user