Merged PR 17: Implement rigid body Fix multiple bugs

Implement rigid body

Fix saveload bug: having null elements
Fix events being duplicated and not being removed

src/Components/Properties/Properties.tsx

@@ -1,9 +1,10 @@
 import * as React from 'react';
 import ContainerProperties from '../../Interfaces/Properties';
+import { INPUT_TYPES } from './PropertiesInputTypes';
 
 interface IPropertiesProps {
   properties?: ContainerProperties
-  onChange: (key: string, value: string) => void
+  onChange: (key: string, value: string | number | boolean) => void
 }
 
 export const Properties: React.FC<IPropertiesProps> = (props: IPropertiesProps) => {
@@ -26,11 +27,24 @@ export const Properties: React.FC<IPropertiesProps> = (props: IPropertiesProps)
 const handleProperties = (
   [key, value]: [string, string | number],
   groupInput: React.ReactNode[],
-  onChange: (key: string, value: string) => void
+  onChange: (key: string, value: string | number | boolean) => void
 ): void => {
   const id = `property-${key}`;
-  const type = 'text';
-  const isDisabled = key === 'id' || key === 'parentId'; // hardcoded
+  let type = 'text';
+  let checked;
+
+  /// hardcoded stuff for ergonomy ///
+  if (typeof value === 'boolean') {
+    checked = value;
+  }
+
+  if (key in INPUT_TYPES) {
+    type = INPUT_TYPES[key];
+  }
+
+  const isDisabled = ['id', 'parentId'].includes(key);
+  ///
+
   groupInput.push(
     <div key={id} className='mt-4'>
       <label className='text-sm font-medium text-gray-800' htmlFor={id}>{key}</label>
@@ -43,7 +57,14 @@ const handleProperties = (
         type={type}
         id={id}
         value={value}
-        onChange={(event) => onChange(key, event.target.value)}
+        checked={checked}
+        onChange={(event) => {
+          if (type === 'checkbox') {
+            onChange(key, event.target.checked);
+            return;
+          }
+          onChange(key, event.target.value);
+        }}
         disabled={isDisabled}
       />
     </div>