feat: implement map deletions sync

src/message/message.ts

@@ -47,6 +47,7 @@ export enum MessageType {
 	Log = 'log',
 	Maximize = 'maximize',
 	MobxAdd = 'mobx-add',
+	MobxDelete = 'mobx-delete',
 	MobxUpdate = 'mobx-update',
 	MobxSplice = 'mobx-splice',
 	OpenExternalURL = 'open-external-url',
@@ -120,6 +121,7 @@ export type Message =
 	| Log
 	| Maximize
 	| MobxAddMessage
+	| MobxDeleteMessage
 	| MobxUpdateMessage
 	| MobxSpliceMessage
 	| OpenExternalURL
@@ -352,6 +354,16 @@ export interface MobxAddPayload<T = unknown> {
 	change: MobxAddChange<T>;
 }
 
+export interface MobxDeletePayload {
+	id: string;
+	name: string;
+	memberName: string;
+	change: {
+		type: Types.MobxChangeType.Delete;
+		key: string;
+	};
+}
+
 export interface MobxSplicePayload<T = unknown> {
 	id: string;
 	name: string;
@@ -397,4 +409,5 @@ export interface MobxObjectUpdatePayload<T = unknown> {
 
 export type MobxUpdateMessage = Envelope<MessageType.MobxUpdate, MobxUpdatePayload>;
 export type MobxAddMessage = Envelope<MessageType.MobxAdd, MobxAddPayload>;
+export type MobxDeleteMessage = Envelope<MessageType.MobxDelete, MobxDeletePayload>;
 export type MobxSpliceMessage = Envelope<MessageType.MobxSplice, MobxSplicePayload>;

src/preview/preview.ts

@@ -156,6 +156,24 @@ function main(): void {
 			member.set(message.payload.change.key, value);
 		});
 
+		sender.match<Message.MobxDeleteMessage>(Message.MessageType.MobxDelete, message => {
+			const parent = store.getObject(message.payload.name, message.payload.id);
+
+			if (!parent) {
+				console.log(message);
+				return;
+			}
+
+			const mayBeMember = parent[message.payload.memberName];
+
+			if (!mayBeMember) {
+				return;
+			}
+
+			const member = mayBeMember as Map<unknown, unknown>;
+			member.delete(message.payload.change.key);
+		});
+
 		sender.match<Message.MobxSpliceMessage>(Message.MessageType.MobxSplice, message => {
 			const parent = store.getObject(message.payload.name, message.payload.id);
 

src/renderer/create-change-notifiers.ts

@@ -79,7 +79,8 @@ export function createChangeNotifiers({ app, store }: NotifierContext): void {
 				switch (change.type) {
 					case Types.MobxChangeType.Update: {
 						if (change.hasOwnProperty('index')) {
-							const arrayChange = change as Types.MobxArrayUpdate;
+							console.log(change);
+							/* const arrayChange = change as Types.MobxArrayUpdate;
 
 							sender.send({
 								id: uuid.v4(),
@@ -93,18 +94,21 @@ export function createChangeNotifiers({ app, store }: NotifierContext): void {
 										newValue: change.newValue
 									}
 								}
-							});
+							}); */
 						}
 
 						if (change.hasOwnProperty('key')) {
-							const objectChange = change as Types.MobxObjectUpdate | Types.MobxMapUpdate;
+							const objectChange = change as
+								| Types.MobxObjectUpdate<Model.AnyModel>
+								| Types.MobxMapUpdate<string, Model.AnyModel>;
 
 							sender.send({
 								id: uuid.v4(),
 								type: Message.MessageType.MobxUpdate,
 								payload: {
-									id: change.object.id,
-									name: change.object.constructor.name,
+									// tslint:disable-next-line:no-any
+									id: (objectChange.object as any).id,
+									name: objectChange.object.constructor.name,
 									change: {
 										type: objectChange.type,
 										key: objectChange.key,
@@ -153,7 +157,7 @@ export function createChangeNotifiers({ app, store }: NotifierContext): void {
 								valueModel: typeof newValue === 'object' ? newValue.model : undefined,
 								change: {
 									type: change.type,
-									key: change.key,
+									key: change.key as string,
 									newValue
 								}
 							}
@@ -162,6 +166,32 @@ export function createChangeNotifiers({ app, store }: NotifierContext): void {
 						break;
 					}
 
+					case Types.MobxChangeType.Delete: {
+						const parent = getParentByMember(change.object, { name: change.name, project });
+						const name = parseChangeName(change.name);
+						const deletion = change as Types.MobxDelete<string, Model.AnyModel>;
+
+						if (!parent) {
+							return;
+						}
+
+						sender.send({
+							id: uuid.v4(),
+							type: Message.MessageType.MobxDelete,
+							payload: {
+								id: parent.getId(),
+								name: name.parentName,
+								memberName: name.memberName,
+								change: {
+									type: deletion.type,
+									key: deletion.key
+								}
+							}
+						});
+
+						break;
+					}
+
 					case Types.MobxChangeType.Splice: {
 						const parent = getParentByMember(change.object, { name: change.name, project });
 						const name = parseChangeName(change.name);
@@ -185,6 +215,8 @@ export function createChangeNotifiers({ app, store }: NotifierContext): void {
 								}
 							}
 						});
+
+						break;
 					}
 				}
 			});

src/sender/client.ts

@@ -18,11 +18,11 @@ export class Sender {
 
 	public async send(message: Message.Message): Promise<void> {
 		if (!isMessage(message)) {
+			console.error(`Tried to send invalid message: ${message}`);
 			return;
 		}
 
 		await onReady(this.connection);
-
 		this.connection.send(Serde.serialize(message));
 	}
 
@@ -50,6 +50,7 @@ export class Sender {
 			const header = Serde.getMessageHeader(e.data);
 
 			if (header.status === Serde.MessageHeaderStatus.Error) {
+				console.error(header);
 				return;
 			}
 

src/types/mobx.ts

@@ -1,17 +1,13 @@
-export type MobxChange =
+export type MobxChange<V = unknown, T = unknown> =
 	| MobxAction
 	| MobxScheduledReaction
 	| MobxReaction
 	| MobxCompute
-	// tslint:disable-next-line:no-any
-	| MobxUpdate<any, any>
+	| MobxUpdate
 	| MobxSplice
-	// tslint:disable-next-line:no-any
-	| MobxAdd<any>
-	// tslint:disable-next-line:no-any
-	| MobxDelete<any>
-	// tslint:disable-next-line:no-any
-	| MobxCreate<any>
+	| MobxAdd
+	| MobxDelete
+	| MobxCreate
 	| MobxReportEnd;
 
 export interface MobxReportStart {
@@ -73,21 +69,25 @@ export interface MobxMapAdd<V, T> extends MobxReportStart {
 	type: MobxChangeType.Add;
 }
 
-export interface MobxDelete<T> extends MobxReportStart {
+export interface MobxDelete<V = unknown, T = unknown> extends MobxReportStart {
 	object: T;
 	name: string;
 	oldValue: T;
+	key: V;
 	type: MobxChangeType.Delete;
 }
 
-export interface MobxCreate<T> extends MobxReportStart {
+export interface MobxCreate<T = unknown> extends MobxReportStart {
 	object: T;
 	name: string;
 	newValue: T;
 	type: MobxChangeType.Create;
 }
 
-export type MobxUpdate<V, T> = MobxArrayUpdate<T> | MobxMapUpdate<V, T> | MobxObjectUpdate<T>;
+export type MobxUpdate<V = unknown, T = unknown> =
+	| MobxArrayUpdate<T>
+	| MobxMapUpdate<V, T>
+	| MobxObjectUpdate<T>;
 
 export interface MobxArrayUpdate<T = unknown> extends MobxReportStart {
 	type: MobxChangeType.Update;

tslint.json

@@ -203,14 +203,6 @@
 				"destructuring": "any"
 			}
 		],
-		"trailing-comma": [
-			true,
-			{
-				"multiline": "never",
-				"singleline": "never",
-				"esSpecCompliant": true
-			}
-		],
 		"align": [
 			true,
 			"elements",
@@ -313,7 +305,6 @@
 			true,
 			0
 		],
-		"switch-final-break": true,
 		"type-literal-delimiter": true,
 		"variable-name": [
 			true,