scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 09:35:56 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

add modal for report received

Browse source
This commit is contained in:
Eric Rosenbaum 2021-05-14 16:03:22 -04:00
parent 20a342c0a2
commit df30f9bac6
2 changed files with 64 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/views/studio/l10n.json
View file

@ -71,5 +71,7 @@
"studio.reportThisStudio": "Report this studio", "studio.reportThisStudio": "Report this studio",
"studio.reportPleaseExplain": "Please explain why you feel this studio is disrespectful or inappropriate, or otherwise breaks the Scratch Community Guidelines.", "studio.reportPleaseExplain": "Please explain why you feel this studio is disrespectful or inappropriate, or otherwise breaks the Scratch Community Guidelines.",
"studio.reportAreThereComments": "Are there inappropriate comments in the studio? Please report them by clicking the \"report\" button on the individual comments." "studio.reportAreThereComments": "Are there inappropriate comments in the studio? Please report them by clicking the \"report\" button on the individual comments.",
"studio.reportThanksForLettingUsKnow": "Thanks for letting us know!",
"studio.reportYourFeedback": "Your feedback will help us make Scratch better."
} }

102
src/views/studio/studio-report.jsx
View file

@ -42,49 +42,67 @@ const StudioReport = ({
<button onClick={handleOpen}><FormattedMessage id="general.report" /></button> <button onClick={handleOpen}><FormattedMessage id="general.report" /></button>
)} )}
{isOpen && ( {isOpen && (
<Modal previouslyReported ? (
isOpen <Modal
className="studio-report-modal" isOpen
onRequestClose={handleClose} className="studio-report-modal"
> onRequestClose={handleClose}
<ModalTitle
className="studio-report-title"
title={intl.formatMessage({id: 'studio.reportThisStudio'})}
/>
<ModalInnerContent
className="studio-report-inner"
> >
<h3><FormattedMessage id="studio.reportThisStudio" /></h3> <ModalTitle
<p><FormattedMessage id="studio.reportPleaseExplain" /></p> className="studio-report-title"
<StudioReportTile
handleChange={handleChange}
heading={intl.formatMessage({id: 'studio.title'})}
text={title}
value={Fields.TITLE}
/> />
<StudioReportTile <ModalInnerContent
handleChange={handleChange} className="studio-report-inner"
heading={intl.formatMessage({id: 'studio.description'})}
text={description}
value={Fields.DESCRIPTION}
/>
<StudioReportTile
handleChange={handleChange}
heading={intl.formatMessage({id: 'studio.thumbnail'})}
image={image}
value={Fields.THUMBNAIL}
/>
<p><FormattedMessage id="studio.reportAreThereComments" /></p>
<button
className="button"
disabled={field === null || isSubmitting}
onClick={handleSubmit}
> >
{isSubmitting && <FormattedMessage id="report.sending" />} <h2><FormattedMessage id="studio.reportThanksForLettingUsKnow" /></h2>
{!isSubmitting && <FormattedMessage id="report.send" />} <p><FormattedMessage id="studio.reportYourFeedback" /></p>
</button> </ModalInnerContent>
</ModalInnerContent> </Modal>
</Modal> ) : (
<Modal
isOpen
className="studio-report-modal"
onRequestClose={handleClose}
>
<ModalTitle
className="studio-report-title"
title={intl.formatMessage({id: 'studio.reportThisStudio'})}
/>
<ModalInnerContent
className="studio-report-inner"
>
<h3><FormattedMessage id="studio.reportThisStudio" /></h3>
<p><FormattedMessage id="studio.reportPleaseExplain" /></p>
<StudioReportTile
handleChange={handleChange}
heading={intl.formatMessage({id: 'studio.title'})}
text={title}
value={Fields.TITLE}
/>
<StudioReportTile
handleChange={handleChange}
heading={intl.formatMessage({id: 'studio.description'})}
text={description}
value={Fields.DESCRIPTION}
/>
<StudioReportTile
handleChange={handleChange}
heading={intl.formatMessage({id: 'studio.thumbnail'})}
image={image}
value={Fields.THUMBNAIL}
/>
<p><FormattedMessage id="studio.reportAreThereComments" /></p>
<button
className="button"
disabled={field === null || isSubmitting}
onClick={handleSubmit}
>
{isSubmitting && <FormattedMessage id="report.sending" />}
{!isSubmitting && <FormattedMessage id="report.send" />}
</button>
</ModalInnerContent>
</Modal>
)
)} )}
</div> </div>
); );
@ -92,6 +110,7 @@ const StudioReport = ({
StudioReport.propTypes = { StudioReport.propTypes = {
canReport: PropTypes.bool, canReport: PropTypes.bool,
description: PropTypes.string,
error: PropTypes.string, error: PropTypes.string,
field: PropTypes.string, field: PropTypes.string,
intl: intlShape, intl: intlShape,
@ -102,7 +121,8 @@ StudioReport.propTypes = {
handleClose: PropTypes.func, handleClose: PropTypes.func,
handleSetField: PropTypes.func, handleSetField: PropTypes.func,
handleSubmit: PropTypes.func, handleSubmit: PropTypes.func,
image: PropTypes.string image: PropTypes.string,
title: PropTypes.string
}; };
export default connect( export default connect(