{wrapper.find(Alert).prop('action')}
);
+
+ expect(wrapper.text()).toContain('room is not currently joined');
+ expect(actions.find(Button)).toHaveLength(1);
+ expect(actions.find(Button).text()).toBe('Discard saved result');
+
+ actions.find(Button).simulate('click');
+ expect(onDiscard).toHaveBeenCalledTimes(1);
+ });
+
+ it('offers a return action when the user is somewhere else', () => {
+ const onReturn = jest.fn();
+ const wrapper = shallow(
+ {wrapper.find(Alert).prop('action')}
);
+
+ expect(actions.find(Button).map((button) => button.text())).toEqual([
+ 'Return to room',
+ 'Discard saved result',
+ ]);
+ actions.find(Button).at(0).simulate('click');
+ expect(onReturn).toHaveBeenCalledTimes(1);
+ });
+
+ it('does not offer discard after delivery has started', () => {
+ const wrapper = shallow(
+ {wrapper.find(Alert).prop('action')}
);
+
+ expect(actions.find(Button)).toHaveLength(1);
+ expect(actions.find(Button).text()).toBe('Return to room');
+ expect(wrapper.text()).toContain('finish submitting');
+ });
+});
diff --git a/client/src/components/Room/Common/Main.jsx b/client/src/components/Room/Common/Main.jsx
index 4a09c00..7cdadda 100644
--- a/client/src/components/Room/Common/Main.jsx
+++ b/client/src/components/Room/Common/Main.jsx
@@ -6,16 +6,26 @@ import Grid from '@material-ui/core/Grid';
import Paper from '@material-ui/core/Paper';
import Divider from '@material-ui/core/Divider';
import Typography from '@material-ui/core/Typography';
+import Button from '@material-ui/core/Button';
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
+import Alert from '@material-ui/lab/Alert';
import { Cube } from 'react-cube-svg';
import UIfx from 'uifx';
+import { push } from 'connected-react-router';
import notificationAsset from '../../../assets/notification.mp3';
import calcStats from '../../../lib/stats';
import {
submitResult,
+ discardPendingResult,
sendStatus,
timerFocused,
} from '../../../store/room/actions';
+import {
+ canDiscardPendingResult,
+ isPendingResult,
+ pendingResultBelongsToUser,
+ pendingResultMatches,
+} from '../../../store/room/resultOutbox';
import { StatsDialogProvider } from './StatsDialogProvider';
import { EditDialogProvider } from './EditDialogProvider';
import TimesTable from './TimesTable';
@@ -36,6 +46,9 @@ const useStyles = withStyles((theme) => ({
waitingForBox: {
padding: '.5em',
},
+ submissionAlert: {
+ borderRadius: 0,
+ },
scrambleBox: {
padding: '.5em',
textAlign: 'center',
@@ -45,12 +58,12 @@ const useStyles = withStyles((theme) => ({
},
}));
-class Main extends React.Component {
+export class Main extends React.Component {
constructor(props) {
super(props);
this.state = {
- currentAttemptId: undefined,
+ currentAttempt: undefined,
};
}
@@ -68,26 +81,27 @@ class Main extends React.Component {
onSubmitTime(event) {
const { dispatch, room, user } = this.props;
- const { currentAttemptId } = this.state;
+ const { currentAttempt } = this.state;
if (!room.attempts.length) {
return;
}
- // Don't even bother sending the result.
if (!user.id) {
return;
}
const latestAttempt = room.attempts ? room.attempts[room.attempts.length - 1] : {};
+ const submittedAttempt = currentAttempt || latestAttempt;
dispatch(submitResult({
- id: currentAttemptId || latestAttempt.id,
+ id: submittedAttempt.id,
+ attemptKey: submittedAttempt._id,
result: {
time: event.time,
penalties: event.penalties,
},
}));
- this.setState({ currentAttemptId: null });
+ this.setState({ currentAttempt: null });
}
onTimerFocused = () => {
@@ -108,28 +122,89 @@ class Main extends React.Component {
handlePriming() {
const { room } = this.props;
const latestAttempt = room.attempts ? room.attempts[room.attempts.length - 1] : {};
- this.setState({ currentAttemptId: latestAttempt.id });
+ this.setState({ currentAttempt: latestAttempt });
}
render() {
const {
- classes, dispatch, room, user, onlyShowSelf,
+ classes, dispatch, room, user, onlyShowSelf, roomConnected,
} = this.props;
const {
users, attempts, waitingFor,
} = room;
+ const resultSubmission = room.resultSubmission || {};
+ const pendingResult = resultSubmission.pendingResult;
+ const hasPendingResult = isPendingResult(pendingResult);
+ const canDiscardResult = canDiscardPendingResult(
+ pendingResult,
+ resultSubmission.status,
+ );
+ const pendingBelongsToUser = pendingResultBelongsToUser(pendingResult, user.id);
+ const pendingMatchesRoom = pendingResultMatches(pendingResult, {
+ userId: user.id,
+ roomId: room._id,
+ });
const latestAttempt = (attempts && attempts.length) ? attempts[attempts.length - 1] : {};
const timerDisabled = !room.timerFocused || !room.competing[user.id]
- || !room.waitingFor[user.id];
+ || !room.waitingFor[user.id] || hasPendingResult;
const hidden = room.competing[user.id] && !waitingFor[user.id];
+ let submissionMessage = '';
+ if (!pendingBelongsToUser) {
+ submissionMessage = canDiscardResult
+ ? 'A saved time for another account is stored on this device. Switch back to that account or discard it before timing another solve.'
+ : 'A saved time for another account may already be submitting. Switch back to that account to finish it.';
+ } else if (!pendingMatchesRoom) {
+ submissionMessage = canDiscardResult
+ ? `Your saved time belongs to room ${pendingResult.roomId}. Return there to submit it, or discard it before timing another solve.`
+ : `Your saved time belongs to room ${pendingResult.roomId}. Return there to finish submitting it.`;
+ } else if (resultSubmission.status === 'failed') {
+ submissionMessage = `Your saved time could not be submitted: ${resultSubmission.error.message}`;
+ } else if (resultSubmission.status === 'sending') {
+ submissionMessage = 'Submitting your saved time...';
+ } else if (roomConnected) {
+ submissionMessage = 'Your time is saved on this device and waiting to submit.';
+ } else {
+ submissionMessage = 'Your time is saved on this device. It will submit after the room reconnects.';
+ }
+
const stats = calcStats(attempts, users);
const showScramble = latestAttempt.scrambles && room.event === '333';
return (
@@ -231,12 +306,23 @@ Main.propTypes = {
waitingFor: PropTypes.shape(),
statuses: PropTypes.shape(),
attempts: PropTypes.arrayOf(PropTypes.shape({
+ _id: PropTypes.string,
id: PropTypes.number,
})),
admin: PropTypes.shape({
id: PropTypes.number,
}),
timerFocused: PropTypes.bool,
+ resultSubmission: PropTypes.shape({
+ status: PropTypes.oneOf(['idle', 'pending', 'sending', 'failed']),
+ pendingResult: PropTypes.shape({
+ deliveryAttempted: PropTypes.bool,
+ submissionId: PropTypes.string,
+ }),
+ error: PropTypes.shape({
+ message: PropTypes.string,
+ }),
+ }),
}),
user: PropTypes.shape({
id: PropTypes.number,
@@ -247,6 +333,7 @@ Main.propTypes = {
dispatch: PropTypes.func.isRequired,
classes: PropTypes.shape().isRequired,
onlyShowSelf: PropTypes.bool,
+ roomConnected: PropTypes.bool,
};
Main.defaultProps = {
@@ -264,6 +351,11 @@ Main.defaultProps = {
id: undefined,
},
timerFocused: true,
+ resultSubmission: {
+ status: 'idle',
+ pendingResult: null,
+ error: null,
+ },
},
user: {
id: undefined,
@@ -272,10 +364,12 @@ Main.defaultProps = {
timerType: 'spacebar',
},
onlyShowSelf: false,
+ roomConnected: false,
};
const mapStateToProps = (state) => ({
room: state.room,
+ roomConnected: state.roomList.connected,
user: state.user,
});
diff --git a/client/src/components/Room/Common/Main.test.jsx b/client/src/components/Room/Common/Main.test.jsx
new file mode 100644
index 0000000..4f28d8b
--- /dev/null
+++ b/client/src/components/Room/Common/Main.test.jsx
@@ -0,0 +1,180 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import Alert from '@material-ui/lab/Alert';
+import Button from '@material-ui/core/Button';
+import Timer from '../../Timer/index';
+import { Main } from './Main';
+import {
+ createPendingResult,
+ markPendingResultAttempted,
+} from '../../../store/room/resultOutbox';
+import {
+ DISCARD_PENDING_RESULT,
+ SUBMIT_RESULT,
+} from '../../../store/room/actions';
+
+jest.mock('../../Timer/StackmatTimer', () => () => null);
+jest.mock('react-cube-svg', () => ({ Cube: () => null }));
+
+const pendingResult = createPendingResult({
+ userId: 42,
+ roomId: 'original-room',
+ attemptId: 7,
+ attemptKey: 'attempt-seven',
+ result: { time: 1234, penalties: {} },
+}, {
+ createId: () => 'submission-one',
+ now: () => 1000,
+});
+
+const makeProps = (overrides = {}) => ({
+ classes: {
+ root: 'root',
+ submissionAlert: 'submissionAlert',
+ scrambleBox: 'scrambleBox',
+ waitingForBox: 'waitingForBox',
+ },
+ dispatch: jest.fn(),
+ onlyShowSelf: false,
+ roomConnected: true,
+ user: {
+ id: 42,
+ useInspection: false,
+ muteTimer: true,
+ timerType: 'spacebar',
+ },
+ room: {
+ _id: 'current-room',
+ event: '333',
+ users: [{ id: 42 }],
+ competing: { 42: true },
+ waitingFor: { 42: true },
+ attempts: [{ _id: 'attempt-eight', id: 8, scrambles: ['R U'], results: {} }],
+ timerFocused: true,
+ resultSubmission: {
+ status: 'pending',
+ pendingResult,
+ error: null,
+ },
+ },
+ ...overrides,
+});
+
+describe('room pending result UX', () => {
+ it('submits against the immutable attempt that was primed', () => {
+ const props = makeProps({
+ room: {
+ ...makeProps().room,
+ attempts: [{
+ _id: 'primed-attempt', id: 0, scrambles: ['R U'], results: {},
+ }],
+ resultSubmission: {
+ status: 'idle',
+ pendingResult: null,
+ error: null,
+ },
+ },
+ });
+ const wrapper = shallow();
+ wrapper.instance().handlePriming();
+ wrapper.setProps({
+ room: {
+ ...props.room,
+ attempts: [{
+ _id: 'replacement-attempt', id: 0, scrambles: ['F R'], results: {},
+ }],
+ },
+ });
+
+ wrapper.instance().onSubmitTime({ time: 1234, penalties: {} });
+
+ expect(props.dispatch).toHaveBeenCalledWith({
+ type: SUBMIT_RESULT,
+ result: {
+ id: 0,
+ attemptKey: 'primed-attempt',
+ result: { time: 1234, penalties: {} },
+ },
+ });
+ });
+
+ it('does not disable the timer merely because the room socket disconnected', () => {
+ const props = makeProps({
+ roomConnected: false,
+ room: {
+ ...makeProps().room,
+ resultSubmission: {
+ status: 'idle',
+ pendingResult: null,
+ error: null,
+ },
+ },
+ });
+ const wrapper = shallow();
+
+ expect(wrapper.find(Timer).prop('disabled')).toBe(false);
+ expect(wrapper.find(Alert)).toHaveLength(0);
+ });
+
+ it('blocks another solve and offers return/discard actions outside the original room', () => {
+ const props = makeProps();
+ const wrapper = shallow();
+ const actions = shallow(
{wrapper.find(Alert).prop('action')}
);
+
+ expect(wrapper.find(Timer).prop('disabled')).toBe(true);
+ expect(wrapper.find(Alert).text()).toContain('Your saved time belongs to room original-room.');
+ expect(actions.find(Button).map((button) => button.text())).toEqual([
+ 'Return to room',
+ 'Discard saved result',
+ ]);
+
+ actions.find(Button).at(1).simulate('click');
+ expect(props.dispatch).toHaveBeenCalledWith({
+ type: DISCARD_PENDING_RESULT,
+ submissionId: 'submission-one',
+ });
+ });
+
+ it('also blocks a solve when the device outbox belongs to another account', () => {
+ const anotherUsersResult = {
+ ...pendingResult,
+ userId: 99,
+ };
+ const props = makeProps({
+ room: {
+ ...makeProps().room,
+ resultSubmission: {
+ status: 'pending',
+ pendingResult: anotherUsersResult,
+ error: null,
+ },
+ },
+ });
+ const wrapper = shallow();
+ const actions = shallow({wrapper.find(Alert).prop('action')}
);
+
+ expect(wrapper.find(Timer).prop('disabled')).toBe(true);
+ expect(wrapper.find(Alert).text()).toContain('another account');
+ expect(actions.find(Button)).toHaveLength(1);
+ expect(actions.find(Button).text()).toBe('Discard saved result');
+ });
+
+ it('keeps an attempted result without offering discard', () => {
+ const props = makeProps({
+ room: {
+ ...makeProps().room,
+ resultSubmission: {
+ status: 'pending',
+ pendingResult: markPendingResultAttempted(pendingResult),
+ error: null,
+ },
+ },
+ });
+ const wrapper = shallow();
+ const actions = shallow({wrapper.find(Alert).prop('action')}
);
+
+ expect(actions.find(Button)).toHaveLength(1);
+ expect(actions.find(Button).text()).toBe('Return to room');
+ expect(wrapper.find(Alert).text()).toContain('finish submitting');
+ });
+});
diff --git a/client/src/components/Room/GrandPrix/GrandPrixMain.jsx b/client/src/components/Room/GrandPrix/GrandPrixMain.jsx
index 7bc2331..1a656ac 100644
--- a/client/src/components/Room/GrandPrix/GrandPrixMain.jsx
+++ b/client/src/components/Room/GrandPrix/GrandPrixMain.jsx
@@ -19,6 +19,7 @@ import {
toggleFollowUser,
} from '../../../store/room/actions';
import { getRegisteredUsers } from '../../../store/room/selectors';
+import { isPendingResult } from '../../../store/room/resultOutbox';
import { StatsDialogProvider } from '../Common/StatsDialogProvider';
import { EditDialogProvider } from '../Common/EditDialogProvider';
import TimesTable from '../Common/TimesTable';
@@ -184,7 +185,7 @@ function Main({ room, user }) {
const classes = useStyles();
const dispatch = useDispatch();
const theme = useTheme();
- const [currentAttemptId, setCurrentAttemptId] = useState(undefined);
+ const [currentAttempt, setCurrentAttempt] = useState(undefined);
const [followUserDialogOpen, setFollowUserDialogOpen] = useState(false);
const {
@@ -204,14 +205,16 @@ function Main({ room, user }) {
}
const latestAttempt = room.attempts ? room.attempts[room.attempts.length - 1] : {};
+ const submittedAttempt = currentAttempt || latestAttempt;
dispatch(submitResult({
- id: currentAttemptId || latestAttempt.id,
+ id: submittedAttempt.id,
+ attemptKey: submittedAttempt._id,
result: {
time: event.time,
penalties: event.penalties,
},
}));
- setCurrentAttemptId(null);
+ setCurrentAttempt(null);
};
const onTimerFocused = () => {
@@ -228,7 +231,7 @@ function Main({ room, user }) {
const handlePriming = () => {
const latestAttempt = room.attempts ? room.attempts[room.attempts.length - 1] : {};
- setCurrentAttemptId(latestAttempt.id);
+ setCurrentAttempt(latestAttempt);
};
const handleToggleUserFollow = (userId) => {
@@ -237,7 +240,8 @@ function Main({ room, user }) {
const latestAttempt = attempts && attempts.length && attempts[attempts.length - 1];
const showScrambleBox = latestAttempt && !latestAttempt.results[user.id];
- const timerDisabled = !room.timerFocused || !room.competing[user.id] || !showScrambleBox;
+ const timerDisabled = !room.timerFocused || !room.competing[user.id] || !showScrambleBox
+ || isPendingResult(room.resultSubmission && room.resultSubmission.pendingResult);
const stats = calcStats(attempts, users);
const showScramble = latestAttempt.scrambles && room.event === '333';
@@ -369,8 +373,14 @@ Main.propTypes = {
statuses: PropTypes.shape(),
registered: PropTypes.shape(),
attempts: PropTypes.arrayOf(PropTypes.shape({
+ _id: PropTypes.string,
id: PropTypes.number,
})),
+ resultSubmission: PropTypes.shape({
+ pendingResult: PropTypes.shape({
+ submissionId: PropTypes.string,
+ }),
+ }),
admin: PropTypes.shape({
id: PropTypes.number,
}),
@@ -399,6 +409,9 @@ Main.defaultProps = {
statues: {},
registered: {},
attempts: [],
+ resultSubmission: {
+ pendingResult: null,
+ },
admin: {
id: undefined,
},
diff --git a/client/src/components/Timer/ManualTimer.jsx b/client/src/components/Timer/ManualTimer.jsx
index f9cef7a..4b69a6d 100644
--- a/client/src/components/Timer/ManualTimer.jsx
+++ b/client/src/components/Timer/ManualTimer.jsx
@@ -60,7 +60,7 @@ const STATUS = {
const STATUSES = [STATUS.RESTING, STATUS.INSPECTING, STATUS.TIMING, STATUS.SUBMITTING];
-class ManualTimer extends React.Component {
+export class ManualTimer extends React.Component {
constructor(props) {
super(props);
@@ -194,10 +194,15 @@ class ManualTimer extends React.Component {
const { onSubmitTime } = this.props;
const { penalties } = this.state;
+ const time = this.finalTime();
+
+ if (!Number.isFinite(time)) {
+ return;
+ }
if (onSubmitTime) {
onSubmitTime({
- time: this.finalTime(),
+ time,
penalties: {
DNF: penalties.DNF,
inspection: penalties.inspection,
diff --git a/client/src/components/Timer/ManualTimer.test.jsx b/client/src/components/Timer/ManualTimer.test.jsx
new file mode 100644
index 0000000..a149cb2
--- /dev/null
+++ b/client/src/components/Timer/ManualTimer.test.jsx
@@ -0,0 +1,47 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import { ManualTimer } from './ManualTimer';
+
+const makeProps = () => ({
+ classes: {
+ root: 'root',
+ input: 'input',
+ inputProps: 'inputProps',
+ penaltyBox: 'penaltyBox',
+ },
+ onPriming: jest.fn(),
+ onStatusChange: jest.fn(),
+ onSubmitTime: jest.fn(),
+ useInspection: false,
+});
+
+describe('manual timer submission', () => {
+ it.each(['', 'not-a-time'])('keeps invalid input for correction: %p', (timeInput) => {
+ const props = makeProps();
+ const wrapper = shallow(