diff --git a/app/web/src/nova/ed/ed-base.tsx b/app/web/src/nova/ed/ed-base.tsx
index bff9aa1c..545402cf 100644
--- a/app/web/src/nova/ed/ed-base.tsx
+++ b/app/web/src/nova/ed/ed-base.tsx
@@ -20,10 +20,12 @@ import { EdPopScript } from "./panel/popup/script/pop-script";
 import { EdPopSite } from "./panel/popup/site/site-popup";
 import { iconVSCode } from "./panel/popup/code/icons";
 import { isLocalhost } from "../../utils/ui/is-localhost";
+import { w } from "../../utils/types/general";
 
 export const EdBase = () => {
   const p = useGlobal(EDGlobal, "EDITOR");
 
+  w.editorRender = p.render;
   edUndoManager(p);
 
   if (p.status === "init") {
@@ -135,6 +137,26 @@ export const EdBase = () => {
           />
         </div>
       )}
+
+      {w.offline && <div
+        className={cx(
+          css`
+                      position: fixed;
+                      bottom: 20px;
+                      left: 0px;
+                      right: 0px;
+                      z-index: 999;
+                    `,
+          "flex justify-center cursor-pointer"
+        )}
+      >
+        <div
+          className="bg-red-500 text-white px-4 py-2 rounded-full text-sm"
+        >
+          Reconnecting, changes are not saved...
+        </div>
+      </div>
+      }
     </div>
   );
 };
diff --git a/app/web/src/nova/ed/logic/ed-global.ts b/app/web/src/nova/ed/logic/ed-global.ts
index bf0e0f79..48bf5ce3 100644
--- a/app/web/src/nova/ed/logic/ed-global.ts
+++ b/app/web/src/nova/ed/logic/ed-global.ts
@@ -157,7 +157,7 @@ export const EDGlobal = {
   script: {
     site_types: {} as Record<string, string>,
     loaded: false,
-    do_edit: async (newval: string, all?: boolean) => {},
+    do_edit: async (newval: string, all?: boolean) => { },
     db: null as any,
     api: null as any,
     init_local_effect: {} as Record<string, boolean>,
@@ -182,7 +182,7 @@ export const EDGlobal = {
     meta: {} as Record<string, IMeta>,
     entry: [] as string[],
     tree: [] as NodeModel<IMeta>[],
-    render: () => {},
+    render: () => { },
   },
   comp: {
     doc: null as null | DComp,
@@ -295,9 +295,9 @@ export const EDGlobal = {
         type: "item" as "item" | "prop-master" | "prop-instance" | "comp-types",
         prop_kind: "" as PropFieldKind,
         prop_name: "",
-        on_close: () => {},
+        on_close: () => { },
         typings: { status: "ok" as "ok" | "loading" | "error", err_msg: "" },
-        wb_render: () => {},
+        wb_render: () => { },
       },
       site: null as null | ((site_id: string) => void | Promise<void>),
       site_form: null as null | {
diff --git a/app/web/src/utils/sync/ws-client.ts b/app/web/src/utils/sync/ws-client.ts
index de35e05a..4b12a98c 100644
--- a/app/web/src/utils/sync/ws-client.ts
+++ b/app/web/src/utils/sync/ws-client.ts
@@ -166,11 +166,17 @@ const connect = (
           );
 
           ws.onopen = () => {
+            w.offline = false;
+            w.editorRender?.();
+
             sendWs(ws, { type: SyncType.UserID, user_id, site_id, page_id });
             conf.ws = ws;
             event.opened();
           };
           ws.onclose = async () => {
+            w.offline = true;
+            w.editorRender?.();
+
             const res = event.disconnected();
             if (res.reconnect) {
               setTimeout(async () => {
diff --git a/app/web/src/utils/types/general.ts b/app/web/src/utils/types/general.ts
index 0c7d0663..7e1961c1 100644
--- a/app/web/src/utils/types/general.ts
+++ b/app/web/src/utils/types/general.ts
@@ -39,6 +39,7 @@ export const w = window as unknown as {
   _api: any;
   _db: any;
   offline: boolean;
+  editorRender?: () => void;
   debug: {
     on: any;
     off: any;