             </li>
                    ))}
                </ul>
                <div className="tab-content">
                    {chapters.map(chapter => <Chapter key={chapter.number} chapter={chapter} />)}
                </div>
            </div>
        );
    }

    function Chapter(props) {
        const [sending, setSending] = React.useState(false);

        React.useEffect(() => {
            const interval = setInterval(() => {
                if (!sending) {
                    return;
          