Remove usage of ContainerModel rather than IContainerModel

src/Components/App/App.tsx

@@ -1,4 +1,4 @@
-import React, { Dispatch, SetStateAction, useCallback, useContext, useEffect, useRef, useState } from 'react';
+import React, { Dispatch, SetStateAction, useContext, useEffect, useRef, useState } from 'react';
 import { UseCustomEvents } from '../../Events/AppEvents';
 import { MainMenu } from '../MainMenu/MainMenu';
 import { ContainerModel, IContainerModel } from '../../Interfaces/IContainerModel';

src/Components/Editor/Actions/AddContainer.ts

@@ -5,7 +5,7 @@
 import { AddMethod } from '../../../Enums/AddMethod';
 import { IAvailableContainer } from '../../../Interfaces/IAvailableContainer';
 import { IConfiguration } from '../../../Interfaces/IConfiguration';
-import { IContainerModel, ContainerModel } from '../../../Interfaces/IContainerModel';
+import { IContainerModel } from '../../../Interfaces/IContainerModel';
 import { IHistoryState } from '../../../Interfaces/IHistoryState';
 import { IPattern, GetPattern, ContainerOrPattern } from '../../../Interfaces/IPattern';
 import { ISymbolModel } from '../../../Interfaces/ISymbolModel';
