From 56dc892ee55d4715cf1205af165eaea28ee2f483 Mon Sep 17 00:00:00 2001 From: seotts Date: Tue, 8 Jun 2021 13:37:12 -0400 Subject: [PATCH 1/2] =?UTF-8?q?Muted=20user=20can=E2=80=99t=20add=20proj?= =?UTF-8?q?=20to=20studio=20via=20proj=20page?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/preview/l10n.json | 3 +- src/views/preview/preview.scss | 2 - src/views/preview/subactions.jsx | 207 +++++++++++------- src/views/preview/subactions.scss | 7 + src/views/studio/studio-mute-edit-message.jsx | 11 +- 5 files changed, 146 insertions(+), 84 deletions(-) diff --git a/src/views/preview/l10n.json b/src/views/preview/l10n.json index cdd473f16..df9efaed3 100644 --- a/src/views/preview/l10n.json +++ b/src/views/preview/l10n.json @@ -46,5 +46,6 @@ "project.cloudVariables": "Cloud Variables", "project.cloudDataLink": "See Data", "project.usernameBlockAlert": "This project can detect who is using it, through the \"username\" block. To hide your identity, sign out before using the project.", - "project.inappropriateUpdate": "Hmm...the bad word detector thinks there is a problem with your text. Please change it and remember to be respectful." + "project.inappropriateUpdate": "Hmm...the bad word detector thinks there is a problem with your text. Please change it and remember to be respectful.", + "project.mutedAddToStudio": "You will be able to add to studios again {inDuration}." } diff --git a/src/views/preview/preview.scss b/src/views/preview/preview.scss index 4698d4dfd..b7d4d8b98 100644 --- a/src/views/preview/preview.scss +++ b/src/views/preview/preview.scss @@ -160,7 +160,6 @@ $stage-width: 480px; margin-top: $arrow-border-width; border: 1px solid $active-gray; border-radius: 5px; - background-color: $ui-orange; padding: 1rem; max-width: 18.75rem; min-height: 1rem; @@ -185,7 +184,6 @@ $stage-width: 480px; border-left: 1px solid $active-gray; border-radius: 5px; - background-color: $ui-orange; width: $arrow-border-width; height: $arrow-border-width; diff --git a/src/views/preview/subactions.jsx b/src/views/preview/subactions.jsx index 0c02623cb..1a487b6f8 100644 --- a/src/views/preview/subactions.jsx +++ b/src/views/preview/subactions.jsx @@ -8,90 +8,132 @@ const Button = require('../../components/forms/button.jsx'); const AddToStudioModal = require('./add-to-studio.jsx'); const SocialModal = require('../../components/modal/social/container.jsx'); const ReportModal = require('../../components/modal/report/modal.jsx'); +const {connect} = require('react-redux'); +const {selectShowProjectMuteError} = require('../../redux/studio-permissions.js'); +const {useState} = require('react'); const projectShape = require('./projectshape.jsx').projectShape; +import StudioMuteEditMessage from '../studio/studio-mute-edit-message.jsx'; + require('./subactions.scss'); -const Subactions = props => ( - -
-
©
- {' '} - {/* eslint-disable react/jsx-sort-props */} - {props.shareDate ? ( - - ) : 'Unshared'} - {/* eslint-enable react/jsx-sort-props */} -
- - {(props.canReport) && - - - {props.reportOpen && ( - - )} - - } - {props.canAddToStudio && - - - {props.addToStudioOpen && ( - - )} - - } - {/* only show copy link button, modal if project is shared */} - {props.isShared && props.projectInfo && props.projectInfo.id && ( - - - {props.socialOpen && ( - - )} - - )} +const Subactions = ({ + addToStudioOpen, + canAddToStudio, + canReport, + isAdmin, + isShared, + onAddToStudioClicked, + onAddToStudioClosed, + onReportClicked, + onReportClose, + onReportSubmit, + onSocialClicked, + onSocialClosed, + onToggleStudio, + projectInfo, + reportOpen, + shareDate, + showAddToStudioMuteError, + socialOpen, + userOwnsProject +}) => { + const [showMuteMessage, setShowMuteMessage] = useState(false); + + return ( + +
+
©
+ {' '} + {/* eslint-disable react/jsx-sort-props */} + {shareDate ? ( + + ) : 'Unshared'} + {/* eslint-enable react/jsx-sort-props */} +
+ + {(canReport) && + + + {reportOpen && ( + + )} + + } + {canAddToStudio && + +
showAddToStudioMuteError && setShowMuteMessage(true)} + onMouseLeave={() => showAddToStudioMuteError && setShowMuteMessage(false)} + /* eslint-enable react/jsx-no-bind */ + > + + {showMuteMessage && } +
+ {addToStudioOpen && ( + + )} + + } + {/* only show copy link button, modal if project is shared */} + {isShared && projectInfo && projectInfo.id && ( + + + {socialOpen && ( + + )} + + )} + - -); + ); +}; Subactions.propTypes = { addToStudioOpen: PropTypes.bool, @@ -110,8 +152,13 @@ Subactions.propTypes = { projectInfo: projectShape, reportOpen: PropTypes.bool, shareDate: PropTypes.string, + showAddToStudioMuteError: PropTypes.bool, socialOpen: PropTypes.bool, userOwnsProject: PropTypes.bool }; -module.exports = Subactions; +module.exports = connect( + state => ({ + showAddToStudioMuteError: selectShowProjectMuteError(state) + }) +)(Subactions); diff --git a/src/views/preview/subactions.scss b/src/views/preview/subactions.scss index bba4bd6c8..d70791d94 100644 --- a/src/views/preview/subactions.scss +++ b/src/views/preview/subactions.scss @@ -109,3 +109,10 @@ } } } + +.studio-button-error { + top: auto; + transform: none; + width: 100%; + margin-left: 0; +} diff --git a/src/views/studio/studio-mute-edit-message.jsx b/src/views/studio/studio-mute-edit-message.jsx index 44adce7ac..7d99c0b23 100644 --- a/src/views/studio/studio-mute-edit-message.jsx +++ b/src/views/studio/studio-mute-edit-message.jsx @@ -9,12 +9,15 @@ import {selectMuteStatus} from '../../redux/session'; import {formatRelativeTime} from '../../lib/format-time.js'; const StudioMuteEditMessage = ({ + className, + messageId, muteExpiresAtMs }) => ( ({ muteExpiresAtMs: (selectMuteStatus(state).muteExpiresAt * 1000 || 0) From 1a753dfde3afa82ef071e7cdc4cf6a0786d97eb2 Mon Sep 17 00:00:00 2001 From: seotts Date: Tue, 15 Jun 2021 09:44:47 -0400 Subject: [PATCH 2/2] Put Add to Studio change behind session flag --- src/redux/session.js | 2 ++ src/views/preview/subactions.jsx | 5 +++-- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/redux/session.js b/src/redux/session.js index fc2822721..0cad26359 100644 --- a/src/redux/session.js +++ b/src/redux/session.js @@ -145,6 +145,8 @@ module.exports.selectProjectCommentsGloballyEnabled = state => module.exports.selectMuteStatus = state => get(state, ['session', 'session', 'permissions', 'mute_status'], {muteExpiresAt: 0, offenses: [], showWarning: false}); module.exports.selectIsMuted = state => (module.exports.selectMuteStatus(state).muteExpiresAt || 0) * 1000 > Date.now(); +module.exports.selectNewStudiosLaunched = state => get(state, ['session', 'session', 'flags', 'new_studios_launched'], + false); module.exports.selectHasFetchedSession = state => state.session.status === module.exports.Status.FETCHED; diff --git a/src/views/preview/subactions.jsx b/src/views/preview/subactions.jsx index 1a487b6f8..9510611cd 100644 --- a/src/views/preview/subactions.jsx +++ b/src/views/preview/subactions.jsx @@ -13,6 +13,7 @@ const {selectShowProjectMuteError} = require('../../redux/studio-permissions.js' const {useState} = require('react'); const projectShape = require('./projectshape.jsx').projectShape; +import {selectNewStudiosLaunched} from '../../redux/session.js'; import StudioMuteEditMessage from '../studio/studio-mute-edit-message.jsx'; require('./subactions.scss'); @@ -90,7 +91,7 @@ const Subactions = ({ className="action-button studio-button" disabled={showAddToStudioMuteError} key="add-to-studio-button" - onClick={showMuteMessage && onAddToStudioClicked} + onClick={showMuteMessage ? null : onAddToStudioClicked} > @@ -159,6 +160,6 @@ Subactions.propTypes = { module.exports = connect( state => ({ - showAddToStudioMuteError: selectShowProjectMuteError(state) + showAddToStudioMuteError: selectShowProjectMuteError(state) && selectNewStudiosLaunched(state) }) )(Subactions);