:gear: Notify observers when mech clicked

dev-front/src/App.tsx

@@ -15,7 +15,7 @@ function App() {
             <main className='editor'>
                 <MechPicker observers={mechPickObservers}/>
 
-                <Squad /*pickObservers={mechPickObservers}*//>
+                <Squad pickObservers={mechPickObservers}/>
 
             </main>
             <footer>Squad Composer by DricomDragon</footer>

dev-front/src/mech/MechPicker.tsx

@@ -8,6 +8,9 @@ function MechPicker({observers} : { observers: {[key: string]: MechObserver }})
 
     function notifyObservers(mech: Mech) {
         console.log("Mech clicked is ", mech);
+        for (let key in observers) {
+            observers[key](mech);
+        }
     }
 
     return (

dev-front/src/mech/squad/Squad.tsx

@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import Member from './Member';
 import logo from '../../logo.svg';
 import Mech from '../../Mech';
+import MechObserver from '../../MechObserver';
 
 function instead<T>(array: T[], index: number, newItem: T): T[] {
     return array.map((item, i) => {
@@ -14,7 +15,7 @@ function instead<T>(array: T[], index: number, newItem: T): T[] {
 }
 
 
-function Squad() {
+function Squad({pickObservers} : {pickObservers: {[key: string] : MechObserver}}) {
 
     const it1: Mech = {id: 1, name: 'HelloType', kind: 'K1', health: 3};
     const it2: Mech = {id: 2, name: 'Giant Mech', kind: 'K1', health: 3};
@@ -30,6 +31,8 @@ function Squad() {
         setSquadMechs(instead(squadMechs, index, placeHolder));
     }
 
+    pickObservers.addWhenPicked = addToSquad;
+
     return (
         <article className='custom-squad'>
             <h2>Custom squad</h2>