diff --git a/src/components/ChallengeEditor/ChallengeView/index.js b/src/components/ChallengeEditor/ChallengeView/index.js index b34550c9..b9d14f53 100644 --- a/src/components/ChallengeEditor/ChallengeView/index.js +++ b/src/components/ChallengeEditor/ChallengeView/index.js @@ -9,6 +9,7 @@ import xss from 'xss' import { PrimaryButton } from '../../Buttons' import Track from '../../Track' import NDAField from '../NDAField' +import UseSchedulingAPIField from '../UseSchedulingAPIField' import CopilotField from '../Copilot-Field' import ChallengeScheduleField from '../ChallengeSchedule-Field' import TextEditorField from '../TextEditor-Field' @@ -198,6 +199,9 @@ const ChallengeView = ({ )} + {isBetaMode() && ( + + )} )} { diff --git a/src/components/ChallengeEditor/UseSchedulingAPIField/UseSchedulingAPIField.module.scss b/src/components/ChallengeEditor/UseSchedulingAPIField/UseSchedulingAPIField.module.scss new file mode 100644 index 00000000..e656d519 --- /dev/null +++ b/src/components/ChallengeEditor/UseSchedulingAPIField/UseSchedulingAPIField.module.scss @@ -0,0 +1,84 @@ +@import '../../../styles/includes'; + +.row { + box-sizing: border-box; + display: flex; + flex-direction: row; + margin: 30px 30px 0 30px; + align-content: space-between; + justify-content: flex-start; + + .tcCheckbox { + @include tc-checkbox; + + height: 18px; + width: 210px; + margin: 0; + padding: 0; + vertical-align: bottom; + position: relative; + display: inline-block; + + input[type='checkbox'] { + display: none; + } + + label { + @include roboto-light(); + + line-height: 17px; + font-weight: 300; + cursor: pointer; + position: absolute; + display: inline-block; + width: 14px; + height: 14px; + top: 0; + left: 0; + border: none; + box-shadow: none; + background: $tc-gray-30; + transition: all 0.15s ease-in-out; + + + &.readOnly { + cursor: auto; + } + + &::after { + opacity: 0; + content: ''; + position: absolute; + width: 9px; + height: 5px; + background: transparent; + top: 2px; + left: 2px; + border-top: none; + border-right: none; + transform: rotate(-45deg); + transition: all 0.15s ease-in-out; + } + + &:hover::after { + opacity: 0.3; + } + &:hover:read-only::after { + opacity: 0; + } + + div { + margin-left: 24px; + width: 300px; + } + } + + input[type='checkbox']:checked ~ label { + background: $tc-blue-20; + } + + input[type='checkbox']:checked + label::after { + border-color: $white; + } + } +} diff --git a/src/components/ChallengeEditor/UseSchedulingAPIField/index.js b/src/components/ChallengeEditor/UseSchedulingAPIField/index.js new file mode 100644 index 00000000..2941e1ba --- /dev/null +++ b/src/components/ChallengeEditor/UseSchedulingAPIField/index.js @@ -0,0 +1,39 @@ +import _ from 'lodash' +import React from 'react' +import PropTypes from 'prop-types' +import styles from './UseSchedulingAPIField.module.scss' + +const UseSchedulingAPIField = ({ challenge, toggleUseSchedulingAPI, readOnly }) => { + const useSchedulingAPI = _.get(challenge, 'legacy.useSchedulingAPI', false) + return ( +
+
+ + +
+
+ ) +} + +UseSchedulingAPIField.defaultProps = { + toggleUseSchedulingAPI: () => {}, + readOnly: false +} + +UseSchedulingAPIField.propTypes = { + challenge: PropTypes.shape().isRequired, + toggleUseSchedulingAPI: PropTypes.func, + readOnly: PropTypes.bool +} + +export default UseSchedulingAPIField diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js index b08a5bfa..a5f7013e 100644 --- a/src/components/ChallengeEditor/index.js +++ b/src/components/ChallengeEditor/index.js @@ -49,6 +49,7 @@ import PhaseInput from '../PhaseInput' import LegacyLinks from '../LegacyLinks' import AssignedMemberField from './AssignedMember-Field' import Tooltip from '../Tooltip' +import UseSchedulingAPIField from './UseSchedulingAPIField' import { getResourceRoleByName } from '../../util/tc' import { isBetaMode } from '../../util/cookie' @@ -98,6 +99,7 @@ class ChallengeEditor extends Component { this.updateFileTypesMetadata = this.updateFileTypesMetadata.bind(this) this.toggleAdvanceSettings = this.toggleAdvanceSettings.bind(this) this.toggleNdaRequire = this.toggleNdaRequire.bind(this) + this.toggleUseSchedulingAPI = this.toggleUseSchedulingAPI.bind(this) this.removePhase = this.removePhase.bind(this) this.resetPhase = this.resetPhase.bind(this) this.savePhases = this.savePhases.bind(this) @@ -595,6 +597,14 @@ class ChallengeEditor extends Component { this.setState({ challenge: newChallenge }) } + toggleUseSchedulingAPI () { + const { challenge } = this.state + const newChallenge = { ...challenge } + const useSchedulingApi = !_.get(newChallenge, 'legacy.useSchedulingAPI', false) + _.set(newChallenge, 'legacy.useSchedulingAPI', useSchedulingApi) + this.setState({ challenge: newChallenge }) + } + /** * Remove Phase from challenge Phases list * @param index @@ -837,7 +847,8 @@ class ChallengeEditor extends Component { }, descriptionFormat: 'markdown', timelineTemplateId: defaultTemplate.id, - terms: [{ id: DEFAULT_TERM_UUID, roleId: SUBMITTER_ROLE_UUID }] + terms: [{ id: DEFAULT_TERM_UUID, roleId: SUBMITTER_ROLE_UUID }], + groups: [] // prizeSets: this.getDefaultPrizeSets() } if (isBetaMode() && projectDetail.terms) { @@ -848,6 +859,9 @@ class ChallengeEditor extends Component { .map(term => ({ id: term, roleId: SUBMITTER_ROLE_UUID })) ) } + if (isBetaMode() && projectDetail.groups) { + newChallenge.groups.push(...projectDetail.groups) + } const discussions = this.getDiscussionsConfig(newChallenge) if (discussions) { newChallenge.discussions = discussions @@ -950,8 +964,8 @@ class ChallengeEditor extends Component { const reviewer = this.state.draftChallenge.data.reviewer const action = await partiallyUpdateChallengeDetails(challengeId, patchObject) const draftChallenge = { data: action.challengeDetails } - draftChallenge.copilot = copilot - draftChallenge.reviewer = reviewer + draftChallenge.data.copilot = copilot + draftChallenge.data.reviewer = reviewer const { challenge: oldChallenge } = this.state const newChallenge = { ...oldChallenge } @@ -1415,6 +1429,9 @@ class ChallengeEditor extends Component { )} + {isBetaMode() && ( + + )} )} {!isTask && (