Skip to content

Commit 9e4c1cc

Browse files
raclimraclim
authored
Merge branch 'develop' into new_branch
2 parents ac0ae8e + cb0e8d3 commit 9e4c1cc

File tree

29 files changed

+281
-227
lines changed

29 files changed

+281
-227
lines changed

‎.eslintrc‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@
1414
"import/named": 0,
1515
"import/namespace": 0,
1616
"import/no-unresolved": 0,
17-
"import/no-named-as-default": 2,
17+
"import/no-named-as-default": 0,
18+
"import/no-named-as-default-member": 0,
1819
"comma-dangle": 0, // not sure why airbnb turned this on. gross!
1920
"indent": 0,
2021
"no-console": 0,

‎client/common/useKeyDownHandlers.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,9 @@ export default function useKeyDownHandlers(keyHandlers) {
3838
/^\d+$/.test(e.code.at(-1)) ? e.code.at(-1) : e.key.toLowerCase()
3939
}`
4040
]?.(e);
41+
} else if (isCtrl && e.altKey && e.code === 'KeyN') {
42+
// specifically for creating a new file
43+
handlers.current[`ctrl-alt-n`]?.(e);
4144
} else if (isCtrl) {
4245
handlers.current[`ctrl-${e.key.toLowerCase()}`]?.(e);
4346
}

‎client/constants.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -55,8 +55,6 @@ export const COLLAPSE_SIDEBAR = 'COLLAPSE_SIDEBAR';
5555
export const EXPAND_CONSOLE = 'EXPAND_CONSOLE';
5656
export const COLLAPSE_CONSOLE = 'COLLAPSE_CONSOLE';
5757

58-
export const UPDATE_LINT_MESSAGE = 'UPDATE_LINT_MESSAGE';
59-
export const CLEAR_LINT_MESSAGE = 'CLEAR_LINT_MESSAGE';
6058
export const TOGGLE_FORCE_DESKTOP = 'TOGGLE_FORCE_DESKTOP';
6159

6260
export const UPDATE_FILE_NAME = 'UPDATE_FILE_NAME';

‎client/index.jsx‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,21 @@ const initialState = window.__INITIAL_STATE__;
2121
const store = configureStore(initialState);
2222

2323
const App = () => (
24-
<Provider store={store}>
25-
<ThemeProvider>
26-
<Router history={browserHistory}>
27-
<SkipLink targetId="play-sketch" text="PlaySketch" />
28-
<Routing />
29-
</Router>
30-
</ThemeProvider>
31-
</Provider>
24+
<>
25+
<Router history={browserHistory}>
26+
<SkipLink targetId="play-sketch" text="PlaySketch" />
27+
<Routing />
28+
</Router>
29+
</>
3230
);
3331

3432
render(
35-
<Suspense fallback={<Loader />}>
36-
<App />
37-
</Suspense>,
33+
<Provider store={store}>
34+
<ThemeProvider>
35+
<Suspense fallback={<Loader />}>
36+
<App />
37+
</Suspense>
38+
</ThemeProvider>
39+
</Provider>,
3840
document.getElementById('root')
3941
);

‎client/modules/App/components/loader.jsx‎

Lines changed: 50 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,55 @@
11
import React from 'react';
2+
import styled, { keyframes } from 'styled-components';
3+
import { prop, remSize } from '../../../theme';
4+
5+
const skBounce = keyframes`
6+
0%, 100% {
7+
transform: scale(0.0);
8+
}
9+
50% {
10+
transform: scale(1.0);
11+
}
12+
`;
13+
const Container = styled.div`
14+
&&& {
15+
width: 100%;
16+
height: 100%;
17+
display: flex;
18+
justify-content: center;
19+
align-items: center;
20+
background-color: ${prop('backgroundColor')};
21+
}
22+
`;
23+
const LoaderWrapper = styled.div`
24+
&&& {
25+
width: ${remSize(80)};
26+
height: ${remSize(80)};
27+
position: relative;
28+
}
29+
`;
30+
const LoaderCircle = styled.div`
31+
&&& {
32+
width: 100%;
33+
height: 100%;
34+
border-radius: 80%;
35+
background-color: ${prop('logoColor')};
36+
opacity: 0.6;
37+
position: absolute;
38+
top: 0;
39+
left: 0;
40+
animation: ${skBounce} 2s infinite ease-in-out;
41+
&:nth-child(2) {
42+
animation-delay: -1s;
43+
}
44+
}
45+
`;
246

347
const Loader = () => (
4-
<div className="loader-container">
5-
<div className="loader">
6-
<div className="loader__circle1" />
7-
<div className="loader__circle2" />
8-
</div>
9-
</div>
48+
<Container>
49+
<LoaderWrapper>
50+
<LoaderCircle />
51+
<LoaderCircle />
52+
</LoaderWrapper>
53+
</Container>
1054
);
1155
export default Loader;

‎client/modules/IDE/actions/editorAccessibility.js‎

Lines changed: 5 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,5 @@
1-
import * as ActionTypes from '../../../constants';
2-
3-
export function updateLintMessage(severity, line, message) {
4-
return {
5-
type: ActionTypes.UPDATE_LINT_MESSAGE,
6-
severity,
7-
line,
8-
message
9-
};
10-
}
11-
12-
export function clearLintMessage() {
13-
return {
14-
type: ActionTypes.CLEAR_LINT_MESSAGE
15-
};
16-
}
17-
18-
export function toggleForceDesktop() {
19-
return {
20-
type: ActionTypes.TOGGLE_FORCE_DESKTOP
21-
};
22-
}
1+
export {
2+
updateLintMessage,
3+
clearLintMessage,
4+
toggleForceDesktop
5+
} from '../reducers/editorAccessibility';

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,8 @@ const ProjectMenu = () => {
133133

134134
const replaceCommand =
135135
metaKey === 'Ctrl' ? `${metaKeyName}+H` : `${metaKeyName}+⌥+F`;
136+
const newFileCommand =
137+
metaKey === 'Ctrl' ? `${metaKeyName}+Alt+N` : `${metaKeyName}+⌥+N`;
136138

137139
return (
138140
<ul className="nav__items-left" role="menubar">
@@ -220,6 +222,7 @@ const ProjectMenu = () => {
220222
<NavDropdownMenu id="sketch" title={t('Nav.Sketch.Title')}>
221223
<NavMenuItem onClick={() => dispatch(newFile(rootFile.id))}>
222224
{t('Nav.Sketch.AddFile')}
225+
<span className="nav__keyboard-shortcut">{newFileCommand}</span>
223226
</NavMenuItem>
224227
<NavMenuItem onClick={() => dispatch(newFolder(rootFile.id))}>
225228
{t('Nav.Sketch.AddFolder')}

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

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -637,6 +637,11 @@ exports[`Nav renders editor version for desktop 1`] = `
637637
role="menuitem"
638638
>
639639
Add File
640+
<span
641+
class="nav__keyboard-shortcut"
642+
>
643+
Ctrl+Alt+N
644+
</span>
640645
</button>
641646
</li>
642647
<li

