Merge pull request #1647 from benetech/frontend_v2

#1608 #1609 - add assign set button and modal
benetech · Jan 20, 2021 · 8361a50 · 8361a50
2 parents 387cf54 + f21b667
commit 8361a50
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 11 deletions.
diff --git a/v2/src/components/Modals/ProblemSetShareModal/index.js b/v2/src/components/Modals/ProblemSetShareModal/index.js
@@ -119,7 +119,14 @@ export default class ProblemSetShareModal extends React.Component {
                 )}
                 closable={false}
                 footer={[
-                    <Button className={editor.modalFooter} key="submit" icon={<FontAwesomeIcon icon={faTimes} />} type="primary" onClick={this.props.onCancel}>
+                    <Button
+                        className={editor.modalFooter}
+                        key="submit"
+                        icon={<FontAwesomeIcon icon={faTimes} />}
+                        type="primary"
+                        aria-label="Close"
+                        onClick={this.props.onCancel}
+                    >
                         {' Close'}
                     </Button>,
                 ]}
@@ -148,6 +155,7 @@ export default class ProblemSetShareModal extends React.Component {
                                     shareLink={this.props.shareLink}
                                     copyLinkCallback={this.copyLinkCallback}
                                     className={classNames('btn', editor.button)}
+                                    btnProps={{ 'aria-label': Locales.strings.copy_link_url.trim() }}
                                 />
                             </div>
                             <div className={classNames('col-12', 'text-center', editor.externalButtons)}>

diff --git a/v2/src/pages/ProblemSet/index.js b/v2/src/pages/ProblemSet/index.js
@@ -32,6 +32,7 @@ class ProblemSet extends Component {
     state = {
         layout: 'grid',
         modalVisible: false,
+        assignModal: false,
         editingTitle: false,
         updatedTitleText: '',
         currentProblem: 0,
@@ -451,16 +452,36 @@ class ProblemSet extends Component {
                     }}
                 >
                     {action === 'edit' && (
-                        <Button
-                            type="primary"
-                            icon={<FontAwesomeIcon icon={faShare} />}
-                            className={styles.assignSet}
-                            onClick={() => {
-                                console.log('share modal');
-                            }}
-                        >
-                            {Locales.strings.assign_set}
-                        </Button>
+                        <>
+                            <Button
+                                type="primary"
+                                icon={<FontAwesomeIcon icon={faShare} />}
+                                className={styles.assignSet}
+                                onClick={() => {
+                                    this.setState({
+                                        assignModal: true,
+                                    });
+                                }}
+                            >
+                                {Locales.strings.assign_set}
+                            </Button>
+                            <ProblemSetShareModal
+                                problemList={problemSet}
+                                shareLink={`${FRONTEND_URL_PROTO}/app/problemSet/view/${set.shareCode}`}
+                                centered
+                                visible={this.state.assignModal}
+                                onOk={() => {
+                                    this.setState({
+                                        assignModal: false,
+                                    });
+                                }}
+                                onCancel={() => {
+                                    this.setState({
+                                        assignModal: false,
+                                    });
+                                }}
+                            />
+                        </>
                     )}
                     {(action === 'edit' || userProfile.email) && (action !== 'review') && (
                         <Dropdown