+
@@ -47,14 +52,18 @@ SelectTypeFooter.defaultProps = {
SelectTypeFooter.propTypes = {
onCancel: PropTypes.func.isRequired,
selected: PropTypes.string,
- onSelect: PropTypes.func.isRequired,
+ setProblemType: PropTypes.func.isRequired,
+ updateField: PropTypes.func.isRequired,
+ // injected
+ intl: intlShape.isRequired,
};
export const mapStateToProps = () => ({
});
export const mapDispatchToProps = {
- initializeEditor: actions.problem.onSelect,
+ setProblemType: actions.problem.setProblemType,
+ updateField: actions.problem.updateField,
};
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SelectTypeFooter));
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/SelectTypeFooter.test.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/SelectTypeFooter.test.jsx
new file mode 100644
index 000000000..9d22bbf52
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/SelectTypeFooter.test.jsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { Button } from '@edx/paragon';
+import { formatMessage } from '../../../../../../testUtils';
+import * as module from './SelectTypeFooter';
+import hooks from '../hooks';
+import { actions } from '../../../../../data/redux';
+
+jest.mock('../hooks', () => ({
+ onSelect: jest.fn().mockName('onSelect'),
+}));
+
+describe('SelectTypeFooter', () => {
+ const props = {
+ onCancel: jest.fn().mockName('onCancel'),
+ selected: null,
+ // redux
+ setProblemType: jest.fn().mockName('setProblemType'),
+ // inject
+ intl: { formatMessage },
+ };
+
+ test('snapshot', () => {
+ expect(shallow(
+ {children}
+
({
+ handleCancelClicked: jest.fn().mockName('handleCancelClicked'),
+}));
+
+describe('SelectTypeWrapper', () => {
+ const props = {
+ children: (
+
+
+
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.jsx
new file mode 100644
index 000000000..2ecfa2568
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.jsx
@@ -0,0 +1,92 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import {
+ Form,
+ ActionRow,
+ IconButton,
+ Icon,
+ OverlayTrigger,
+ Tooltip,
+} from '@edx/paragon';
+import { ArrowBack } from '@edx/paragon/icons';
+import { FormattedMessage, injectIntl, intlShape } from '@edx/frontend-platform/i18n';
+import { AdvanceProblems, ProblemTypeKeys } from '../../../../../data/constants/problem';
+import messages from './messages';
+
+export const AdvanceTypeSelect = ({
+ selected,
+ setSelected,
+ // injected
+ intl,
+}) => {
+ const handleChange = e => { setSelected(e.target.value); };
+ return (
+
+
-
+
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/__snapshots__/index.test.jsx.snap b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/__snapshots__/index.test.jsx.snap
new file mode 100644
index 000000000..d88ab2baf
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/__snapshots__/index.test.jsx.snap
@@ -0,0 +1,29 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SelectTypeWrapper snapshot 1`] = `
+
+
+
+
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/index.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/index.jsx
index 4e2b23aa1..b8c63786d 100644
--- a/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/index.jsx
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/SelectTypeWrapper/index.jsx
@@ -8,9 +8,9 @@ import SelectTypeFooter from './SelectTypeFooter';
import * as hooks from '../../../../EditorContainer/hooks';
export const SelectTypeWrapper = ({
- selected,
- onClose,
children,
+ onClose,
+ selected,
}) => {
const handleCancelClicked = hooks.handleCancelClicked({ onClose });
@@ -28,7 +28,9 @@ export const SelectTypeWrapper = ({
+ Select Problem type +
+
+
+ + test child +
+test child
), + onClose: jest.fn(), + selected: 'iMAsElecTedValUE', + }; + + test('snapshot', () => { + expect(shallow(
+
+
+ setSelected(ProblemTypeKeys.SINGLESELECT)} />
+
+
+
+
+ {Object.entries(AdvanceProblems).map(([type, data]) => {
+ if (data.status !== '') {
+ return (
+
+
+ {intl.formatMessage(messages.advanceProblemTypeLabel, { problemType: data.title })}
+
+
+
+
+ );
+ }
+ return (
+
+
+ {intl.formatMessage(messages.advanceProblemTypeLabel, { problemType: data.title })}
+
+
+ );
+ })}
+
+
+
+ );
+};
+
+AdvanceTypeSelect.defaultProps = {
+ selected: null,
+};
+
+AdvanceTypeSelect.propTypes = {
+ selected: PropTypes.string,
+ setSelected: PropTypes.func.isRequired,
+ // injected
+ intl: intlShape.isRequired,
+};
+
+export default injectIntl(AdvanceTypeSelect);
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.test.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.test.jsx
new file mode 100644
index 000000000..d4152a42e
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/AdvanceTypeSelect.test.jsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { formatMessage } from '../../../../../../testUtils';
+import * as module from './AdvanceTypeSelect';
+
+describe('AdvanceTypeSelect', () => {
+ const props = {
+ intl: { formatMessage },
+ selected: 'blankadvanced',
+ setSelected: jest.fn().mockName('setSelect'),
+ };
+ describe('snapshots', () => {
+ test('snapshots: renders as expected with default props', () => {
+ expect(
+ shallow(
+ {intl.formatMessage(messages.supportStatusTooltipMessage, { supportStatus: data.status.replace(' ', '_') })}
+
+
+ )}
+ >
+
+ {intl.formatMessage(messages.problemSupportStatus, { supportStatus: data.status })}
+
+
-
+
-
-
+
- {data.title}
+
+
-
+
- {ProblemTypes.SINGLESELECT.title}
- {ProblemTypes.MULTISELECT.title}
- {ProblemTypes.DROPDOWN.title}
- {ProblemTypes.NUMERIC.title}
- {ProblemTypes.TEXTINPUT.title}
-
-
+ {Object.values(ProblemTypeKeys).map((key) => (
+ key !== 'advanced'
+ ? (
+
+ {ProblemTypes[key].title}
+
+ )
+ : null
+ ))}
+
+
+
);
};
ProblemTypeSelect.propTypes = {
+ selected: PropTypes.string.isRequired,
setSelected: PropTypes.func.isRequired,
};
-export default ProblemTypeSelect;
+export default injectIntl(ProblemTypeSelect);
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/ProblemTypeSelect.test.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/ProblemTypeSelect.test.jsx
new file mode 100644
index 000000000..1cea66e9f
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/ProblemTypeSelect.test.jsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import { ProblemTypeKeys } from '../../../../../data/constants/problem';
+import * as module from './ProblemTypeSelect';
+
+describe('ProblemTypeSelect', () => {
+ const props = {
+ selected: null,
+ setSelected: jest.fn(),
+ };
+
+ describe('snapshot', () => {
+ test('SINGLESELECT', () => {
+ expect(shallow(
+
+
+
+ Single Select Problem
+
+
+ Multi Select Problem
+
+
+ Dropdown Problem
+
+
+ Numeric Response Problem
+
+
+ Text Input Problem
+
+
+
+
+`;
+
+exports[`ProblemTypeSelect snapshot MULTISELECT 1`] = `
+
+
+
+ Single Select Problem
+
+
+ Multi Select Problem
+
+
+ Dropdown Problem
+
+
+ Numeric Response Problem
+
+
+ Text Input Problem
+
+
+
+
+`;
+
+exports[`ProblemTypeSelect snapshot NUMERIC 1`] = `
+
+
+
+ Single Select Problem
+
+
+ Multi Select Problem
+
+
+ Dropdown Problem
+
+
+ Numeric Response Problem
+
+
+ Text Input Problem
+
+
+
+
+`;
+
+exports[`ProblemTypeSelect snapshot SINGLESELECT 1`] = `
+
+
+
+ Single Select Problem
+
+
+ Multi Select Problem
+
+
+ Dropdown Problem
+
+
+ Numeric Response Problem
+
+
+ Text Input Problem
+
+
+
+
+`;
+
+exports[`ProblemTypeSelect snapshot TEXTINPUT 1`] = `
+
+
+
+ Single Select Problem
+
+
+ Multi Select Problem
+
+
+ Dropdown Problem
+
+
+ Numeric Response Problem
+
+
+ Text Input Problem
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/messages.js b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/messages.js
new file mode 100644
index 000000000..dae097bb7
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/messages.js
@@ -0,0 +1,69 @@
+export const messages = {
+ advanceProblemButtonLabel: {
+ id: 'authoring.problemEditor.problemSelect.advanceButton.label',
+ defaultMessage: 'Advance problem types',
+ description: 'Button label for advance problem types option',
+ },
+ advanceMenuTitle: {
+ id: 'authoring.problemEditor.advanceProblem.menu.title',
+ defaultMessage: 'Advanced problems',
+ description: 'Title for advanced problem menu',
+ },
+ advanceProblemTypeLabel: {
+ id: 'authoring.problemEditor.advanceProblem.problemType.label',
+ defaultMessage: '{problemType}',
+ description: 'Label for advance problem type radio select',
+ },
+ problemSupportStatus: {
+ id: 'authoring.problemEditor.advanceProblem.supportStatus',
+ defaultMessage: '{supportStatus}',
+ description: 'Text for advance problem type\'s support status',
+ },
+ supportStatusTooltipMessage: {
+ id: 'authoring.problemEditor.advanceProblem.supportStatus.tooltipMessage',
+ defaultMessage: `{supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+ \n \n
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }`,
+ description: 'Message for support status tooltip',
+ },
+ previewTitle: {
+ id: 'authoring.problemEditor.preview.title',
+ defaultMessage: '{previewTitle}',
+ description: 'Title for the problem preview column',
+ },
+ previewAltText: {
+ id: 'authoring.problemEditor.preview.altText',
+ defaultMessage: `A preview illustration of a {problemType, select,
+ multiplechoiceresponse {single select}
+ stringreponse {text input}
+ numericalresponse {numerical input}
+ optionresponse {dropdown}
+ choiceresponse {multiple select}
+ other {null}
+ } problem`,
+ description: 'Alt text for the illustration of the problem preview',
+ },
+ previewDescription: {
+ id: 'authoring.problemEditor.preview.description',
+ defaultMessage: '{previewDescription}',
+ description: 'Description of the selected problem type',
+ },
+ learnMoreButtonLabel: {
+ id: 'authoring.problemEditor.learnMoreButtonLabel.label',
+ defaultMessage: 'Learn More',
+ description: 'Label for Learn More button',
+ },
+};
+
+export default messages;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.js b/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.js
index 42d65c681..f1dace285 100644
--- a/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.js
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.js
@@ -1,10 +1,59 @@
+import { useEffect, useState } from 'react';
import {
- useState,
-} from 'react';
+ AdvanceProblemKeys, AdvanceProblems, ProblemTypeKeys, ProblemTypes,
+} from '../../../../data/constants/problem';
import { StrictDict } from '../../../../utils';
+import * as module from './hooks';
export const state = StrictDict({
selected: (val) => useState(val),
});
-export default { state };
+export const selectHooks = () => {
+ const [selected, setSelected] = module.state.selected(ProblemTypeKeys.SINGLESELECT);
+ return {
+ selected,
+ setSelected,
+ };
+};
+
+export const onSelect = (setProblemType, selected, updateField) => () => {
+ if (Object.values(AdvanceProblemKeys).includes(selected)) {
+ updateField({ rawOLX: AdvanceProblems[selected].template });
+ }
+ setProblemType({ selected });
+};
+
+export const useArrowNav = (selected, setSelected) => {
+ const detectKeyDown = (e) => {
+ const problemTypeValues = Object.values(ProblemTypeKeys);
+ switch (e.key) {
+ case 'ArrowUp':
+ if (problemTypeValues.includes(selected) && ProblemTypes[selected].prev) {
+ setSelected(ProblemTypes[selected].prev);
+ document.getElementById(ProblemTypes[selected].prev).focus();
+ }
+ break;
+ case 'ArrowDown':
+ if (problemTypeValues.includes(selected) && ProblemTypes[selected].next) {
+ setSelected(ProblemTypes[selected].next);
+ document.getElementById(ProblemTypes[selected].next).focus();
+ }
+ break;
+ default:
+ }
+ };
+ useEffect(() => {
+ document.addEventListener('keydown', detectKeyDown, true);
+ return () => {
+ document.removeEventListener('keydown', detectKeyDown, true);
+ };
+ }, [selected, setSelected]);
+};
+
+export default {
+ state,
+ selectHooks,
+ onSelect,
+ useArrowNav,
+};
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.test.js b/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.test.js
new file mode 100644
index 000000000..50829221e
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/hooks.test.js
@@ -0,0 +1,168 @@
+/* eslint-disable prefer-destructuring */
+import React from 'react';
+import { MockUseState } from '../../../../../testUtils';
+import * as module from './hooks';
+import { AdvanceProblems, ProblemTypeKeys } from '../../../../data/constants/problem';
+
+jest.mock('react', () => ({
+ ...jest.requireActual('react'),
+ useState: (val) => ({ useState: val }),
+ useEffect: jest.fn(),
+}));
+
+const state = new MockUseState(module);
+const mockSetProblemType = jest.fn().mockName('setProblemType');
+const mockUpdateField = jest.fn().mockName('updateField');
+const mockSelected = 'vAl';
+const mockAdvancedSelected = 'blankadvanced';
+const mockSetSelected = jest.fn().mockName('setSelected');
+
+let hook;
+
+describe('SelectTypeModal hooks', () => {
+ beforeEach(() => {
+ state.mock();
+ });
+ afterEach(() => {
+ state.restore();
+ jest.clearAllMocks();
+ });
+
+ describe('selectHooks', () => {
+ beforeEach(() => {
+ hook = module.selectHooks();
+ });
+ test('selected defaults to SINGLESELECT', () => {
+ expect(hook.selected).toEqual(ProblemTypeKeys.SINGLESELECT);
+ });
+ test('setSelected sets state as expected', () => {
+ const expectedArg = 'neWvAl';
+ state.mockVal(state.keys.selected, 'mOcKvAl');
+ hook.setSelected(expectedArg);
+ expect(state.setState.selected).toHaveBeenCalledWith(expectedArg);
+ });
+ });
+
+ describe('onSelect', () => {
+ test('updateField is called with selected templated if selected is an Advanced Problem', () => {
+ module.onSelect(mockSetProblemType, mockAdvancedSelected, mockUpdateField)();
+ expect(mockUpdateField).toHaveBeenCalledWith({
+ rawOLX: AdvanceProblems[mockAdvancedSelected].template,
+ });
+ });
+ test('setProblemType is called with selected', () => {
+ module.onSelect(mockSetProblemType, mockSelected, mockUpdateField)();
+ expect(mockSetProblemType).toHaveBeenCalledWith({ selected: mockSelected });
+ });
+ });
+
+ describe('useArrowNav', () => {
+ document.body.innerHTML = `
+
+
+
+
+
+ `;
+ const mockKeyUp = new KeyboardEvent('keydown', { key: 'ArrowUp' });
+ const mockKeyDown = new KeyboardEvent('keydown', { key: 'ArrowDown' });
+ let cb;
+ let prereqs;
+
+ describe('SINGLESELECT', () => {
+ beforeEach(() => {
+ module.useArrowNav(ProblemTypeKeys.SINGLESELECT, mockSetSelected);
+ [cb, prereqs] = React.useEffect.mock.calls[0];
+ cb();
+ });
+ test('pressing up arrow sets MULTISELECT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.SINGLESELECT, mockSetSelected]);
+ document.dispatchEvent(mockKeyUp);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.TEXTINPUT);
+ });
+ test('pressing down arrow sets MULTISELECT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.SINGLESELECT, mockSetSelected]);
+ document.dispatchEvent(mockKeyDown);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.MULTISELECT);
+ });
+ });
+ describe('MULTISELECT', () => {
+ beforeEach(() => {
+ module.useArrowNav(ProblemTypeKeys.MULTISELECT, mockSetSelected);
+ [cb, prereqs] = React.useEffect.mock.calls[0];
+ cb();
+ });
+ test('pressing up arrow sets SINGLESELECT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.MULTISELECT, mockSetSelected]);
+ document.dispatchEvent(mockKeyUp);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.SINGLESELECT);
+ });
+ test('pressing down arrow sets DROPDOWN', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.MULTISELECT, mockSetSelected]);
+ document.dispatchEvent(mockKeyDown);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.DROPDOWN);
+ });
+ });
+ describe('DROPDOWN', () => {
+ beforeEach(() => {
+ module.useArrowNav(ProblemTypeKeys.DROPDOWN, mockSetSelected);
+ [cb, prereqs] = React.useEffect.mock.calls[0];
+ cb();
+ });
+ test('pressing up arrow sets MULTISELECT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.DROPDOWN, mockSetSelected]);
+ document.dispatchEvent(mockKeyUp);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.MULTISELECT);
+ });
+ test('pressing down arrow sets NUMERIC', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.DROPDOWN, mockSetSelected]);
+ document.dispatchEvent(mockKeyDown);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.NUMERIC);
+ });
+ });
+ describe('NUMERIC', () => {
+ beforeEach(() => {
+ module.useArrowNav(ProblemTypeKeys.NUMERIC, mockSetSelected);
+ [cb, prereqs] = React.useEffect.mock.calls[0];
+ cb();
+ });
+ test('pressing up arrow sets DROPDOWN', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.NUMERIC, mockSetSelected]);
+ document.dispatchEvent(mockKeyUp);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.DROPDOWN);
+ });
+ test('pressing down arrow sets TEXTINPUT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.NUMERIC, mockSetSelected]);
+ document.dispatchEvent(mockKeyDown);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.TEXTINPUT);
+ });
+ });
+ describe('TEXTINPUT', () => {
+ beforeEach(() => {
+ module.useArrowNav(ProblemTypeKeys.TEXTINPUT, mockSetSelected);
+ [cb, prereqs] = React.useEffect.mock.calls[0];
+ cb();
+ });
+ test('pressing up arrow sets NUMERIC', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.TEXTINPUT, mockSetSelected]);
+ document.dispatchEvent(mockKeyUp);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.NUMERIC);
+ });
+ test('pressing down arrow sets SINGLESELECT', () => {
+ expect(React.useEffect.mock.calls.length).toEqual(1);
+ expect(prereqs).toStrictEqual([ProblemTypeKeys.TEXTINPUT, mockSetSelected]);
+ document.dispatchEvent(mockKeyDown);
+ expect(mockSetSelected).toHaveBeenCalledWith(ProblemTypeKeys.SINGLESELECT);
+ });
+ });
+ });
+});
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.jsx
index 6d12dbad2..49d2ca7b7 100644
--- a/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.jsx
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.jsx
@@ -1,23 +1,40 @@
import React from 'react';
+import PropTypes from 'prop-types';
+import { Col, Row } from '@edx/paragon';
import ProblemTypeSelect from './content/ProblemTypeSelect';
import Preview from './content/Preview';
+import AdvanceTypeSelect from './content/AdvanceTypeSelect';
import SelectTypeWrapper from './SelectTypeWrapper';
-import * as hooks from './hooks';
+import hooks from './hooks';
+import { AdvanceProblemKeys } from '../../../../data/constants/problem';
-export const SelectTypeModal = () => {
- const { selected, setSelected } = hooks.state.selected(null);
+export const SelectTypeModal = ({
+ onClose,
+}) => {
+ const { selected, setSelected } = hooks.selectHooks();
+ hooks.useArrowNav(selected, setSelected);
return (
-
+
+ {(!Object.values(AdvanceProblemKeys).includes(selected)) ? (
+ <>
+
+
);
};
+SelectTypeModal.propTypes = {
+ onClose: PropTypes.func.isRequired,
+};
+
export default SelectTypeModal;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.test.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.test.jsx
new file mode 100644
index 000000000..05ab1522d
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/index.test.jsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import * as module from '.';
+
+jest.mock('./hooks', () => ({
+ selectHooks: jest.fn(() => ({
+ selected: 'mOcKsELEcted',
+ setSelected: jest.fn().mockName('setSelected'),
+ })),
+ useArrowNav: jest.fn().mockName('useArrowNav'),
+}));
+
+describe('SelectTypeModal', () => {
+ const props = {
+ onClose: jest.fn(),
+ };
+
+ test('snapshot', () => {
+ expect(shallow(
-
+ {intl.formatMessage(messages.previewTitle, { previewTitle: data.title })}
-
- {data.preview}
-
-
-
- {data.description}
-
-
+
);
};
@@ -30,8 +45,11 @@ const Preview = ({
Preview.defaultProps = {
problemType: null,
};
+
Preview.propTypes = {
problemType: PropTypes.string,
+ // injected
+ intl: intlShape.isRequired,
};
-export default Preview;
+export default injectIntl(Preview);
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/Preview.test.jsx b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/Preview.test.jsx
new file mode 100644
index 000000000..74ad5d203
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/Preview.test.jsx
@@ -0,0 +1,44 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { formatMessage } from '../../../../../../testUtils';
+import * as module from './Preview';
+
+describe('Preview', () => {
+ const props = {
+ intl: { formatMessage },
+ problemType: null,
+ };
+ describe('snapshots', () => {
+ test('snapshots: renders as expected with default props', () => {
+ expect(
+ shallow({data.helpLink}
+
+ {intl.formatMessage(messages.previewDescription, { previewDescription: data.description })}
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is circuitschematic 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is customgrader 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is drag_and_drop 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is formularesponse 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is imageresponse 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is jsinput_response 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
+
+exports[`AdvanceTypeSelect snapshots snapshots: renders as expected with problemType is problem_with_hint 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+
+
+
+
+
+ Blank advance problem
+
+
+
+
+ Circuit schematic builder
+
+
+
+
+
+
+ Custom JavaScript display and grading
+
+
+
+
+ Custom Python-evaluated input
+
+
+
+
+
+
+ Drag and drop (deprecated version)
+
+
+
+
+
+
+ Image mapped input
+
+
+
+
+
+
+ Math expression input
+
+
+
+
+ Problem with adaptive hint
+
+
+
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/Preview.test.jsx.snap b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/Preview.test.jsx.snap
new file mode 100644
index 000000000..8dd2e23bf
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/Preview.test.jsx.snap
@@ -0,0 +1,203 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Preview snapshots snapshots: renders as expected with default props 1`] = `""`;
+
+exports[`Preview snapshots snapshots: renders as expected with problemType is choiceresponse 1`] = `
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Provisional
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+ {supportStatus, select,
+ Provisional {Provisionally supported tools might lack the robustness of functionality
+ that your courses require. edX does not have control over the quality of the software,
+ or of the content that can be provided using these tools.
+
+
+
+ Test these tools thoroughly before using them in your course, especially in graded
+ sections. Complete documentstion might not be available for provisionally supported
+ tools, or documentation might be available from sources other than edX.}
+ Not_supported {Tools with no support are not maintained by edX, and might be deprecated
+ in the future. They are not recommened for use in courses due to non-compliance with one
+ or more of the base requirements, such as testing, accessibility, internationalization,
+ and documentation.}
+ other { }
+ }
+
+
+ }
+ placement="right"
+ >
+
+ Not supported
+
+
+
+
+
+`;
+
+exports[`Preview snapshots snapshots: renders as expected with problemType is multiplechoiceresponse 1`] = `
+
+ Multi Select Problem
+
+
+ Specify one or more correct answers from a list of possible options.
+
+
+
+
+
+`;
+
+exports[`Preview snapshots snapshots: renders as expected with problemType is numericalresponse 1`] = `
+
+ Single Select Problem
+
+
+ Specify one correct answer from a list of possible options
+
+
+
+
+
+`;
+
+exports[`Preview snapshots snapshots: renders as expected with problemType is optionresponse 1`] = `
+
+ Numeric Response Problem
+
+
+ Specify one or more correct numeric answers, submitted in a response field.
+
+
+
+
+
+`;
+
+exports[`Preview snapshots snapshots: renders as expected with problemType is stringresponse 1`] = `
+
+ Dropdown Problem
+
+
+ Specify one correct answer from a list of possible options, selected in a dropdown menu.
+
+
+
+
+
+`;
diff --git a/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/ProblemTypeSelect.test.jsx.snap b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/ProblemTypeSelect.test.jsx.snap
new file mode 100644
index 000000000..bf2f8389e
--- /dev/null
+++ b/src/editors/containers/ProblemEditor/components/SelectTypeModal/content/__snapshots__/ProblemTypeSelect.test.jsx.snap
@@ -0,0 +1,316 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ProblemTypeSelect snapshot DROPDOWN 1`] = `
+
+ Text Input Problem
+
+
+ Specify one or more correct text answers, including numbers and special characters, submitted in a response field.
+
+
-
-
-
+ + Circuit schematic problems allow students to create virtual circuits by + arranging elements such as voltage sources, capacitors, resistors, and + MOSFETs on an interactive grid. The system evaluates a DC, AC, or + transient analysis of the circuit. +
++ For more information, see + + Circuit Schematic Builder Problem in Building and Running an edX Course. +
++ When you add the problem, be sure to select Settings + to specify a Display Name and other values that apply. +
+You can use the following example problems as models.
+ +Make a voltage divider that splits the provided voltage evenly.
+
+
+ Explanation
++ You can form a voltage divider that evenly divides the input + voltage with two identically valued resistors, with the sampled + voltage taken in between the two. +
+
Make a high-pass filter.
+
+
+ Explanation
++ You can form a simple high-pass filter without any further + constraints by simply putting a resistor in series with a + capacitor. The actual values of the components do not really + matter in this problem. +
+
+ In custom Python-evaluated input (also called "write-your-own-grader" + problems), the grader uses a Python script that you create and embed in + the problem to evaluate a learner's response or provide hints. These + problems can be any type. Numerical input and text input problems are + the most common write-your-own-grader problems. +
++ You can use script tag format or answer tag format to create these problems. +
++ You can create custom Python-evaluated input problems that provide + partial credit or that randomize variables in the Python code. You can + also add images to the solution by using an HTML "img" tag. Note that + the "img" tag must be between the "div" tags that are inside the + "solution" tags, and that learners do not see these images until they + click the "Show Answer" button. +
++ For more information, see + Write-Your-Own-Grader Problem in Building and Running an edX Course. +
++ When you add the problem, be sure to select Settings + to specify a Display Name and other values that apply. +
+You can use the following example problem as a model.
++
+
+
+ Explanation
+Any set of integers on the line \(y = 10 - x\) satisfy these constraints.
++
+ 
+
+ Explanation
+Any set of integers on the line \(y = 20 - x\) satisfy these constraints.
+To add an image to the solution, use an HTML "img" tag. Make sure to include alt text.
+
+ In drag and drop problems, students respond to a question by dragging text or objects to a specific location on an image.
++ For more information, see + + Drag and Drop Problem (Deprecated) in Building and Running an edX Course. +
++ When you add the problem, be sure to select Settings + to specify a Display Name and other values that apply. +
+You can use the following example problems as models.
++
Simple Drag and Drop
+Drag each word in the scrollbar to the bucket that matches the number of letters in the word.
+Drag and Drop with Outline
+Label the hydrogen atoms connected with the left carbon atom.
+You can use this template as a guide to the OLX markup to use for math expression problems. Edit this component to replace the example with your own assessment.
+ ++ In an image mapped input problem, also known as a "pointing on a picture" problem, students click inside a defined region in an image. You define this region by including coordinates in the body of the problem. You can define one rectangular region, + multiple rectangular regions, or one non-rectangular region. For more information, see + Image Mapped Input Problem + in + Building and Running an edx Course. +
+When you add the problem, be sure to select + Settings + to specify a + Display Name + and other values that apply.
+You can use the following example problem as a model.
+What country is home to the Great Pyramid of Giza as well as the cities of Cairo and Memphis? Click the country on the map below.
+
+
+ Explanation
+Egypt is home to not only the Pyramids, Cairo, and Memphis, but also the Sphinx and the ancient Royal Library of Alexandria.
++ In these problems (also called custom JavaScript problems or JS Input + problems), you add a problem or tool that uses JavaScript in Studio. + Studio embeds the problem in an IFrame so that your learners can + interact with it in the LMS. You can grade your learners' work using + JavaScript and some basic Python, and the grading is integrated into the + edX grading system. +
++ The JS Input problem that you create must use HTML, JavaScript, and + cascading style sheets (CSS). You can use any application creation tool, + such as the Google Web Toolkit (GWT), to create your JS Input problem. +
++ For more information, see + + Custom JavaScript Problem in Building and Running an edX Course. +
++ JavaScript developers can also see + + Custom JavaScript Applications in the EdX Developer's Guide. +
++ When you add the problem, be sure to select Settings + to specify a Display Name and other values that apply. + Also, be sure to specify a title attribute on the jsinput tag; + this title is used for the title attribute on the generated IFrame. Generally, + the title attribute on the IFrame should match the title tag of the HTML hosted + within the IFrame, which is specified by the html_file attribute. +
+You can use the following example problem as a model.
+ +This is paragraph text displayed before the IFrame.
+Problem With Adaptive Hint
+This problem demonstrates a question with hints, based on using the hintfn method.
+ +You can use this template as a guide to the simple editor markdown and OLX markup to use for dropdown problems. Edit this component to replace this template with your own assessment.
- -