fix: NCWF-2 bugs and desing fixes (#7)

Co-authored-by: Lala, Shahd <Shahd.Lala@sybit.de>
Reviewed-on: #7

src/app/components/move-history/move-history.component.ts

@@ -0,0 +1,52 @@
+import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';
+
+export type MoveNavDirection = 'first' | 'prev' | 'next' | 'last';
+
+interface MovePair {
+  white: string;
+  black: string | null;
+}
+
+@Component({
+  selector: 'app-move-history',
+  standalone: true,
+  imports: [],
+  templateUrl: './move-history.component.html',
+  styleUrl: './move-history.component.css'
+})
+export class MoveHistoryComponent implements OnChanges {
+  @Input({ required: true }) moves: string[] = [];
+  @Output() navigate = new EventEmitter<MoveNavDirection>();
+
+  movePairs: MovePair[] = [];
+
+  get plyCount(): number {
+    return this.moves.length;
+  }
+
+  get currentWhiteIndex(): number {
+    const lastPairIndex = this.movePairs.length - 1;
+    if (lastPairIndex < 0) return -1;
+    const lastMove = this.moves.length - 1;
+    return lastMove % 2 === 0 ? lastPairIndex : -1;
+  }
+
+  get currentBlackIndex(): number {
+    const lastPairIndex = this.movePairs.length - 1;
+    if (lastPairIndex < 0) return -1;
+    const lastMove = this.moves.length - 1;
+    return lastMove % 2 === 1 ? lastPairIndex : -1;
+  }
+
+  ngOnChanges(): void {
+    this.movePairs = this.buildPairs(this.moves);
+  }
+
+  private buildPairs(moves: string[]): MovePair[] {
+    const pairs: MovePair[] = [];
+    for (let i = 0; i < moves.length; i += 2) {
+      pairs.push({ white: moves[i], black: moves[i + 1] ?? null });
+    }
+    return pairs;
+  }
+}