‎client/modules/IDE/components/IDEKeyHandlers.jsx‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@ import {
88
expandSidebar,
99
showErrorModal,
1010
startSketch,
11-
stopSketch
11+
stopSketch,
12+
newFile
1213
} from '../actions/ide';
1314
import { setAllAccessibleOutput } from '../actions/preferences';
1415
import { cloneProject, saveProject } from '../actions/project';
@@ -25,6 +26,10 @@ export const useIDEKeyHandlers = ({ getContent }) => {
2526
const sidebarIsExpanded = useSelector((state) => state.ide.sidebarIsExpanded);
2627
const consoleIsExpanded = useSelector((state) => state.ide.consoleIsExpanded);
2728

29+
const rootFile = useSelector(
30+
(state) => state.files.filter((file) => file.name === 'root')[0]
31+
);
32+
2833
const isUserOwner = useSelector(getIsUserOwner);
2934
const isAuthenticated = useSelector(getAuthenticated);
3035
const sketchOwner = useSelector(getSketchOwner);
@@ -72,6 +77,11 @@ export const useIDEKeyHandlers = ({ getContent }) => {
7277
sidebarIsExpanded ? collapseSidebar() : expandSidebar()
7378
);
7479
},
80+
'ctrl-alt-n': (e) => {
81+
e.preventDefault();
82+
e.stopPropagation();
83+
dispatch(newFile(rootFile.id));
84+
},
7585
'ctrl-`': (e) => {
7686
e.preventDefault();
7787
dispatch(consoleIsExpanded ? collapseConsole() : expandConsole());

‎client/modules/IDE/components/KeyboardShortcutModal.jsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ function KeyboardShortcutModal() {
66
const { t } = useTranslation();
77
const replaceCommand =
88
metaKey === 'Ctrl' ? `${metaKeyName} + H` : `${metaKeyName} + ⌥ + F`;
9+
const newFileCommand =
10+
metaKey === 'Ctrl' ? `${metaKeyName} + Alt + N` : `${metaKeyName} + ⌥ + N`;
911
return (
1012
<div className="keyboard-shortcuts">
1113
<h3 className="keyboard-shortcuts__title">
@@ -69,6 +71,10 @@ function KeyboardShortcutModal() {
6971
<span className="keyboard-shortcut__command">{metaKeyName} + K</span>
7072
<span>{t('KeyboardShortcuts.CodeEditing.ColorPicker')}</span>
7173
</li>
74+
<li className="keyboard-shortcut-item">
75+
<span className="keyboard-shortcut__command">{newFileCommand}</span>
76+
<span>{t('KeyboardShortcuts.CodeEditing.CreateNewFile')}</span>
77+
</li>
7278
</ul>
7379
<h3 className="keyboard-shortcuts__title">General</h3>
7480
<ul className="keyboard-shortcuts__list">

0 commit comments

Comments
 (0)