diff options
Diffstat (limited to 'subprojects/frontend/src/editor')
-rw-r--r-- | subprojects/frontend/src/editor/EditorPane.tsx | 6 | ||||
-rw-r--r-- | subprojects/frontend/src/editor/GenerateButton.tsx | 12 |
2 files changed, 15 insertions, 3 deletions
diff --git a/subprojects/frontend/src/editor/EditorPane.tsx b/subprojects/frontend/src/editor/EditorPane.tsx index 079ebcdc..e433e714 100644 --- a/subprojects/frontend/src/editor/EditorPane.tsx +++ b/subprojects/frontend/src/editor/EditorPane.tsx | |||
@@ -2,6 +2,8 @@ import Box from '@mui/material/Box'; | |||
2 | import Skeleton from '@mui/material/Skeleton'; | 2 | import Skeleton from '@mui/material/Skeleton'; |
3 | import Stack from '@mui/material/Stack'; | 3 | import Stack from '@mui/material/Stack'; |
4 | import Toolbar from '@mui/material/Toolbar'; | 4 | import Toolbar from '@mui/material/Toolbar'; |
5 | import { useTheme } from '@mui/material/styles'; | ||
6 | import useMediaQuery from '@mui/material/useMediaQuery'; | ||
5 | import { observer } from 'mobx-react-lite'; | 7 | import { observer } from 'mobx-react-lite'; |
6 | import React, { useState } from 'react'; | 8 | import React, { useState } from 'react'; |
7 | 9 | ||
@@ -32,12 +34,14 @@ function EditorLoading(): JSX.Element { | |||
32 | 34 | ||
33 | export default observer(function EditorPane(): JSX.Element { | 35 | export default observer(function EditorPane(): JSX.Element { |
34 | const { editorStore } = useRootStore(); | 36 | const { editorStore } = useRootStore(); |
37 | const { breakpoints } = useTheme(); | ||
38 | const showGenerateButton = useMediaQuery(breakpoints.up('sm')); | ||
35 | 39 | ||
36 | return ( | 40 | return ( |
37 | <Stack direction="column" flexGrow={1} flexShrink={1} overflow="auto"> | 41 | <Stack direction="column" flexGrow={1} flexShrink={1} overflow="auto"> |
38 | <Toolbar variant="dense"> | 42 | <Toolbar variant="dense"> |
39 | <EditorButtons editorStore={editorStore} /> | 43 | <EditorButtons editorStore={editorStore} /> |
40 | <GenerateButton editorStore={editorStore} /> | 44 | {showGenerateButton && <GenerateButton editorStore={editorStore} />} |
41 | </Toolbar> | 45 | </Toolbar> |
42 | <Box flexGrow={1} flexShrink={1} overflow="auto"> | 46 | <Box flexGrow={1} flexShrink={1} overflow="auto"> |
43 | {editorStore === undefined ? ( | 47 | {editorStore === undefined ? ( |
diff --git a/subprojects/frontend/src/editor/GenerateButton.tsx b/subprojects/frontend/src/editor/GenerateButton.tsx index 2ffb1a94..485989b5 100644 --- a/subprojects/frontend/src/editor/GenerateButton.tsx +++ b/subprojects/frontend/src/editor/GenerateButton.tsx | |||
@@ -7,10 +7,12 @@ import type EditorStore from './EditorStore'; | |||
7 | 7 | ||
8 | const GENERATE_LABEL = 'Generate'; | 8 | const GENERATE_LABEL = 'Generate'; |
9 | 9 | ||
10 | export default observer(function GenerateButton({ | 10 | const GenerateButton = observer(function GenerateButton({ |
11 | editorStore, | 11 | editorStore, |
12 | hideWarnings, | ||
12 | }: { | 13 | }: { |
13 | editorStore: EditorStore | undefined; | 14 | editorStore: EditorStore | undefined; |
15 | hideWarnings?: boolean | undefined; | ||
14 | }): JSX.Element { | 16 | }): JSX.Element { |
15 | if (editorStore === undefined) { | 17 | if (editorStore === undefined) { |
16 | return ( | 18 | return ( |
@@ -26,7 +28,7 @@ export default observer(function GenerateButton({ | |||
26 | if (errorCount > 0) { | 28 | if (errorCount > 0) { |
27 | diagnostics.push(`${errorCount} error${errorCount === 1 ? '' : 's'}`); | 29 | diagnostics.push(`${errorCount} error${errorCount === 1 ? '' : 's'}`); |
28 | } | 30 | } |
29 | if (warningCount > 0) { | 31 | if (!(hideWarnings ?? false) && warningCount > 0) { |
30 | diagnostics.push(`${warningCount} warning${warningCount === 1 ? '' : 's'}`); | 32 | diagnostics.push(`${warningCount} warning${warningCount === 1 ? '' : 's'}`); |
31 | } | 33 | } |
32 | const summary = diagnostics.join(' and '); | 34 | const summary = diagnostics.join(' and '); |
@@ -55,3 +57,9 @@ export default observer(function GenerateButton({ | |||
55 | </Button> | 57 | </Button> |
56 | ); | 58 | ); |
57 | }); | 59 | }); |
60 | |||
61 | GenerateButton.defaultProps = { | ||
62 | hideWarnings: false, | ||
63 | }; | ||
64 | |||
65 | export default GenerateButton; | ||