Skip to content

Commit ff776dc

Browse files
benjiwheelerbenjiwheeler
authored
Merge pull request scratchfoundation#4784 from benjiwheeler/fix-save-on-see-project-page
Fix auto-save when clicking See Project Page
2 parents ed93162 + 516baed commit ff776dc

File tree

4 files changed

+236
-54
lines changed

4 files changed

+236
-54
lines changed

‎src/components/menu-bar/confirm-replace-hoc.jsx

Lines changed: 0 additions & 50 deletions
This file was deleted.

‎src/components/menu-bar/menu-bar.jsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import LoginDropdown from './login-dropdown.jsx';
2828
import SB3Downloader from '../../containers/sb3-downloader.jsx';
2929
import DeletionRestorer from '../../containers/deletion-restorer.jsx';
3030
import TurboMode from '../../containers/turbo-mode.jsx';
31-
import ConfirmReplaceHOC from './confirm-replace-hoc.jsx';
31+
import MenuBarHOC from '../../containers/menu-bar-hoc.jsx';
3232

3333
import {openTipsLibrary} from '../../reducers/modals';
3434
import {setPlayer} from '../../reducers/mode';
@@ -192,8 +192,8 @@ class MenuBar extends React.Component {
192192
this.props.onRequestCloseFile();
193193
}
194194
handleClickSeeCommunity (waitForUpdate) {
195-
if (this.props.canSave && this.props.projectChanged) { // save before transitioning to project page
196-
this.props.autoUpdateProject();
195+
if (this.props.shouldSaveBeforeTransition()) {
196+
this.props.autoUpdateProject(); // save before transitioning to project page
197197
waitForUpdate(true); // queue the transition to project page
198198
} else {
199199
waitForUpdate(false); // immediately transition to project page
@@ -705,6 +705,7 @@ MenuBar.propTypes = {
705705
canSave: PropTypes.bool,
706706
canShare: PropTypes.bool,
707707
className: PropTypes.string,
708+
confirmReadyToReplaceProject: PropTypes.func,
708709
editMenuOpen: PropTypes.bool,
709710
enableCommunity: PropTypes.bool,
710711
fileMenuOpen: PropTypes.bool,
@@ -741,6 +742,7 @@ MenuBar.propTypes = {
741742
projectTitle: PropTypes.string,
742743
renderLogin: PropTypes.func,
743744
sessionExists: PropTypes.bool,
745+
shouldSaveBeforeTransition: PropTypes.func,
744746
showComingSoon: PropTypes.bool,
745747
username: PropTypes.string,
746748
vm: PropTypes.instanceOf(VM).isRequired
@@ -794,7 +796,7 @@ const mapDispatchToProps = dispatch => ({
794796

795797
export default compose(
796798
injectIntl,
797-
ConfirmReplaceHOC,
799+
MenuBarHOC,
798800
connect(
799801
mapStateToProps,
800802
mapDispatchToProps

‎src/containers/menu-bar-hoc.jsx

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import {connect} from 'react-redux';
2+
import PropTypes from 'prop-types';
3+
import bindAll from 'lodash.bindall';
4+
import React from 'react';
5+
6+
const MenuBarHOC = function (WrappedComponent) {
7+
class MenuBarContainer extends React.PureComponent {
8+
constructor (props) {
9+
super(props);
10+
11+
bindAll(this, [
12+
'confirmReadyToReplaceProject',
13+
'shouldSaveBeforeTransition'
14+
]);
15+
}
16+
confirmReadyToReplaceProject (message) {
17+
let readyToReplaceProject = true;
18+
if (this.props.projectChanged && !this.props.canCreateNew) {
19+
readyToReplaceProject = this.props.confirmWithMessage(message);
20+
}
21+
return readyToReplaceProject;
22+
}
23+
shouldSaveBeforeTransition () {
24+
return (this.props.canSave && this.props.projectChanged);
25+
}
26+
render () {
27+
const {
28+
/* eslint-disable no-unused-vars */
29+
projectChanged,
30+
/* eslint-enable no-unused-vars */
31+
...props
32+
} = this.props;
33+
return (<WrappedComponent
34+
confirmReadyToReplaceProject={this.confirmReadyToReplaceProject}
35+
shouldSaveBeforeTransition={this.shouldSaveBeforeTransition}
36+
{...props}
37+
/>);
38+
}
39+
}
40+
41+
MenuBarContainer.propTypes = {
42+
canCreateNew: PropTypes.bool,
43+
canSave: PropTypes.bool,
44+
confirmWithMessage: PropTypes.func,
45+
projectChanged: PropTypes.bool
46+
};
47+
MenuBarContainer.defaultProps = {
48+
// default to using standard js confirm
49+
confirmWithMessage: message => (confirm(message)) // eslint-disable-line no-alert
50+
};
51+
const mapStateToProps = state => ({
52+
projectChanged: state.scratchGui.projectChanged
53+
});
54+
const mapDispatchToProps = () => ({});
55+
// Allow incoming props to override redux-provided props. Used to mock in tests.
56+
const mergeProps = (stateProps, dispatchProps, ownProps) => Object.assign(
57+
{}, stateProps, dispatchProps, ownProps
58+
);
59+
return connect(
60+
mapStateToProps,
61+
mapDispatchToProps,
62+
mergeProps
63+
)(MenuBarContainer);
64+
};
65+
66+
export default MenuBarHOC;

‎test/unit/containers/menu-bar-hoc.test.jsx

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
import React from 'react';
2+
import {mount} from 'enzyme';
3+
import configureStore from 'redux-mock-store';
4+
import MenuBarHOC from '../../../src/containers/menu-bar-hoc.jsx';
5+
6+
describe('Menu Bar HOC', () => {
7+
const mockStore = configureStore();
8+
let store;
9+
10+
beforeEach(() => {
11+
store = mockStore({
12+
scratchGui: {
13+
projectChanged: true
14+
}
15+
});
16+
});
17+
18+
test('Logged in user who IS owner and HAS changed project will NOT be prompted to save', () => {
19+
const Component = () => (<div />);
20+
const WrappedComponent = MenuBarHOC(Component);
21+
const wrapper = mount(
22+
<WrappedComponent
23+
canCreateNew
24+
canSave
25+
projectChanged
26+
// assume the user will click "cancel" on the confirm dialog
27+
confirmWithMessage={() => (false)} // eslint-disable-line react/jsx-no-bind
28+
store={store}
29+
/>
30+
);
31+
const child = wrapper.find(Component);
32+
expect(child.props().projectChanged).toBeUndefined();
33+
expect(child.props().confirmReadyToReplaceProject('message')).toBe(true);
34+
});
35+
36+
test('Logged in user who IS owner and has NOT changed project will NOT be prompted to save', () => {
37+
const Component = () => (<div />);
38+
const WrappedComponent = MenuBarHOC(Component);
39+
const wrapper = mount(
40+
<WrappedComponent
41+
canCreateNew
42+
canSave
43+
confirmWithMessage={() => (false)} // eslint-disable-line react/jsx-no-bind
44+
projectChanged={false}
45+
store={store}
46+
/>
47+
);
48+
const child = wrapper.find(Component);
49+
expect(child.props().projectChanged).toBeUndefined();
50+
expect(child.props().confirmReadyToReplaceProject('message')).toBe(true);
51+
});
52+
53+
test('Logged in user who is NOT owner and HAS changed project will NOT be prompted to save', () => {
54+
const Component = () => (<div />);
55+
const WrappedComponent = MenuBarHOC(Component);
56+
const wrapper = mount(
57+
<WrappedComponent
58+
canCreateNew
59+
projectChanged
60+
canSave={false}
61+
confirmWithMessage={() => (false)} // eslint-disable-line react/jsx-no-bind
62+
store={store}
63+
/>
64+
);
65+
const child = wrapper.find(Component);
66+
expect(child.props().projectChanged).toBeUndefined();
67+
expect(child.props().confirmReadyToReplaceProject('message')).toBe(true);
68+
});
69+
70+
test('Logged OUT user who HAS changed project WILL be prompted to save', () => {
71+
const Component = () => (<div />);
72+
const WrappedComponent = MenuBarHOC(Component);
73+
const wrapper = mount(
74+
<WrappedComponent
75+
projectChanged
76+
canCreateNew={false}
77+
canSave={false}
78+
confirmWithMessage={() => (false)} // eslint-disable-line react/jsx-no-bind
79+
store={store}
80+
/>
81+
);
82+
const child = wrapper.find(Component);
83+
expect(child.props().projectChanged).toBeUndefined();
84+
expect(child.props().confirmReadyToReplaceProject('message')).toBe(false);
85+
});
86+
87+
test('Logged OUT user who has NOT changed project WILL NOT be prompted to save', () => {
88+
const Component = () => (<div />);
89+
const WrappedComponent = MenuBarHOC(Component);
90+
const wrapper = mount(
91+
<WrappedComponent
92+
canCreateNew={false}
93+
canSave={false}
94+
confirmWithMessage={() => (false)} // eslint-disable-line react/jsx-no-bind
95+
projectChanged={false}
96+
store={store}
97+
/>
98+
);
99+
const child = wrapper.find(Component);
100+
expect(child.props().projectChanged).toBeUndefined();
101+
expect(child.props().confirmReadyToReplaceProject('message')).toBe(true);
102+
});
103+
104+
test('Logged in user who IS owner and HAS changed project SHOULD save before transition to project page', () => {
105+
const Component = () => (<div />);
106+
const WrappedComponent = MenuBarHOC(Component);
107+
const wrapper = mount(
108+
<WrappedComponent
109+
canSave
110+
projectChanged
111+
store={store}
112+
/>
113+
);
114+
const child = wrapper.find(Component);
115+
expect(child.props().projectChanged).toBeUndefined();
116+
expect(child.props().shouldSaveBeforeTransition()).toBe(true);
117+
});
118+
119+
test('Logged in user who IS owner and has NOT changed project should NOT save before transition', () => {
120+
const Component = () => (<div />);
121+
const WrappedComponent = MenuBarHOC(Component);
122+
const wrapper = mount(
123+
<WrappedComponent
124+
canSave
125+
projectChanged={false}
126+
store={store}
127+
/>
128+
);
129+
const child = wrapper.find(Component);
130+
expect(child.props().projectChanged).toBeUndefined();
131+
expect(child.props().shouldSaveBeforeTransition()).toBe(false);
132+
});
133+
134+
test('Logged in user who is NOT owner and HAS changed project should NOT save before transition', () => {
135+
const Component = () => (<div />);
136+
const WrappedComponent = MenuBarHOC(Component);
137+
const wrapper = mount(
138+
<WrappedComponent
139+
projectChanged
140+
canSave={false}
141+
store={store}
142+
/>
143+
);
144+
const child = wrapper.find(Component);
145+
expect(child.props().projectChanged).toBeUndefined();
146+
expect(child.props().shouldSaveBeforeTransition()).toBe(false);
147+
});
148+
149+
test('Logged in user who is NOT owner and has NOT changed project should NOT save before transition', () => {
150+
const Component = () => (<div />);
151+
const WrappedComponent = MenuBarHOC(Component);
152+
const wrapper = mount(
153+
<WrappedComponent
154+
canSave={false}
155+
projectChanged={false}
156+
store={store}
157+
/>
158+
);
159+
const child = wrapper.find(Component);
160+
expect(child.props().projectChanged).toBeUndefined();
161+
expect(child.props().shouldSaveBeforeTransition()).toBe(false);
162+
});
163+
164+
});

0 commit comments

Comments
 (0)