From 11d607c08b12dfc52d32cb5e40268c664adca0b6 Mon Sep 17 00:00:00 2001
From: Jonny <littlebigjonny06@gmail.com>
Date: Tue, 16 Apr 2019 13:51:23 +0200
Subject: [PATCH] Implement actual swapping on drag and drop

---
 js/components/EditableStringList.js | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/js/components/EditableStringList.js b/js/components/EditableStringList.js
index b9027e4..356fafb 100644
--- a/js/components/EditableStringList.js
+++ b/js/components/EditableStringList.js
@@ -128,7 +128,18 @@ export default class EditableStringList extends React.Component {
     }
 
     onGroupSwitch(src, dest) {
-        console.log('Switched src (' + JSON.stringify(src) + ') to dest (' + JSON.stringify(dest) + ')' );
+        const groupCopy = this.state.groups.slice();
+
+        const srcTeam = groupCopy[src.group][src.team];
+        const destTeam = groupCopy[dest.group][dest.team];
+
+        groupCopy[src.group].splice(src.team, 1, destTeam);
+        groupCopy[dest.group].splice(dest.team, 1, srcTeam);
+
+        this.setState({
+            groups: groupCopy
+        });
+        this.props.onGroupsChange(this.state.groups);
     }
 
     render() {
@@ -187,9 +198,9 @@ class GroupView extends React.Component {
                             <CardTitle>Group {groupindex + 1}</CardTitle>
                             {group.map((team, teamindex) => (
                                 <div key={team} draggable droppable="droppable"
-                                      onDragStart={(e) => this.onDragStart(e, groupindex,teamindex)}
-                                      onDragOver={(e) => this.onDragOver(e)}
-                                      onDrop={(e) => this.onDrop(e, groupindex, teamindex)}>
+                                    onDragStart={(e) => this.onDragStart(e, groupindex,teamindex)}
+                                    onDragOver={(e) => this.onDragOver(e)}
+                                    onDrop={(e) => this.onDrop(e, groupindex, teamindex)}>
 
                                     <Item text={team} removeItem={this.props.removeTeam}/>