diff options
author | 2021-11-16 16:47:58 +0100 | |
---|---|---|
committer | 2021-11-16 16:47:58 +0100 | |
commit | 11cbae607b5a6f59f5a019b7eb525da689d2bb30 (patch) | |
tree | c40e4af57988becdcf7d363a2fb7107f668b8ba0 /language-web/src/main/js/editor/EditorButtons.tsx | |
parent | chore(web): json validation with zod (diff) | |
download | refinery-11cbae607b5a6f59f5a019b7eb525da689d2bb30.tar.gz refinery-11cbae607b5a6f59f5a019b7eb525da689d2bb30.tar.zst refinery-11cbae607b5a6f59f5a019b7eb525da689d2bb30.zip |
feat(web): xtext formatter client
Uses the xtext formatted on the server to format the document.
Also adds the capability to take (delta) changes from the server and
apply them before any pending local changes, then replay the changes.
This means that the server-side formatter is effectively acting as a
second user who is editing the document.
Diffstat (limited to 'language-web/src/main/js/editor/EditorButtons.tsx')
-rw-r--r-- | language-web/src/main/js/editor/EditorButtons.tsx | 9 |
1 files changed, 7 insertions, 2 deletions
diff --git a/language-web/src/main/js/editor/EditorButtons.tsx b/language-web/src/main/js/editor/EditorButtons.tsx index 09ce33dd..150aa00d 100644 --- a/language-web/src/main/js/editor/EditorButtons.tsx +++ b/language-web/src/main/js/editor/EditorButtons.tsx | |||
@@ -7,6 +7,7 @@ import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; | |||
7 | import CheckIcon from '@mui/icons-material/Check'; | 7 | import CheckIcon from '@mui/icons-material/Check'; |
8 | import ErrorIcon from '@mui/icons-material/Error'; | 8 | import ErrorIcon from '@mui/icons-material/Error'; |
9 | import FormatListNumberedIcon from '@mui/icons-material/FormatListNumbered'; | 9 | import FormatListNumberedIcon from '@mui/icons-material/FormatListNumbered'; |
10 | import FormatPaint from '@mui/icons-material/FormatPaint'; | ||
10 | import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; | 11 | import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; |
11 | import RedoIcon from '@mui/icons-material/Redo'; | 12 | import RedoIcon from '@mui/icons-material/Redo'; |
12 | import SearchIcon from '@mui/icons-material/Search'; | 13 | import SearchIcon from '@mui/icons-material/Search'; |
@@ -47,7 +48,6 @@ export const EditorButtons = observer(() => { | |||
47 | disabled={!editorStore.canUndo} | 48 | disabled={!editorStore.canUndo} |
48 | onClick={() => editorStore.undo()} | 49 | onClick={() => editorStore.undo()} |
49 | aria-label="Undo" | 50 | aria-label="Undo" |
50 | value="undo" | ||
51 | > | 51 | > |
52 | <UndoIcon fontSize="small" /> | 52 | <UndoIcon fontSize="small" /> |
53 | </IconButton> | 53 | </IconButton> |
@@ -55,7 +55,6 @@ export const EditorButtons = observer(() => { | |||
55 | disabled={!editorStore.canRedo} | 55 | disabled={!editorStore.canRedo} |
56 | onClick={() => editorStore.redo()} | 56 | onClick={() => editorStore.redo()} |
57 | aria-label="Redo" | 57 | aria-label="Redo" |
58 | value="redo" | ||
59 | > | 58 | > |
60 | <RedoIcon fontSize="small" /> | 59 | <RedoIcon fontSize="small" /> |
61 | </IconButton> | 60 | </IconButton> |
@@ -88,6 +87,12 @@ export const EditorButtons = observer(() => { | |||
88 | {getLintIcon(editorStore.highestDiagnosticLevel)} | 87 | {getLintIcon(editorStore.highestDiagnosticLevel)} |
89 | </ToggleButton> | 88 | </ToggleButton> |
90 | </ToggleButtonGroup> | 89 | </ToggleButtonGroup> |
90 | <IconButton | ||
91 | onClick={() => editorStore.formatText()} | ||
92 | aria-label="Automatic format" | ||
93 | > | ||
94 | <FormatPaint fontSize="small" /> | ||
95 | </IconButton> | ||
91 | </Stack> | 96 | </Stack> |
92 | ); | 97 | ); |
93 | }); | 98 | }); |