ciao!

dentro alla cartella components di un progetto React ho questi due componenti: Dashboard.js e AggiungiAllenamento.js.

da Dashboard.js devo arrivare ad AggiungiAllenamento.js.
ho provato così:
codice:
import React, {Component} from 'react';
import {Route} from 'react-router-dom';
...................
import AggiungiAllenamento from './AggiungiAllenamento';

export class Dashboard extends Component {

    constructor(props) {
        super(props);

        this.state = {
            fullcalendarOptions: {
                plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
                firstDay: 1,
                editable: false,
                defaultDate: new Date(),
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                },
                eventClick: (info) => {
                    console.log(info.event.id);
                    <Route path={"/id/:" + info.event.id} component={AggiungiAllenamento}/>
                    // document.location.href = 'up.php?id=' + calEvent.id;
                },
                eventRender: function (info) {
                    if (info.event.extendedProps.finito == 0) {
                        info.el.style.backgroundColor = "#FF0000";
                    }
                }
            },
            events: []
        };
    }

    async componentDidMount() {
        await this.allenamentiService.getAll().then(data => this.setState({events: data}));
    }

    render() {
        return (
        ..................
        );
    }
}
ma ottengo sempre questo errore:
codice:
./src/components/Dashboard.js
Attempted import error: './AggiungiAllenamento' does not contain a default export (imported as 'AggiungiAllenamento').
questo invece è AggiungiAllenamento.js:
codice:
import React, {Component} from 'react';
............

export class AggiungiAllenamento extends Component {

    constructor(props) {
        super(props);

        this.allenamentiService = new AllenamentiService();
        this.onCheckboxChange = this.onCheckboxChange.bind(this);

        this.state = {
            tipi: [],
            selAllenamento: null,
            selData: null,
            text: null,
            checkboxValue: true
        };
    }

    onBtnInvia = () => {
    .............
    };

    render() {
        return (
        .....................
        );
    }
}
sinceramente non capisco quale sia il problema!