Skip to content

Commit 07ae127

Browse files
tarun8718andersk
tarun8718
authored and
andersk
committed
shortcuts-section: Deduplicate templateMacHTML and templateWinLinHTML.
Signed-off-by: tarun8718 <[email protected]>
1 parent baa76c3 commit 07ae127

File tree

1 file changed

+88
-196
lines changed

1 file changed

+88
-196
lines changed

‎app/renderer/js/pages/preference/shortcuts-section.ts‎

Lines changed: 88 additions & 196 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,9 @@ export default class ShortcutsSection extends BaseSection {
1616
this.props = props;
1717
}
1818

19-
// TODO - Deduplicate templateMacHTML and templateWinLinHTML functions. In theory
20-
// they both should be the same the only thing different should be the userOSKey
21-
// variable but there seems to be inconsistences between both function, one has more
22-
// lines though one may just be using more new lines and other thing is the use of +.
23-
templateMacHTML(): string {
24-
const userOSKey = '⌘';
19+
// eslint-disable-next-line complexity
20+
templateHTML(): string {
21+
const cmdOrCtrl = process.platform === 'darwin' ? '⌘' : 'Ctrl';
2522

2623
return htmlEscape`
2724
<div class="settings-pane">
@@ -30,35 +27,39 @@ export default class ShortcutsSection extends BaseSection {
3027
<div class="settings-card">
3128
<table>
3229
<tr>
33-
<td><kbd>${userOSKey}</kbd><kbd>,</kbd></td>
30+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>,</kbd></td>
3431
<td>${t.__('Settings')}</td>
3532
</tr>
3633
<tr>
37-
<td><kbd>${userOSKey}</kbd><kbd>K</kbd></td>
34+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>K</kbd></td>
3835
<td>${t.__('Keyboard Shortcuts')}</td>
3936
</tr>
40-
<tr>
41-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
37+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
38+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
4239
<td>${t.__('Toggle Do Not Disturb')}</td>
4340
</tr>
44-
<tr>
45-
<td><kbd>Shift</kbd><kbd>${userOSKey}</kbd><kbd>D</kbd></td>
41+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
42+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>M</kbd></td>
43+
<td>${t.__('Toggle Do Not Disturb')}</td>
44+
</tr>
45+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
46+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>D</kbd></td>
4647
<td>${t.__('Reset App Settings')}</td>
4748
</tr>
4849
<tr>
49-
<td><kbd>${userOSKey}</kbd><kbd>L</kbd></td>
50+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>L</kbd></td>
5051
<td>${t.__('Log Out')}</td>
5152
</tr>
52-
<tr>
53-
<td><kbd>${userOSKey}</kbd><kbd>H</kbd></td>
53+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
54+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>H</kbd></td>
5455
<td>${t.__('Hide Zulip')}</td>
5556
</tr>
56-
<tr>
57-
<td><kbd>Option</kbd><kbd>${userOSKey}</kbd><kbd>H</kbd></td>
57+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
58+
<td><kbd>Option</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>H</kbd></td>
5859
<td>${t.__('Hide Others')}</td>
5960
</tr>
6061
<tr>
61-
<td><kbd>${userOSKey}</kbd><kbd>Q</kbd></td>
62+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Q</kbd></td>
6263
<td>${t.__('Quit Zulip')}</td>
6364
</tr>
6465
</table>
@@ -68,35 +69,43 @@ export default class ShortcutsSection extends BaseSection {
6869
<div class="settings-card">
6970
<table>
7071
<tr>
71-
<td><kbd>${userOSKey}</kbd><kbd>Z</kbd></td>
72+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Z</kbd></td>
7273
<td>${t.__('Undo')}</td>
7374
</tr>
74-
<tr>
75-
<td><kbd>Shift</kbd><kbd>${userOSKey}</kbd><kbd>Z</kbd></td>
75+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
76+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>Z</kbd></td>
77+
<td>${t.__('Redo')}</td>
78+
</tr>
79+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
80+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Y</kbd></td>
7681
<td>${t.__('Redo')}</td>
7782
</tr>
7883
<tr>
79-
<td><kbd>${userOSKey}</kbd><kbd>X</kbd></td>
84+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>X</kbd></td>
8085
<td>${t.__('Cut')}</td>
8186
</tr>
8287
<tr>
83-
<td><kbd>${userOSKey}</kbd><kbd>C</kbd></td>
88+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>C</kbd></td>
8489
<td>${t.__('Copy')}</td>
8590
</tr>
8691
<tr>
87-
<td><kbd>${userOSKey}</kbd><kbd>V</kbd></td>
92+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>V</kbd></td>
8893
<td>${t.__('Paste')}</td>
8994
</tr>
90-
<tr>
91-
<td><kbd>Shift</kbd><kbd>${userOSKey}</kbd><kbd>V</kbd></td>
95+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
96+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>V</kbd></td>
97+
<td>${t.__('Paste and Match Style')}</td>
98+
</tr>
99+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
100+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>V</kbd></td>
92101
<td>${t.__('Paste and Match Style')}</td>
93102
</tr>
94103
<tr>
95-
<td><kbd>${userOSKey}</kbd><kbd>A</kbd></td>
104+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>A</kbd></td>
96105
<td>${t.__('Select All')}</td>
97106
</tr>
98-
<tr>
99-
<td><kbd>Control</kbd><kbd>${userOSKey}</kbd><kbd>Space</kbd></td>
107+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
108+
<td><kbd>Control</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>Space</kbd></td>
100109
<td>${t.__('Emoji & Symbols')}</td>
101110
</tr>
102111
</table>
@@ -106,39 +115,63 @@ export default class ShortcutsSection extends BaseSection {
106115
<div class="settings-card">
107116
<table>
108117
<tr>
109-
<td><kbd>${userOSKey}</kbd><kbd>R</kbd></td>
118+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>R</kbd></td>
110119
<td>${t.__('Reload')}</td>
111120
</tr>
112-
<tr>
113-
<td><kbd>Shift</kbd><kbd>${userOSKey}</kbd><kbd>R</kbd></td>
121+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
122+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
114123
<td>${t.__('Hard Reload')}</td>
115124
</tr>
116-
<tr>
117-
<td><kbd>Control</kbd><kbd>${userOSKey}</kbd><kbd>F</kbd></td>
125+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
126+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>R</kbd></td>
127+
<td>${t.__('Hard Reload')}</td>
128+
</tr>
129+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
130+
<td><kbd>F11</kbd></td>
131+
<td>${t.__('Toggle Full Screen')}</td>
132+
</tr>
133+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
134+
<td><kbd>Control</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>F</kbd></td>
118135
<td>${t.__('Enter Full Screen')}</td>
119136
</tr>
120-
<tr>
121-
<td><kbd>${userOSKey}</kbd><kbd>+</kbd></td>
137+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
138+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>+</kbd></td>
139+
<td>${t.__('Zoom In')}</td>
140+
</tr>
141+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
142+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>=</kbd></td>
122143
<td>${t.__('Zoom In')}</td>
123144
</tr>
124145
<tr>
125-
<td><kbd>${userOSKey}</kbd><kbd>-</kbd></td>
146+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>-</kbd></td>
126147
<td>${t.__('Zoom Out')}</td>
127148
</tr>
128149
<tr>
129-
<td><kbd>${userOSKey}</kbd><kbd>0</kbd></td>
150+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>0</kbd></td>
130151
<td>${t.__('Actual Size')}</td>
131152
</tr>
132-
<tr>
133-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
153+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
154+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
134155
<td>${t.__('Toggle Sidebar')}</td>
135156
</tr>
136-
<tr>
137-
<td><kbd>Option</kbd><kbd>${userOSKey}</kbd><kbd>I</kbd></td>
157+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
158+
<td><kbd>Shift</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>S</kbd></td>
159+
<td>${t.__('Toggle Sidebar')}</td>
160+
</tr>
161+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
162+
<td><kbd>Option</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>I</kbd></td>
138163
<td>${t.__('Toggle DevTools for Zulip App')}</td>
139164
</tr>
140-
<tr>
141-
<td><kbd>Option</kbd><kbd>${userOSKey}</kbd><kbd>U</kbd></td>
165+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
166+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
167+
<td>${t.__('Toggle DevTools for Zulip App')}</td>
168+
</tr>
169+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
170+
<td><kbd>Option</kbd> + <kbd>${cmdOrCtrl}</kbd> + <kbd>U</kbd></td>
171+
<td>${t.__('Toggle DevTools for Active Tab')}</td>
172+
</tr>
173+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
174+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>Shift</kbd> + <kbd>U</kbd></td>
142175
<td>${t.__('Toggle DevTools for Active Tab')}</td>
143176
</tr>
144177
<tr>
@@ -155,159 +188,19 @@ export default class ShortcutsSection extends BaseSection {
155188
<div class="title">${t.__('History Shortcuts')}</div>
156189
<div class="settings-card">
157190
<table>
158-
<tr>
159-
<td><kbd>${userOSKey}</kbd><kbd>←</kbd></td>
191+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
192+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>←</kbd></td>
160193
<td>${t.__('Back')}</td>
161194
</tr>
162-
<tr>
163-
<td><kbd>${userOSKey}</kbd><kbd>→</kbd></td>
164-
<td>${t.__('Forward')}</td>
165-
</tr>
166-
</table>
167-
<div class="setting-control"></div>
168-
</div>
169-
<div class="title">Window Shortcuts</div>
170-
<div class="settings-card">
171-
<table>
172-
<tr>
173-
<td><kbd>${userOSKey}</kbd><kbd>M</kbd></td>
174-
<td>${t.__('Minimize')}</td>
175-
</tr>
176-
<tr>
177-
<td><kbd>${userOSKey}</kbd><kbd>W</kbd></td>
178-
<td>${t.__('Close')}</td>
179-
</tr>
180-
</table>
181-
<div class="setting-control"></div>
182-
</div>
183-
</div>
184-
`;
185-
}
186-
187-
templateWinLinHTML(): string {
188-
const userOSKey = 'Ctrl';
189-
190-
return htmlEscape`
191-
<div class="settings-pane">
192-
<div class="settings-card tip"><p><b><i class="material-icons md-14">settings</i>${t.__('Tip')}: </b>${t.__('These desktop app shortcuts extend the Zulip webapp\'s')} <span id="open-hotkeys-link"> ${t.__('keyboard shortcuts')}</span>.</p></div>
193-
<div class="title">${t.__('Application Shortcuts')}</div>
194-
<div class="settings-card">
195-
<table>
196-
<tr>
197-
<td><kbd>${userOSKey}</kbd> + <kbd>,</kbd></td>
198-
<td>${t.__('Settings')}</td>
199-
</tr>
200-
<tr>
201-
<td><kbd>${userOSKey}</kbd> + <kbd>K</kbd></td>
202-
<td>${t.__('Keyboard Shortcuts')}</td>
203-
</tr>
204-
<tr>
205-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
206-
<td>${t.__('Toggle Do Not Disturb')}</td>
207-
</tr>
208-
<tr>
209-
<td><kbd>${userOSKey}</kbd> + <kbd>L</kbd></td>
210-
<td>${t.__('Log Out')}</td>
211-
</tr>
212-
<tr>
213-
<td><kbd>${userOSKey}</kbd> + <kbd>Q</kbd></td>
214-
<td>${t.__('Quit Zulip')}</td>
215-
</tr>
216-
</table>
217-
<div class="setting-control"></div>
218-
</div>
219-
<div class="title">${t.__('Edit Shortcuts')}</div>
220-
<div class="settings-card">
221-
<table>
222-
<tr>
223-
<td><kbd>${userOSKey}</kbd> + <kbd>Z</kbd></td>
224-
<td>${t.__('Undo')}</td>
225-
</tr>
226-
<tr>
227-
<td><kbd>${userOSKey}</kbd> + <kbd>Y</kbd></td>
228-
<td>${t.__('Redo')}</td>
229-
</tr>
230-
<tr>
231-
<td><kbd>${userOSKey}</kbd> + <kbd>X</kbd></td>
232-
<td>${t.__('Cut')}</td>
233-
</tr>
234-
<tr>
235-
<td><kbd>${userOSKey}</kbd> + <kbd>C</kbd></td>
236-
<td>${t.__('Copy')}</td>
237-
</tr>
238-
<tr>
239-
<td><kbd>${userOSKey}</kbd> + <kbd>V</kbd></td>
240-
<td>${t.__('Paste')}</td>
241-
</tr>
242-
<tr>
243-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>V</kbd></td>
244-
<td>${t.__('Paste and Match Style')}</td>
245-
</tr>
246-
<tr>
247-
<td><kbd>${userOSKey}</kbd> + <kbd>A</kbd></td>
248-
<td>${t.__('Select All')}</td>
249-
</tr>
250-
</table>
251-
<div class="setting-control"></div>
252-
</div>
253-
<div class="title">${t.__('View Shortcuts')}</div>
254-
<div class="settings-card">
255-
<table>
256-
<tr>
257-
<td><kbd>${userOSKey}</kbd> + <kbd>R</kbd></td>
258-
<td>${t.__('Reload')}</td>
259-
</tr>
260-
<tr>
261-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
262-
<td>${t.__('Hard Reload')}</td>
263-
</tr>
264-
<tr>
265-
<td><kbd>F11</kbd></td>
266-
<td>${t.__('Toggle Full Screen')}</td>
267-
</tr>
268-
<tr>
269-
<td><kbd>${userOSKey}</kbd> + <kbd>=</kbd></td>
270-
<td>${t.__('Zoom In')}</td>
271-
</tr>
272-
<tr>
273-
<td><kbd>${userOSKey}</kbd> + <kbd>-</kbd></td>
274-
<td>${t.__('Zoom Out')}</td>
275-
</tr>
276-
<tr>
277-
<td><kbd>${userOSKey}</kbd> + <kbd>0</kbd></td>
278-
<td>${t.__('Actual Size')}</td>
279-
</tr>
280-
<tr>
281-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
282-
<td>${t.__('Toggle Sidebar')}</td>
283-
</tr>
284-
<tr>
285-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
286-
<td>${t.__('Toggle DevTools for Zulip App')}</td>
287-
</tr>
288-
<tr>
289-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>U</kbd></td>
290-
<td>${t.__('Toggle DevTools for Active Tab')}</td>
291-
</tr>
292-
<tr>
293-
<td><kbd>${userOSKey}</kbd> + <kbd>Tab</kbd></td>
294-
<td>${t.__('Switch to Next Organization')}</td>
295-
</tr>
296-
<tr>
297-
<td><kbd>${userOSKey}</kbd> + <kbd>Shift</kbd> + <kbd>Tab</kbd></td>
298-
<td>${t.__('Switch to Previous Organization')}</td>
299-
</tr>
300-
</table>
301-
<div class="setting-control"></div>
302-
</div>
303-
<div class="title">${t.__('History Shortcuts')}</div>
304-
<div class="settings-card">
305-
<table>
306-
<tr>
195+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
307196
<td><kbd>Alt</kbd> + <kbd>←</kbd></td>
308197
<td>${t.__('Back')}</td>
309198
</tr>
310-
<tr>
199+
<tr ${process.platform === 'darwin' ? '' : 'hidden'}>
200+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>→</kbd></td>
201+
<td>${t.__('Forward')}</td>
202+
</tr>
203+
<tr ${process.platform === 'darwin' ? 'hidden' : ''}>
311204
<td><kbd>Alt</kbd> + <kbd>→</kbd></td>
312205
<td>${t.__('Forward')}</td>
313206
</tr>
@@ -318,11 +211,11 @@ export default class ShortcutsSection extends BaseSection {
318211
<div class="settings-card">
319212
<table>
320213
<tr>
321-
<td><kbd>${userOSKey}</kbd> + <kbd>M</kbd></td>
214+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>M</kbd></td>
322215
<td>${t.__('Minimize')}</td>
323216
</tr>
324217
<tr>
325-
<td><kbd>${userOSKey}</kbd> + <kbd>W</kbd></td>
218+
<td><kbd>${cmdOrCtrl}</kbd> + <kbd>W</kbd></td>
326219
<td>${t.__('Close')}</td>
327220
</tr>
328221
</table>
@@ -341,8 +234,7 @@ export default class ShortcutsSection extends BaseSection {
341234
}
342235

343236
init(): void {
344-
this.props.$root.innerHTML = (process.platform === 'darwin') ?
345-
this.templateMacHTML() : this.templateWinLinHTML();
237+
this.props.$root.innerHTML = this.templateHTML();
346238
this.openHotkeysExternalLink();
347239
}
348240
}

0 commit comments

Comments
 (0)