diff options
Diffstat (limited to 'subprojects/frontend/src/graph/GraphPane.tsx')
-rw-r--r-- | subprojects/frontend/src/graph/GraphPane.tsx | 34 |
1 files changed, 34 insertions, 0 deletions
diff --git a/subprojects/frontend/src/graph/GraphPane.tsx b/subprojects/frontend/src/graph/GraphPane.tsx new file mode 100644 index 00000000..67dbfcbd --- /dev/null +++ b/subprojects/frontend/src/graph/GraphPane.tsx | |||
@@ -0,0 +1,34 @@ | |||
1 | /* | ||
2 | * SPDX-FileCopyrightText: 2023 The Refinery Authors <https://refinery.tools/> | ||
3 | * | ||
4 | * SPDX-License-Identifier: EPL-2.0 | ||
5 | */ | ||
6 | |||
7 | import Stack from '@mui/material/Stack'; | ||
8 | import { Suspense, lazy } from 'react'; | ||
9 | |||
10 | import Loading from '../Loading'; | ||
11 | |||
12 | import type GraphStore from './GraphStore'; | ||
13 | |||
14 | const GraphArea = lazy(() => import('./GraphArea')); | ||
15 | |||
16 | export default function GraphPane({ | ||
17 | graph, | ||
18 | }: { | ||
19 | graph: GraphStore; | ||
20 | }): JSX.Element { | ||
21 | return ( | ||
22 | <Stack | ||
23 | direction="column" | ||
24 | height="100%" | ||
25 | overflow="auto" | ||
26 | alignItems="center" | ||
27 | justifyContent="center" | ||
28 | > | ||
29 | <Suspense fallback={<Loading />}> | ||
30 | <GraphArea graph={graph} /> | ||
31 | </Suspense> | ||
32 | </Stack> | ||
33 | ); | ||
34 | } | ||