Data from an SSE with Angular and Spring

I have my code in Anguar to consume an SSE:

import { Component, OnInit, NgZone } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

export interface Prueba {
  id: string,
  nombre: string
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  obs$: Observable<Prueba[]>;
  items: Prueba[] = [];

  constructor(
    private zone:NgZone
  ) {
    this.obs$ = Observable.create(obs => {
      let eventSource = new EventSource('http://localhost:8080/prueba');
      let prueba: Prueba[] = [];
      eventSource.onmessage = (evento) => {
        this.zone.run(() => {
          prueba.push(JSON.parse(evento.data));
          obs.next(prueba);
        })
      };
    });
  }

  ngOnInit() {
    this.obs$.subscribe((i) => {
      this.items = i;
    });
  }
}

And my Spring code is very simple:

@RestController
@CrossOrigin
@RequestMapping
public class PruebaController {
  @Autowired
  PruebaRepository repo;

  @GetMapping(path = "/prueba", produces = MediaType.TEXT_EVENT_STREAM_VALUE)
  public Flux<Prueba> getTodos() {
    return repo.findAll();
  }
}

The idea is that every time that the collection of the entity Test is modified, it is shown automatically with Angular, I tried to do it with an array on the side of Angular, but it appears in console:

Array[ {...} ]
Array[ {...}, {...} ]
Array[ {...}, {...}, {...} ]
Array[ {...}, {...}, {...}, {...}]

And so on, when in my collection I only have three objects. How can I make it so that it only shows those three objects?