added moving column capability

src/app/components/stream/stream-edition/stream-edition.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit, Input } from '@angular/core';
 import { Store } from '@ngxs/store';
 
-import { StreamElement, RemoveStream } from '../../../states/streams.state';
+import { StreamElement, RemoveStream, MoveStreamUp, MoveStreamDown } from '../../../states/streams.state';
 
 @Component({
     selector: 'app-stream-edition',
@@ -17,17 +17,16 @@ export class StreamEditionComponent implements OnInit {
     }
 
     moveLeft(): boolean {
-        console.log('move left');
+        this.store.dispatch([new MoveStreamUp(this.streamElement.id)]);
         return false;
     }
 
     moveRight(): boolean {
-        console.log('move right');
+        this.store.dispatch([new MoveStreamDown(this.streamElement.id)]);
         return false;
     }
 
     delete(): boolean {
-        console.log('delete');
         this.store.dispatch([new RemoveStream(this.streamElement.id)]);
         return false;
     }

src/app/states/streams.state.ts

@@ -15,6 +15,16 @@ export class RemoveStream {
     constructor(public streamId :string) {}
 }
 
+export class MoveStreamUp {
+    static readonly type = '[Streams] Move stream up';
+    constructor(public streamId :string) {}
+}
+
+export class MoveStreamDown {
+    static readonly type = '[Streams] Move stream down';
+    constructor(public streamId :string) {}
+}
+
 export interface StreamsStateModel {
     streams: StreamElement[];
 }
@@ -49,6 +59,34 @@ export class StreamsState {
             streams: [...filteredStreams]
         });
     }
+    @Action(MoveStreamUp)
+    MoveStreamUp(ctx: StateContext<StreamsStateModel>, action: MoveStreamUp){
+        const state = ctx.getState();
+        const sourceIndex = state.streams.findIndex(x => x.id === action.streamId);
+        if(sourceIndex === 0) return;
+
+        let streamsCopy = [...state.streams];
+        streamsCopy[sourceIndex - 1] = state.streams[sourceIndex];
+        streamsCopy[sourceIndex] = state.streams[sourceIndex - 1];
+
+        ctx.patchState({
+            streams: streamsCopy
+        });
+    }
+    @Action(MoveStreamDown)
+    MoveStreamDown(ctx: StateContext<StreamsStateModel>, action: MoveStreamDown){
+        const state = ctx.getState();
+        const sourceIndex = state.streams.findIndex(x => x.id === action.streamId);
+        if(sourceIndex === state.streams.length - 1) return;
+
+        let streamsCopy = [...state.streams];
+        streamsCopy[sourceIndex + 1] = state.streams[sourceIndex];
+        streamsCopy[sourceIndex] = state.streams[sourceIndex + 1];
+
+        ctx.patchState({
+            streams: streamsCopy
+        });
+    }
 }
 
 export class StreamElement {