1 import axios from 'axios';
2 import React, { useEffect, useState } from 'react';
3 import { useParams } from 'react-router-dom';
5 import ErrorBoundary from '../common/ErrorBoundary';
6 import ErrorMessage from '../common/ErrorMessage';
7 import Loading from '../common/Loading';
8 import NotFound from '../pages/NotFound';
9 import Detail from '../tournament/Detail';
11 const Tournament = () => {
12 const params = useParams();
13 const { id } = params;
15 const [error, setError] = useState(null);
16 const [loading, setLoading] = useState(true);
17 const [tournament, setTournament] = useState(null);
22 .get(`/api/tournaments/${id}`)
26 setTournament(response.data);
40 return <ErrorMessage error={error} />;
47 const addRound = async () => {
48 await axios.post('/api/rounds', { tournament_id: tournament.id });
51 return <ErrorBoundary>
52 <Detail addRound={addRound} tournament={tournament} />
56 export default Tournament;