Dynamic timeline is not rendered properly

[Grz3hu]

import { Chrono } from "react-chrono";
import axios from "axios";
import React, { useEffect, useState } from "react";
import { useParams } from "react-router-dom";

export default function Timeline() {
    const [timeline, setTimeline] = useState({});

    const { id } = useParams();

    useEffect(() => {
        loadTimeline();
    }, []);

    const loadTimeline = async () => {
        const result = await axios.get(`http://localhost:8080/timeline/${id}`);
        setTimeline(result.data);
    };

    return (
        <div>
            <h2 className="text-center m-4">{timeline.title}</h2>
            <Chrono items={timeline.events} mode={timeline.mode} allowDynamicUpdate={true} />
        </div>
    );

How it looks:

Somehow when site is reloaded by vscode the timeline is rendered correctly