:wrench: Use a list to display mechs

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import Member from './Member';
 import logo from '../../logo.svg';
 import Mech from '../../Mech';
@@ -8,13 +8,15 @@ function Squad() {
     const it1: Mech = {id: 1, name: 'HelloType', kind: 'K1', health: 3};
     const it2: Mech = {id: 2, name: 'Giant Mech', kind: 'K1', health: 3};
     const it3: Mech = {id: 3, name: 'Techno-prop', kind: 'K1', health: 4};
+    const [squadMechs, setSquadMechs] = useState([it1, it2, it3]);
+
     return (
         <article className='custom-squad'>
             <h2>Custom squad</h2>
             <div className='mech-members'>
-                <Member mech={it1}/>
-                <Member mech={it2}/>
-                <Member mech={it3}/>
+                {squadMechs.map(m => (
+                    <Member mech={m}/>
+                ))}
             </div>
             <div className='squad-description'>
                 <label htmlFor='squad-description-field-id'>Squad description</label>