1import CircularProgress from '@mui/material/CircularProgress';
 2import * as React from 'react';
 3import { useParams } from 'react-router-dom';
 4
 5import NotFoundPage from '../notfound/NotFoundPage';
 6
 7import Bug from './Bug';
 8import { useGetBugQuery } from './BugQuery.generated';
 9
10const BugQuery: React.FC = () => {
11  const params = useParams<'id'>();
12  if (params.id === undefined) throw new Error('missing route parameters');
13
14  const { loading, error, data } = useGetBugQuery({
15    variables: { id: params.id },
16  });
17  if (loading) return <CircularProgress />;
18  if (!data?.repository?.bug) return <NotFoundPage />;
19  if (error) return <p>Error: {error.message}</p>;
20
21  return <Bug bug={data.repository.bug} />;
22};
23
24export default BugQuery;