ReopenBugButton.tsx

 1import React from 'react';
 2
 3import Button from '@material-ui/core/Button';
 4import CircularProgress from '@material-ui/core/CircularProgress';
 5
 6import { BugFragment } from 'src/pages/bug/Bug.generated';
 7import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated';
 8
 9import { useOpenBugMutation } from './OpenBug.generated';
10
11interface Props {
12  bug: BugFragment;
13  disabled?: boolean;
14}
15
16function ReopenBugButton({ bug, disabled }: Props) {
17  const [openBug, { loading, error }] = useOpenBugMutation();
18
19  function openBugAction() {
20    openBug({
21      variables: {
22        input: {
23          prefix: bug.id,
24        },
25      },
26      refetchQueries: [
27        // TODO: update the cache instead of refetching
28        {
29          query: TimelineDocument,
30          variables: {
31            id: bug.id,
32            first: 100,
33          },
34        },
35      ],
36      awaitRefetchQueries: true,
37    });
38  }
39
40  if (loading) return <CircularProgress />;
41  if (error) return <div>Error</div>;
42
43  return (
44    <div>
45      <Button
46        variant="contained"
47        onClick={() => openBugAction()}
48        disabled={bug.status === 'OPEN' || disabled}
49      >
50        Reopen bug
51      </Button>
52    </div>
53  );
54}
55
56export default ReopenBugButton;