@@ -125,7 +125,7 @@ function AddNewContainerToParent(
   newCounters: Record<string, number>,
   symbols: Map<string, ISymbolModel>,
   initChilds: boolean = true
-): ContainerModel {
+): IContainerModel {
   const type = availableContainer.Type;
 
   const defaultConfig = configuration.AvailableContainers
@@ -170,13 +170,11 @@ function AddNewContainerToParent(
   );
 
   // Create the container
-  const newContainer = new ContainerModel(
+  const newContainer: IContainerModel = {
-    defaultProperties,
+    properties: defaultProperties,
-    [],
+    children: [],
-    {
+    userData: {}
-      type
+  };
-    }
-  );
 
   // Register the container in the hashmap
   containers.set(newContainer.properties.id, newContainer);
@@ -266,7 +264,7 @@ export function AddContainer(
  * @returns
  */
 function InitializeDefaultChild(
-  newContainer: ContainerModel,
+  newContainer: IContainerModel,
   configuration: IConfiguration,
   containerConfig: IAvailableContainer,
   containers: Map<string, IContainerModel>,
@@ -297,7 +295,7 @@ function InitializeDefaultChild(
 }
 
 function InitializeChildrenWithPattern(
-  newContainer: ContainerModel,
+  newContainer: IContainerModel,
   configuration: IConfiguration,
   containers: Map<string, IContainerModel>,
   containerConfig: IAvailableContainer,
@@ -338,7 +336,7 @@ function InitializeChildrenWithPattern(
  */
 function BuildPatterns(
   rootPattern: ContainerOrPattern,
-  newContainer: ContainerModel,
+  newContainer: IContainerModel,
   configuration: IConfiguration,
   containers: Map<string, IContainerModel>,
   newCounters: Record<string, number>,

src/Components/Editor/Actions/ContainerOperations.ts

@@ -1,5 +1,5 @@
 import { IHistoryState } from '../../../Interfaces/IHistoryState';
-import { ContainerModel, IContainerModel } from '../../../Interfaces/IContainerModel';
+import { IContainerModel } from '../../../Interfaces/IContainerModel';
 import { FindContainerById, MakeDFSIterator } from '../../../utils/itertools';
 import { GetCurrentHistory } from '../Editor';
 import { ApplyBehaviors, ApplyBehaviorsOnSiblings, ApplyBehaviorsOnSiblingsChildren } from '../Behaviors/Behaviors';
@@ -176,7 +176,7 @@ export function OnPropertyChange(
   }
 
   const containers = structuredClone(current.containers);
-  const container: ContainerModel | undefined = FindContainerById(containers, selected.properties.id);
+  const container: IContainerModel | undefined = FindContainerById(containers, selected.properties.id);
 
   if (container === null || container === undefined) {
     throw new Error('[OnPropertyChange] Container model was not found among children of the main container!');
@@ -270,7 +270,7 @@ export function SortChildren(
  */
 function SetContainer(
   containers: Map<string, IContainerModel>,
-  container: ContainerModel,
+  container: IContainerModel,
   key: string, value: string | number | boolean | number[],
   type: PropertyType,
   symbols: Map<string, ISymbolModel>
@@ -310,7 +310,7 @@ function SetContainer(
  * @param value Value of the property
  * @param type Type of the property
  */
-function AssignProperty(container: ContainerModel, key: string, value: string | number | boolean | number[], type: PropertyType): void {
+function AssignProperty(container: IContainerModel, key: string, value: string | number | boolean | number[], type: PropertyType): void {
   switch (type) {
     case PropertyType.Style:
       (container.properties.style as any)[key] = value;

src/Components/SVG/Elements/DepthDimensionLayer.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ContainerModel, IContainerModel } from '../../../Interfaces/IContainerModel';
+import { IContainerModel } from '../../../Interfaces/IContainerModel';
 import { DIMENSION_MARGIN } from '../../../utils/default';
 import { GetAbsolutePosition, MakeBFSIterator } from '../../../utils/itertools';
 import { TransformX } from '../../../utils/svg';
@@ -7,13 +7,13 @@ import { Dimension } from './Dimension';
 
 interface IDimensionLayerProps {
   containers: Map<string, IContainerModel>
-  roots: ContainerModel | ContainerModel[] | null
+  roots: IContainerModel | IContainerModel[] | null
   scale?: number
 }
 
 function GetDimensionsNodes(
   containers: Map<string, IContainerModel>,
-  root: ContainerModel,
+  root: IContainerModel,
   scale: number
 ): React.ReactNode[] {
   const it = MakeBFSIterator(root, containers);

src/Components/SVG/Elements/DimensionLayer.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Orientation } from '../../../Enums/Orientation';
 import { Position } from '../../../Enums/Position';
-import { ContainerModel, IContainerModel } from '../../../Interfaces/IContainerModel';
+import { IContainerModel } from '../../../Interfaces/IContainerModel';
 import { DIMENSION_MARGIN, SHOW_BORROWER_DIMENSIONS, SHOW_CHILDREN_DIMENSIONS, SHOW_SELF_DIMENSIONS } from '../../../utils/default';
 import { FindContainerById, MakeRecursionDFSIterator, Pairwise } from '../../../utils/itertools';
 import { TransformX, TransformY } from '../../../utils/svg';
@@ -9,7 +9,7 @@ import { Dimension } from './Dimension';
 
 interface IDimensionLayerProps {
   containers: Map<string, IContainerModel>
-  root: ContainerModel
+  root: IContainerModel
   scale: number
 }
 

src/Components/SVG/SVG.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ReactSVGPanZoom, Tool, TOOL_PAN, Value } from 'react-svg-pan-zoom';
 import { Container } from './Elements/Container';
-import { ContainerModel, IContainerModel } from '../../Interfaces/IContainerModel';
+import { IContainerModel } from '../../Interfaces/IContainerModel';
 import { Selector } from './Elements/Selector/Selector';
 import { DepthDimensionLayer } from './Elements/DepthDimensionLayer';
 import { MAX_FRAMERATE, SHOW_DIMENSIONS_PER_DEPTH } from '../../utils/default';
@@ -16,8 +16,8 @@ interface ISVGProps {
   width: number
   height: number
   containers: Map<string, IContainerModel>
-  children: ContainerModel
+  children: IContainerModel
-  selected?: ContainerModel
+  selected?: IContainerModel
   symbols: Map<string, ISymbolModel>
   selectContainer: (containerId: string) => void
 }