fix: add ctorName to avoid crash in production mode

packages/northstar/src/blocks/component/block.ts

@@ -24,6 +24,8 @@ import { getProps } from "./getProps";
 import { updatePlugins } from "./updatePlugins";
 
 export class ComponentBlock extends RectBlock {
+  ctorName: string = "ComponentBlock";
+
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.setComponentType(this.componentType, this.info);

packages/northstar/src/blocks/special/FuncBlockBase.r.ts

@@ -31,6 +31,8 @@ export abstract class FuncBlockBase extends RectBlock implements SpecialBlock {
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.inputValue.value = this.inputValue.value;
+    target.outputDirection = this.outputDirection;
+    target.slotsDirection = this.slotsDirection;
     return target;
   }
 

packages/northstar/src/blocks/special/do.r.ts

@@ -22,6 +22,8 @@ const WIDTH = 70;
 const HEIGHT = 30;
 
 export class DoBlock extends RectBlock {
+  ctorName: string = "DoBlock";
+
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.thenNum = this.thenNum;

packages/northstar/src/blocks/special/expr.ts

@@ -3,6 +3,8 @@ import { blockCtors } from "@quasi-dev/visual-flow";
 import { FuncBlockBase } from "./FuncBlockBase.r";
 
 export class ExprBlock extends FuncBlockBase {
+  ctorName: string = "ExprBlock";
+
   type: FuncBlockTypes = "expr";
   label = "expression";
   outputLabel = "value";

packages/northstar/src/blocks/special/if.r.ts

@@ -21,6 +21,8 @@ import {
 import { SpecialBlock } from "./base";
 
 export class IfElseBlock extends RectBlock implements SpecialBlock {
+  ctorName: string = "IfElseBlock";
+
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.hasElse = this.hasElse;

packages/northstar/src/blocks/special/imp.ts

@@ -21,6 +21,8 @@ import {
 import { FuncBlockBase } from "./FuncBlockBase.r";
 
 export class ImpBlock extends FuncBlockBase {
+  ctorName: string = "ImpBlock";
+
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.hasThen = this.hasThen;

packages/northstar/src/blocks/special/root.r.ts

@@ -14,6 +14,8 @@ import { SpecialBlock } from "./base";
 import { currentProject } from "../../project";
 
 export class RootBlock extends RectBlock implements SpecialBlock {
+  ctorName: string = "RootBlock";
+
   boardWidth = 200;
   boardHeight = 50;
 

packages/northstar/src/blocks/special/state.ts

@@ -4,6 +4,8 @@ import { ExprBlock } from "./expr";
 import { StateSetterBlock } from "./stateSetter.r";
 
 export class StateBlock extends ExprBlock {
+  ctorName: string = "StateBlock";
+
   label = "state";
   type: FuncBlockTypes = "state";
   placeholder = "initial value";

packages/northstar/src/blocks/special/stateSetter.r.ts

@@ -16,6 +16,8 @@ import { multiInSocketToOutput } from "../../utils/toOutput";
 import { ExprBlock } from "./expr";
 
 export class StateSetterBlock extends ExprBlock {
+  ctorName: string = "StateSetterBlock";
+
   type: FuncBlockTypes = "state-setter";
   label = "state setter";
   placeholder = "expr";

packages/northstar/src/blocks/special/string.ts

@@ -3,6 +3,8 @@ import { blockCtors } from "@quasi-dev/visual-flow";
 import { FuncBlockBase } from "./FuncBlockBase.r";
 
 export class StringBlock extends FuncBlockBase {
+  ctorName: string = "StringBlock";
+
   type: FuncBlockTypes = "string";
 
   label = "string template";

packages/northstar/src/blocks/special/validator.ts

@@ -1,8 +1,10 @@
-import { Direction, Socket, blockCtors } from "@quasi-dev/visual-flow";
-import { FuncBlockBase } from "./FuncBlockBase.r";
 import { FuncBlockTypes, ValidatorBlockOutput } from "@quasi-dev/compiler";
+import { Direction, blockCtors } from "@quasi-dev/visual-flow";
+import { FuncBlockBase } from "./FuncBlockBase.r";
 
 export class ValidatorBlock extends FuncBlockBase {
+  ctorName: string = "ValidatorBlock";
+
   label = "validator";
   type: FuncBlockTypes = "validator";
   placeholder = "expression";

packages/northstar/src/blocks/special/view.r.ts

@@ -13,6 +13,8 @@ import { singleInSocketToOutput } from "../../utils/toOutput";
 import { SpecialBlock } from "./base";
 
 export class ViewBlock extends RectBlock implements SpecialBlock {
+  ctorName: string = "ViewBlock";
+
   cloneTo(target: this): this {
     super.cloneTo(target);
     target.viewName = this.viewName;

packages/visual-flow/src/components/block/RectBlock.r.ts

@@ -7,6 +7,8 @@ import styles from "./RectBlock.styles";
 const SOCKET_PADDING_SCALE = -0.1;
 
 export abstract class RectBlock extends Block {
+  ctorName: string = "RectBlock";
+
   cloneTo(target: this): this {
     target.boardWidth = this.boardWidth;
     target.boardHeight = this.boardHeight;

packages/visual-flow/src/components/line/BasicLine.ts

@@ -17,6 +17,8 @@ function getCtrlPointOffset(delta: number) {
 }
 
 export class BasicLine extends Line {
+  ctorName: string = "BasicLine";
+
   clone(): Line {
     const line = new BasicLine();
     line.type = this.type;

packages/visual-flow/src/components/socket/MultiInSocket.ts

@@ -1,8 +1,11 @@
-import { Direction, LINE_END_OFFSET, Point } from "../..";
 import { Line, Socket } from "../../model";
 import { socketCtors } from "../../recorder";
+import { Direction, Point } from "../../types";
+import { LINE_END_OFFSET } from "../line";
 
 export class MultiInSocket extends Socket {
+  ctorName: string = "MultiInSocket";
+
   connectedLines: Line[] = [];
 
   get allConnectedLines(): Line[] {

packages/visual-flow/src/components/socket/MultiOutSocket.ts

@@ -3,6 +3,8 @@ import { socketCtors } from "../../recorder";
 import { BasicLine } from "../line";
 
 export class MultiOutSocket extends Socket {
+  ctorName: string = "MultiOutSocket";
+
   connectedLines: Line[] = [];
 
   connectTo(line: Line): void {

packages/visual-flow/src/components/socket/SingleInSocket.ts

@@ -2,6 +2,8 @@ import { Line, Socket } from "../../model";
 import { socketCtors } from "../../recorder";
 
 export class SingleInSocket extends Socket {
+  ctorName: string = "SingleInSocket";
+
   connectedLine: Line | null = null;
 
   get allConnectedLines(): Line[] {

packages/visual-flow/src/components/socket/SingleOutSocket.ts

@@ -4,6 +4,8 @@ import { BasicLine } from "../line";
 import { PATH_OUT_ELIPSE, PATH_OUT_RECT } from "./constants";
 
 export class SingleOutSocket extends Socket {
+  ctorName: string = "SingleOutSocket";
+
   connectedLine: Line | null = null;
 
   get allConnectedLines(): Line[] {

packages/visual-flow/src/model/block.ts

@@ -23,6 +23,8 @@ export type UseSocket = <T extends Socket>(
 export type UsedSockets = [string, Socket][];
 
 export abstract class Block extends ModelBase {
+  abstract ctorName: string;
+
   abstract cloneTo(target: this): this;
   clone() {
     return this.cloneTo(new (this.constructor as any)());
@@ -402,7 +404,7 @@ export abstract class Block extends ModelBase {
   protected abstract exportData(): any;
   exportRecord(): BlockRecord {
     return {
-      ctor: this.constructor.name,
+      ctor: this.ctorName,
       id: this.id,
       boardX: this.boardX,
       boardY: this.boardY,

packages/visual-flow/src/model/line.ts

@@ -41,6 +41,8 @@ const defaultColors: Record<string, LineColors> = {
 };
 
 export abstract class Line extends ModelBase {
+  abstract ctorName: string;
+
   abstract clone(): Line;
 
   graph: Graph;
@@ -186,7 +188,7 @@ export abstract class Line extends ModelBase {
   protected abstract exportData(): any;
   exportRecord(): LineRecord {
     return {
-      ctor: this.constructor.name,
+      ctor: this.ctorName,
       id: this.id,
       type: this.type,
       socketAId: this.a.id,

packages/visual-flow/src/model/socket.ts

@@ -6,6 +6,8 @@ import { Graph } from "./graph";
 import { Line } from "./line";
 
 export abstract class Socket extends ModelBase {
+  abstract ctorName: string;
+
   get graph(): Graph {
     return this.block.graph;
   }
@@ -86,7 +88,7 @@ export abstract class Socket extends ModelBase {
   protected abstract exportData(): any;
   exportRecord(): SocketRecord {
     return {
-      ctor: this.constructor.name,
+      ctor: this.ctorName,
       id: this.id,
       type: this.type,
       direction: this.direction,