Skip to content

Commit 39a1cca

Browse files
committed
Initial editor toolbar setup
1 parent fb0258f commit 39a1cca

21 files changed

+1260
-486
lines changed

src/components/App.tsx

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,10 @@ import AppNavigator from './organisms/AppNavigator'
2525
import Toast from '../shared/components/organisms/Toast'
2626
import styled from '../shared/lib/styled'
2727
import { useToast } from '../shared/lib/stores/toast'
28+
import {
29+
applyBoldStyleEventEmitter,
30+
applyItalicStyleEventEmitter,
31+
} from '../lib/events'
2832

2933
const LoadingText = styled.div`
3034
margin: 30px;
@@ -155,6 +159,23 @@ const App = () => {
155159
}
156160
}, [togglePreferencesModal, push])
157161

162+
useEffectOnce(() => {
163+
const applyBoldStyleIpcEventHandler = () => {
164+
applyBoldStyleEventEmitter.dispatch()
165+
}
166+
const applyItalicStyleIpcEventHandler = () => {
167+
applyItalicStyleEventEmitter.dispatch()
168+
}
169+
170+
addIpcListener('apply-bold-style', applyBoldStyleIpcEventHandler)
171+
addIpcListener('apply-italic-style', applyItalicStyleIpcEventHandler)
172+
173+
return () => {
174+
removeIpcListener('apply-bold-style', applyBoldStyleIpcEventHandler)
175+
removeIpcListener('apply-italic-style', applyItalicStyleIpcEventHandler)
176+
}
177+
})
178+
158179
const switchWorkspaceHandler = useCallback(
159180
(_event: any, index: number) => {
160181
const storageIds = keys(storageMap)

src/components/PreferencesModal/EditorTab.tsx

Lines changed: 42 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,11 @@ import { themes } from '../../lib/CodeMirror'
1212
import CustomizedCodeEditor from '../atoms/CustomizedCodeEditor'
1313
import { useDebounce } from 'react-use'
1414
import Form from '../../shared/components/molecules/Form'
15-
import { SimpleFormSelect } from '../../shared/components/molecules/Form/atoms/FormSelect'
15+
import FormSelect, {
16+
FormSelectOption,
17+
SimpleFormSelect,
18+
} from '../../shared/components/molecules/Form/atoms/FormSelect'
19+
import { lngKeys } from '../../lib/i18n/types'
1620

1721
const defaultPreviewContent = `# hello-world.js
1822
@@ -101,6 +105,15 @@ const EditorTab = () => {
101105
[setPreferences]
102106
)
103107

108+
const selectShowEditorToolbar = useCallback(
109+
(formOption: FormSelectOption) => {
110+
setPreferences({
111+
'editor.showEditorToolbar': formOption.value === 'Show',
112+
})
113+
},
114+
[setPreferences]
115+
)
116+
104117
const codeEditorKeydownInterceptor = useMemo<KeyboardEventHandler>(() => {
105118
return (event) => {
106119
if (event.key === 'Escape') {
@@ -187,6 +200,34 @@ const EditorTab = () => {
187200
},
188201
],
189202
},
203+
{
204+
title: t(lngKeys.SettingsShowEditorToolbar),
205+
items: [
206+
{
207+
type: 'node',
208+
element: (
209+
<FormSelect
210+
options={[
211+
{
212+
label: t(lngKeys.GeneralShowVerb),
213+
value: 'Show',
214+
},
215+
{ label: t(lngKeys.GeneralHideVerb), value: 'Hide' },
216+
]}
217+
value={{
218+
label: preferences['editor.showEditorToolbar']
219+
? t(lngKeys.GeneralShowVerb)
220+
: t(lngKeys.GeneralHideVerb),
221+
value: preferences['editor.showEditorToolbar']
222+
? 'Show'
223+
: 'Hide',
224+
}}
225+
onChange={selectShowEditorToolbar}
226+
/>
227+
),
228+
},
229+
],
230+
},
190231
{
191232
title: t('preferences.editorKeymap'),
192233
items: [

0 commit comments

Comments
 (0)