merge: combine all features from both codebases - mobile dashboard + layer panel + notifications + shares + all fixes

frontend/src/crdt/YjsDocument.ts

@@ -4,12 +4,16 @@
  */
 import * as Y from 'yjs';
 import type { CADElement, CADLayer, BlockDefinition } from '../types/cad.types';
+import type { ElementGroup } from '../tools/modification/GroupTool';
+import type { BackgroundConfig } from '../services/backgroundService';
 
 export interface YjsDocumentData {
   elements: Y.Map<CADElement>;
   layers: Y.Map<CADLayer>;
   blocks: Y.Map<BlockDefinition>;
   meta: Y.Map<unknown>;
+  groups: Y.Map<ElementGroup>;
+  bgConfig: Y.Map<BackgroundConfig>;
 }
 
 export class YjsDocument {
@@ -23,6 +27,8 @@ export class YjsDocument {
       layers: this.doc.getMap<CADLayer>('layers'),
       blocks: this.doc.getMap<BlockDefinition>('blocks'),
       meta: this.doc.getMap<unknown>('meta'),
+      groups: this.doc.getMap<ElementGroup>('groups'),
+      bgConfig: this.doc.getMap<BackgroundConfig>('bgConfig'),
     };
   }
 
@@ -41,6 +47,16 @@ export class YjsDocument {
     return Array.from(this.data.blocks.values());
   }
 
+  /** Get all groups as a plain array */
+  getGroups(): ElementGroup[] {
+    return Array.from(this.data.groups.values());
+  }
+
+  /** Get all background configs as a plain array */
+  getBgConfigs(): BackgroundConfig[] {
+    return Array.from(this.data.bgConfig.values());
+  }
+
   /** Add or update a single element */
   setElement(el: CADElement): void {
     this.doc.transact(() => {
@@ -73,24 +89,71 @@ export class YjsDocument {
     this.data.blocks.delete(id);
   }
 
+  /** Add or update a group */
+  setGroup(group: ElementGroup): void {
+    this.doc.transact(() => {
+      this.data.groups.set(group.id, group);
+    });
+  }
+
+  /** Remove a group by id */
+  deleteGroup(id: string): void {
+    this.data.groups.delete(id);
+  }
+
+  /** Add or update a background config */
+  setBgConfig(id: string, config: BackgroundConfig): void {
+    this.doc.transact(() => {
+      this.data.bgConfig.set(id, config);
+    });
+  }
+
+  /** Remove a background config by id */
+  deleteBgConfig(id: string): void {
+    this.data.bgConfig.delete(id);
+  }
+
   /** Bulk-load local state into the Y.Doc (replaces all content) */
   loadFromState(state: {
     elements: CADElement[];
     layers: CADLayer[];
     blocks: BlockDefinition[];
+    groups?: ElementGroup[];
+    bgConfigs?: BackgroundConfig[];
   }): void {
     this.doc.transact(() => {
-      this.data.elements.clear();
-      for (const el of state.elements) {
-        this.data.elements.set(el.id, el);
+      // Issue #7: Only clear and replace a map if the incoming array is non-empty.
+      // Clearing maps when data is empty wipes CRDT data from other connected clients.
+      if (state.elements.length > 0) {
+        this.data.elements.clear();
+        for (const el of state.elements) {
+          this.data.elements.set(el.id, el);
+        }
       }
-      this.data.layers.clear();
-      for (const layer of state.layers) {
-        this.data.layers.set(layer.id, layer);
+      if (state.layers.length > 0) {
+        this.data.layers.clear();
+        for (const layer of state.layers) {
+          this.data.layers.set(layer.id, layer);
+        }
       }
-      this.data.blocks.clear();
-      for (const block of state.blocks) {
-        this.data.blocks.set(block.id, block);
+      if (state.blocks.length > 0) {
+        this.data.blocks.clear();
+        for (const block of state.blocks) {
+          this.data.blocks.set(block.id, block);
+        }
+      }
+      if (state.groups && state.groups.length > 0) {
+        this.data.groups.clear();
+        for (const group of state.groups) {
+          this.data.groups.set(group.id, group);
+        }
+      }
+      if (state.bgConfigs && state.bgConfigs.length > 0) {
+        this.data.bgConfig.clear();
+        for (const cfg of state.bgConfigs) {
+          // Use 'default' as the key since there is typically one background config
+          this.data.bgConfig.set(cfg.name || 'default', cfg);
+        }
       }
     });
   }
@@ -100,11 +163,15 @@ export class YjsDocument {
     elements: CADElement[];
     layers: CADLayer[];
     blocks: BlockDefinition[];
+    groups: ElementGroup[];
+    bgConfigs: BackgroundConfig[];
   } {
     return {
       elements: this.getElements(),
       layers: this.getLayers(),
       blocks: this.getBlocks(),
+      groups: this.getGroups(),
+      bgConfigs: this.getBgConfigs(),
     };
   }