diff options
Diffstat (limited to 'subprojects/frontend/src/editor/EditorStore.ts')
-rw-r--r-- | subprojects/frontend/src/editor/EditorStore.ts | 81 |
1 files changed, 46 insertions, 35 deletions
diff --git a/subprojects/frontend/src/editor/EditorStore.ts b/subprojects/frontend/src/editor/EditorStore.ts index 0f4d2936..f75147a4 100644 --- a/subprojects/frontend/src/editor/EditorStore.ts +++ b/subprojects/frontend/src/editor/EditorStore.ts | |||
@@ -21,18 +21,14 @@ import { | |||
21 | indentOnInput, | 21 | indentOnInput, |
22 | syntaxHighlighting, | 22 | syntaxHighlighting, |
23 | } from '@codemirror/language'; | 23 | } from '@codemirror/language'; |
24 | import { | 24 | import { type Diagnostic, lintKeymap, setDiagnostics } from '@codemirror/lint'; |
25 | Diagnostic, | ||
26 | lintKeymap, | ||
27 | setDiagnostics, | ||
28 | } from '@codemirror/lint'; | ||
29 | import { search, searchKeymap } from '@codemirror/search'; | 25 | import { search, searchKeymap } from '@codemirror/search'; |
30 | import { | 26 | import { |
31 | EditorState, | 27 | EditorState, |
32 | StateCommand, | 28 | type StateCommand, |
33 | StateEffect, | 29 | StateEffect, |
34 | Transaction, | 30 | type Transaction, |
35 | TransactionSpec, | 31 | type TransactionSpec, |
36 | } from '@codemirror/state'; | 32 | } from '@codemirror/state'; |
37 | import { | 33 | import { |
38 | drawSelection, | 34 | drawSelection, |
@@ -45,26 +41,25 @@ import { | |||
45 | rectangularSelection, | 41 | rectangularSelection, |
46 | } from '@codemirror/view'; | 42 | } from '@codemirror/view'; |
47 | import { classHighlighter } from '@lezer/highlight'; | 43 | import { classHighlighter } from '@lezer/highlight'; |
48 | import { | 44 | import { makeAutoObservable, observable, reaction } from 'mobx'; |
49 | makeAutoObservable, | 45 | |
50 | observable, | 46 | import problemLanguageSupport from '../language/problemLanguageSupport'; |
51 | reaction, | 47 | import type ThemeStore from '../theme/ThemeStore'; |
52 | } from 'mobx'; | 48 | import getLogger from '../utils/getLogger'; |
53 | 49 | import XtextClient from '../xtext/XtextClient'; | |
54 | import { findOccurrences, IOccurrence, setOccurrences } from './findOccurrences'; | 50 | |
55 | import { problemLanguageSupport } from '../language/problemLanguageSupport'; | 51 | import findOccurrences, { |
56 | import { | 52 | type IOccurrence, |
57 | IHighlightRange, | 53 | setOccurrences, |
58 | semanticHighlighting, | 54 | } from './findOccurrences'; |
55 | import semanticHighlighting, { | ||
56 | type IHighlightRange, | ||
59 | setSemanticHighlighting, | 57 | setSemanticHighlighting, |
60 | } from './semanticHighlighting'; | 58 | } from './semanticHighlighting'; |
61 | import type { ThemeStore } from '../theme/ThemeStore'; | ||
62 | import { getLogger } from '../utils/logger'; | ||
63 | import { XtextClient } from '../xtext/XtextClient'; | ||
64 | 59 | ||
65 | const log = getLogger('editor.EditorStore'); | 60 | const log = getLogger('editor.EditorStore'); |
66 | 61 | ||
67 | export class EditorStore { | 62 | export default class EditorStore { |
68 | private readonly themeStore; | 63 | private readonly themeStore; |
69 | 64 | ||
70 | state: EditorState; | 65 | state: EditorState; |
@@ -96,17 +91,18 @@ export class EditorStore { | |||
96 | extensions: [ | 91 | extensions: [ |
97 | autocompletion({ | 92 | autocompletion({ |
98 | activateOnTyping: true, | 93 | activateOnTyping: true, |
99 | override: [ | 94 | override: [(context) => this.client.contentAssist(context)], |
100 | (context) => this.client.contentAssist(context), | ||
101 | ], | ||
102 | }), | 95 | }), |
103 | closeBrackets(), | 96 | closeBrackets(), |
104 | bracketMatching(), | 97 | bracketMatching(), |
105 | drawSelection(), | 98 | drawSelection(), |
106 | EditorState.allowMultipleSelections.of(true), | 99 | EditorState.allowMultipleSelections.of(true), |
107 | EditorView.theme({}, { | 100 | EditorView.theme( |
108 | dark: this.themeStore.darkMode, | 101 | {}, |
109 | }), | 102 | { |
103 | dark: this.themeStore.darkMode, | ||
104 | }, | ||
105 | ), | ||
110 | findOccurrences, | 106 | findOccurrences, |
111 | highlightActiveLine(), | 107 | highlightActiveLine(), |
112 | highlightActiveLineGutter(), | 108 | highlightActiveLineGutter(), |
@@ -134,8 +130,16 @@ export class EditorStore { | |||
134 | { key: 'Mod-Shift-m', run: () => this.setLintPanelOpen(true) }, | 130 | { key: 'Mod-Shift-m', run: () => this.setLintPanelOpen(true) }, |
135 | ...lintKeymap, | 131 | ...lintKeymap, |
136 | // Override keys in `searchKeymap` to go through the `EditorStore`. | 132 | // Override keys in `searchKeymap` to go through the `EditorStore`. |
137 | { key: 'Mod-f', run: () => this.setSearchPanelOpen(true), scope: 'editor search-panel' }, | 133 | { |
138 | { key: 'Escape', run: () => this.setSearchPanelOpen(false), scope: 'editor search-panel' }, | 134 | key: 'Mod-f', |
135 | run: () => this.setSearchPanelOpen(true), | ||
136 | scope: 'editor search-panel', | ||
137 | }, | ||
138 | { | ||
139 | key: 'Escape', | ||
140 | run: () => this.setSearchPanelOpen(false), | ||
141 | scope: 'editor search-panel', | ||
142 | }, | ||
139 | ...searchKeymap, | 143 | ...searchKeymap, |
140 | ...defaultKeymap, | 144 | ...defaultKeymap, |
141 | ]), | 145 | ]), |
@@ -149,9 +153,14 @@ export class EditorStore { | |||
149 | log.debug('Update editor dark mode', darkMode); | 153 | log.debug('Update editor dark mode', darkMode); |
150 | this.dispatch({ | 154 | this.dispatch({ |
151 | effects: [ | 155 | effects: [ |
152 | StateEffect.appendConfig.of(EditorView.theme({}, { | 156 | StateEffect.appendConfig.of( |
153 | dark: darkMode, | 157 | EditorView.theme( |
154 | })), | 158 | {}, |
159 | { | ||
160 | dark: darkMode, | ||
161 | }, | ||
162 | ), | ||
163 | ), | ||
155 | ], | 164 | ], |
156 | }); | 165 | }); |
157 | }, | 166 | }, |
@@ -198,6 +207,8 @@ export class EditorStore { | |||
198 | case 'info': | 207 | case 'info': |
199 | this.infoCount += 1; | 208 | this.infoCount += 1; |
200 | break; | 209 | break; |
210 | default: | ||
211 | throw new Error('Unknown severity'); | ||
201 | } | 212 | } |
202 | }); | 213 | }); |
203 | } | 214 | } |
@@ -261,7 +272,7 @@ export class EditorStore { | |||
261 | * This matches the behavior of the `openSearchPanel` and `closeSearchPanel` | 272 | * This matches the behavior of the `openSearchPanel` and `closeSearchPanel` |
262 | * commands from `'@codemirror/search'`. | 273 | * commands from `'@codemirror/search'`. |
263 | * | 274 | * |
264 | * @param newShosSearchPanel whether we should show the search panel | 275 | * @param newShowSearchPanel whether we should show the search panel |
265 | * @returns `true` if the state was changed, `false` otherwise | 276 | * @returns `true` if the state was changed, `false` otherwise |
266 | */ | 277 | */ |
267 | setSearchPanelOpen(newShowSearchPanel: boolean): boolean { | 278 | setSearchPanelOpen(newShowSearchPanel: boolean): boolean { |