app/assets/javascripts/components/onboarding/permissions.jsx
import React, { useState } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';
// Permissions slide
const Permissions = ({ currentUser, returnToParam }) => {
const [isHovered, setIsHovered] = useState(false);
let slide;
if (currentUser.instructor) {
slide = (
<div className="intro permissions">
<h1>Permissions</h1>
<p>
Once you´ve signed in, this website will make automatic edits using your Wikipedia account, reflecting actions you take here. Your account will be used to update wiki pages when:
</p>
<ul>
<li>you submit a Wikipedia classroom assignment or make edits to your course page</li>
<li>you add or remove someone from a course</li>
<li>you assign articles to students</li>
<li>you send public messages to students</li>
</ul>
<p>All course content you contribute to this website will be freely available under the <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons Attribution-ShareAlike license</a> (the same one used by Wikipedia).</p>
<Link onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)} to={{ pathname: '/onboarding/finish', search: `?return_to=${returnToParam}` }} className="button border inverse-border">
Finish <i className={`icon3 ${isHovered ? 'icon-rt_arrow_purple' : ' icon-rt_arrow'}`} />
</Link>
</div>
);
} else {
slide = (
<div className="intro permissions">
<h1>Permissions</h1>
<p>
Once you´ve signed in, this website will make automatic edits using your Wikipedia account, reflecting actions you take here. Your account will be used to update wiki pages to:
</p>
<ul>
<li>set up a sandbox page where you can practice editing</li>
<li>adjust your account preferences to enable VisualEditor</li>
<li>add a standard message on your userpage so that others know what course you are part of</li>
<li>add standard messages to the Talk pages of articles you´re editing or reviewing</li>
<li>update your course´s wiki page when you join the course or choose an assignment topic</li>
</ul>
<p>All course content you contribute to this website will be freely available under the <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons Attribution-ShareAlike license</a> (the same one used by Wikipedia).</p>
<Link onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)} to={{ pathname: '/onboarding/finish', search: `?return_to=${returnToParam}` }} className="button border inverse-border">
Finish <i className={`icon3 ${isHovered ? 'icon-rt_arrow_purple' : ' icon-rt_arrow'}`} />
</Link>
</div>
);
}
return slide;
};
Permissions.propTypes = {
currentUser: PropTypes.object,
returnToParam: PropTypes.string
};
export default Permissions;