add right click option to problem status checkbox

This commit is contained in:
Nathan Wang 2020-07-17 16:34:37 -07:00
parent 6d5c0c6b9e
commit 21610a6860
2 changed files with 25 additions and 11 deletions

View file

@ -3,7 +3,11 @@ import Tooltip from '../../Tooltip/Tooltip';
import { Problem } from '../../../../content/models';
import { useContext } from 'react';
import UserDataContext from '../../../context/UserDataContext';
import { NEXT_PROBLEM_STATUS, ProblemProgress } from '../../../models/problem';
import {
NEXT_PROBLEM_STATUS,
PREV_PROBLEM_STATUS,
ProblemProgress,
} from '../../../models/problem';
export default function ProblemStatusCheckbox({
problem,
@ -25,6 +29,10 @@ export default function ProblemStatusCheckbox({
const handleClick = () => {
setUserProgressOnProblems(problem, NEXT_PROBLEM_STATUS[status]);
};
const handleRightClick = e => {
e.preventDefault();
setUserProgressOnProblems(problem, PREV_PROBLEM_STATUS[status]);
};
return (
<Tooltip
content={status}
@ -32,7 +40,11 @@ export default function ProblemStatusCheckbox({
type="compact"
position="left"
>
<span onClick={handleClick} className="inline-block h-6 w-6">
<span
onClick={handleClick}
onContextMenu={handleRightClick}
className="inline-block h-6 w-6"
>
<span
className={
'inline-block h-6 w-6 rounded-full cursor-pointer transition duration-100 ease-out ' +

View file

@ -75,12 +75,14 @@ export type ProblemProgress =
| "Can't Solve"
| 'Skipped';
export const NEXT_PROBLEM_STATUS: {
[key in ProblemProgress]: ProblemProgress;
} = {
'Not Attempted': 'Solving',
Solving: 'Solved',
Solved: "Can't Solve",
"Can't Solve": 'Skipped',
Skipped: 'Not Attempted',
};
let options = ['Not Attempted', 'Solving', 'Solved', "Can't Solve", 'Skipped'];
let NEXT_PROBLEM_STATUS: { [key in ProblemProgress]?: ProblemProgress } = {};
let PREV_PROBLEM_STATUS: { [key in ProblemProgress]?: ProblemProgress } = {};
for (let i = 0; i < options.length; i++) {
NEXT_PROBLEM_STATUS[options[i]] = options[(i + 1) % options.length];
PREV_PROBLEM_STATUS[options[i]] =
options[(i - 1 + options.length) % options.length];
}
export { NEXT_PROBLEM_STATUS, PREV_PROBLEM_STATUS };