Skip to content

Commit 8398d63

Browse files
authored
Merge branch 'develop' into eye-icon
2 parents 4392718 + 54e743a commit 8398d63

21 files changed

+136
-79
lines changed

client/common/useKeyDownHandlers.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,11 @@ export default function useKeyDownHandlers(keyHandlers) {
3333
const isMac = navigator.userAgent.toLowerCase().indexOf('mac') !== -1;
3434
const isCtrl = isMac ? e.metaKey : e.ctrlKey;
3535
if (e.shiftKey && isCtrl) {
36-
handlers.current[`ctrl-shift-${e.key.toLowerCase()}`]?.(e);
36+
handlers.current[
37+
`ctrl-shift-${
38+
/^\d+$/.test(e.code.at(-1)) ? e.code.at(-1) : e.key.toLowerCase()
39+
}`
40+
]?.(e);
3741
} else if (isCtrl) {
3842
handlers.current[`ctrl-${e.key.toLowerCase()}`]?.(e);
3943
}

client/components/PreviewNav.jsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,14 @@ const PreviewNav = ({ owner, project }) => {
1212
<nav className="nav preview-nav">
1313
<div className="nav__items-left">
1414
<div className="nav__item-logo">
15-
<LogoIcon
16-
role="img"
17-
aria-label={t('Common.p5logoARIA')}
18-
focusable="false"
19-
className="svg__logo"
20-
/>
15+
<Link to={`/${owner.username}/sketches`}>
16+
<LogoIcon
17+
role="img"
18+
aria-label={t('Common.p5logoARIA')}
19+
focusable="false"
20+
className="svg__logo"
21+
/>
22+
</Link>
2123
</div>
2224
<Link
2325
className="nav__item"

client/modules/IDE/components/AssetSize.jsx

Lines changed: 7 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import PropTypes from 'prop-types';
21
import React from 'react';
3-
import { connect } from 'react-redux';
2+
import { useSelector } from 'react-redux';
43
import prettyBytes from 'pretty-bytes';
54

65
import getConfig from '../../../utils/getConfig';
@@ -18,7 +17,11 @@ const formatPercent = (percent) => {
1817
};
1918

2019
/* Eventually, this copy should be Total / 250 MB Used */
21-
const AssetSize = ({ totalSize }) => {
20+
const AssetSize = () => {
21+
const totalSize = useSelector(
22+
(state) => state.user.totalSize || state.assets.totalSize
23+
);
24+
2225
if (totalSize === undefined) {
2326
return null;
2427
}
@@ -40,15 +43,4 @@ const AssetSize = ({ totalSize }) => {
4043
);
4144
};
4245

43-
AssetSize.propTypes = {
44-
totalSize: PropTypes.number.isRequired
45-
};
46-
47-
function mapStateToProps(state) {
48-
return {
49-
user: state.user,
50-
totalSize: state.user.totalSize || state.assets.totalSize
51-
};
52-
}
53-
54-
export default connect(mapStateToProps)(AssetSize);
46+
export default AssetSize;

client/modules/IDE/components/Editor/index.jsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -239,6 +239,16 @@ class Editor extends React.Component {
239239

240240
componentDidUpdate(prevProps) {
241241
if (this.props.file.id !== prevProps.file.id) {
242+
const fileMode = this.getFileMode(this.props.file.name);
243+
if (fileMode === 'javascript') {
244+
// Define the new Emmet configuration based on the file mode
245+
const emmetConfig = {
246+
preview: ['html'],
247+
markTagPairs: false,
248+
autoRenameTags: true
249+
};
250+
this._cm.setOption('emmet', emmetConfig);
251+
}
242252
const oldDoc = this._cm.swapDoc(this._docs[this.props.file.id]);
243253
this._docs[prevProps.file.id] = oldDoc;
244254
this._cm.focus();

client/modules/IDE/components/FileNode.jsx

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,11 +187,19 @@ class FileNode extends React.Component {
187187
if (
188188
hasEmptyFilename ||
189189
hasNoExtension ||
190-
notSameExtension ||
191190
hasOnlyExtension ||
192191
hasExtensionIfFolder
193192
) {
194193
this.setUpdatedName(currentName);
194+
} else if (notSameExtension) {
195+
const userResponse = window.confirm(
196+
'Are you sure you want to change the file extension?'
197+
);
198+
if (userResponse) {
199+
this.saveUpdatedFileName();
200+
} else {
201+
this.setUpdatedName(currentName);
202+
}
195203
} else {
196204
this.saveUpdatedFileName();
197205
}

client/modules/IDE/components/Header/Nav.jsx

Lines changed: 22 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ const ProjectMenu = () => {
114114
const isUserOwner = useSelector(getIsUserOwner);
115115
const project = useSelector((state) => state.project);
116116
const user = useSelector((state) => state.user);
117-
117+
const userSketches = `/${user.username}/sketches`;
118118
const isUnsaved = !project?.id;
119119

120120
const rootFile = useSelector(selectRootFile);
@@ -137,12 +137,25 @@ const ProjectMenu = () => {
137137
return (
138138
<ul className="nav__items-left">
139139
<li className="nav__item-logo">
140-
<LogoIcon
141-
role="img"
142-
aria-label={t('Common.p5logoARIA')}
143-
focusable="false"
144-
className="svg__logo"
145-
/>
140+
{user && user.username !== undefined ? (
141+
<Link to={userSketches}>
142+
<LogoIcon
143+
role="img"
144+
aria-label={t('Common.p5logoARIA')}
145+
focusable="false"
146+
className="svg__logo"
147+
/>
148+
</Link>
149+
) : (
150+
<a href="https://p5js.org">
151+
<LogoIcon
152+
role="img"
153+
aria-label={t('Common.p5logoARIA')}
154+
focusable="false"
155+
className="svg__logo"
156+
/>
157+
</a>
158+
)}
146159
</li>
147160
<NavDropdownMenu id="file" title={t('Nav.File.Title')}>
148161
<NavMenuItem onClick={newSketch}>{t('Nav.File.New')}</NavMenuItem>
@@ -193,9 +206,7 @@ const ProjectMenu = () => {
193206
<NavDropdownMenu id="edit" title={t('Nav.Edit.Title')}>
194207
<NavMenuItem onClick={cmRef.current?.tidyCode}>
195208
{t('Nav.Edit.TidyCode')}
196-
<span className="nav__keyboard-shortcut">
197-
{metaKeyName}+{'\u21E7'}+F
198-
</span>
209+
<span className="nav__keyboard-shortcut">{metaKeyName}+Shift+F</span>
199210
</NavMenuItem>
200211
<NavMenuItem onClick={cmRef.current?.showFind}>
201212
{t('Nav.Edit.Find')}
@@ -220,7 +231,7 @@ const ProjectMenu = () => {
220231
<NavMenuItem onClick={() => dispatch(stopSketch())}>
221232
{t('Nav.Sketch.Stop')}
222233
<span className="nav__keyboard-shortcut">
223-
{'\u21E7'}+{metaKeyName}+Enter
234+
Shift+{metaKeyName}+Enter
224235
</span>
225236
</NavMenuItem>
226237
</NavDropdownMenu>

client/modules/IDE/components/Header/__snapshots__/Nav.unit.test.jsx.snap

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -473,12 +473,16 @@ exports[`Nav renders editor version for desktop 1`] = `
473473
<li
474474
class="nav__item-logo"
475475
>
476-
<test-file-stub
477-
aria-label="p5.js Logo"
478-
classname="svg__logo"
479-
focusable="false"
480-
role="img"
481-
/>
476+
<a
477+
href="https://p5js.org"
478+
>
479+
<test-file-stub
480+
aria-label="p5.js Logo"
481+
classname="svg__logo"
482+
focusable="false"
483+
role="img"
484+
/>
485+
</a>
482486
</li>
483487
<li
484488
class="nav__item"
@@ -533,7 +537,7 @@ exports[`Nav renders editor version for desktop 1`] = `
533537
<span
534538
class="nav__keyboard-shortcut"
535539
>
536-
⌃+⇧+F
540+
Ctrl+Shift+F
537541
</span>
538542
</button>
539543
</li>
@@ -545,7 +549,7 @@ exports[`Nav renders editor version for desktop 1`] = `
545549
<span
546550
class="nav__keyboard-shortcut"
547551
>
548-
+F
552+
Ctrl+F
549553
</span>
550554
</button>
551555
</li>
@@ -557,7 +561,7 @@ exports[`Nav renders editor version for desktop 1`] = `
557561
<span
558562
class="nav__keyboard-shortcut"
559563
>
560-
+H
564+
Ctrl+H
561565
</span>
562566
</button>
563567
</li>
@@ -603,7 +607,7 @@ exports[`Nav renders editor version for desktop 1`] = `
603607
<span
604608
class="nav__keyboard-shortcut"
605609
>
606-
+Enter
610+
Ctrl+Enter
607611
</span>
608612
</button>
609613
</li>
@@ -615,7 +619,7 @@ exports[`Nav renders editor version for desktop 1`] = `
615619
<span
616620
class="nav__keyboard-shortcut"
617621
>
618-
⇧+⌃+Enter
622+
Shift+Ctrl+Enter
619623
</span>
620624
</button>
621625
</li>

client/modules/IDE/components/KeyboardShortcutModal.jsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ function KeyboardShortcutModal() {
2525
<ul className="keyboard-shortcuts__list">
2626
<li className="keyboard-shortcut-item">
2727
<span className="keyboard-shortcut__command">
28-
{metaKeyName} + {'\u21E7'} + F
28+
{metaKeyName} + Shift + F
2929
</span>
3030
<span>{t('KeyboardShortcuts.CodeEditing.Tidy')}</span>
3131
</li>
@@ -39,7 +39,7 @@ function KeyboardShortcutModal() {
3939
</li>
4040
<li className="keyboard-shortcut-item">
4141
<span className="keyboard-shortcut__command">
42-
{metaKeyName} + {'\u21E7'} + G
42+
{metaKeyName} + Shift + G
4343
</span>
4444
<span>
4545
{t('KeyboardShortcuts.CodeEditing.FindPreviousTextMatch')}
@@ -84,24 +84,24 @@ function KeyboardShortcutModal() {
8484
</li>
8585
<li className="keyboard-shortcut-item">
8686
<span className="keyboard-shortcut__command">
87-
{metaKeyName} + {'\u21E7'} + Enter
87+
{metaKeyName} + Shift + Enter
8888
</span>
8989
<span>{t('KeyboardShortcuts.General.StopSketch')}</span>
9090
</li>
9191
<li className="keyboard-shortcut-item">
9292
<span className="keyboard-shortcut__command">
93-
{metaKeyName} + {'\u21E7'} + 1
93+
{metaKeyName} + Shift + 1
9494
</span>
9595
<span>{t('KeyboardShortcuts.General.TurnOnAccessibleOutput')}</span>
9696
</li>
9797
<li className="keyboard-shortcut-item">
9898
<span className="keyboard-shortcut__command">
99-
{metaKeyName} + {'\u21E7'} + 2
99+
{metaKeyName} + Shift + 2
100100
</span>
101101
<span>{t('KeyboardShortcuts.General.TurnOffAccessibleOutput')}</span>
102102
</li>
103103
<li className="keyboard-shortcut-item">
104-
<span className="keyboard-shortcut__command">{'\u21E7'} + Right</span>
104+
<span className="keyboard-shortcut__command">Shift + Right</span>
105105
<span>Go to Reference for Selected Item in Hinter</span>
106106
</li>
107107
</ul>

client/modules/IDE/components/NewFileForm.jsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -55,11 +55,15 @@ function NewFileForm() {
5555
</React.Fragment>
5656
)}
5757
</Field>
58-
<Button type="submit" disabled={invalid || submitting}>
59-
{t('NewFileForm.AddFileSubmit')}
60-
</Button>
58+
<Field name="submitButton">
59+
{() => (
60+
<Button type="submit" disabled={submitting}>
61+
{t('NewFileForm.AddFileSubmit')}
62+
</Button>
63+
)}
64+
</Field>
6165
</div>
62-
{touched.name && errors.name && (
66+
{touched.submitButton && errors.name && (
6367
<span className="form-error">{errors.name}</span>
6468
)}
6569
</form>

client/modules/IDE/components/NewFolderForm.jsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,15 @@ function NewFolderForm() {
5252
</React.Fragment>
5353
)}
5454
</Field>
55-
<Button type="submit" disabled={invalid || submitting}>
56-
{t('NewFolderForm.AddFolderSubmit')}
57-
</Button>
55+
<Field name="submitButton">
56+
{() => (
57+
<Button type="submit" disabled={submitting}>
58+
{t('NewFolderForm.AddFolderSubmit')}
59+
</Button>
60+
)}
61+
</Field>
5862
</div>
59-
{touched.name && errors.name && (
63+
{touched.submitButton && errors.name && (
6064
<span className="form-error">{errors.name}</span>
6165
)}
6266
</form>

0 commit comments

Comments
 (0)