Merge pull request #5577 from seotts/muted-errors-from-backend

Show errors when studio edit gets a muted response from backend

src/redux/studio-mutations.js

@@ -21,7 +21,8 @@ const Errors = keyMirror({
     THUMBNAIL_INVALID: null,
     TEXT_TOO_LONG: null,
     REQUIRED_FIELD: null,
-    UNHANDLED: null
+    UNHANDLED: null,
+    USER_MUTED: null
 });
 
 const MAX_IMAGE_BYTES = 524288;
@@ -89,9 +90,7 @@ const selectFollowingMutationError = state => state.studioMutations.mutationErro
 const selectIsMutatingImage = state => state.studioMutations.isMutating.image;
 const selectImageMutationError = state => state.studioMutations.mutationErrors.image;
 const selectIsMutatingOpenToAll = state => state.studioMutations.isMutating.openToAll;
-const selectOpenToAllMutationError = state => state.studioMutations.mutationErrors.openToAll;
 const selectIsMutatingCommentsAllowed = state => state.studioMutations.isMutating.commentsAllowed;
-const selectCommentsAllowedMutationError = state => state.studioMutations.mutationErrors.commentsAllowed;
 
 // Thunks
 /**
@@ -104,6 +103,7 @@ const selectCommentsAllowedMutationError = state => state.studioMutations.mutati
  */
 const normalizeError = (err, body, res) => {
     if (err) return Errors.NETWORK;
+    if (res.statusCode === 403 && body.mute_status) return Errors.USER_MUTED;
     if (res.statusCode === 401 || res.statusCode === 403) return Errors.PERMISSION;
     if (res.statusCode !== 200) return Errors.SERVER;
     try {
@@ -221,6 +221,8 @@ const mutateStudioCommentsAllowed = shouldAllow => ((dispatch, getState) => {
     }, (err, body, res) => {
         const error = normalizeError(err, body, res);
         const wasAllowed = selectStudioCommentsAllowed(state);
+        // eslint-disable-next-line no-console
+        console.error(`Error mutating commentsAllowed: ${error}`);
         dispatch(completeMutation('commentsAllowed', error ? wasAllowed : shouldAllow, error));
     });
 });
@@ -237,6 +239,8 @@ const mutateStudioOpenToAll = shouldBeOpen => ((dispatch, getState) => {
     }, (err, body, res) => {
         const error = normalizeError(err, body, res);
         const wasOpen = selectStudioOpenToAll(getState());
+        // eslint-disable-next-line no-console
+        console.error(`Error mutating openToAll: ${error}`);
         dispatch(completeMutation('openToAll', error ? wasOpen : shouldBeOpen, error));
     });
 });
@@ -264,7 +268,5 @@ module.exports = {
     selectIsMutatingImage,
     selectImageMutationError,
     selectIsMutatingCommentsAllowed,
-    selectCommentsAllowedMutationError,
-    selectIsMutatingOpenToAll,
-    selectOpenToAllMutationError
+    selectIsMutatingOpenToAll
 };

src/views/studio/l10n.json

@@ -111,10 +111,11 @@
     "studio.reportThanksForLettingUsKnow": "Thanks for letting us know!",
     "studio.reportYourFeedback": "Your feedback will help us make Scratch better.",
 
-    "studios.mutedCurators": "You will be able to invite curators and add managers again {inDuration}.",
-    "studios.mutedProjects": "You will be able to add and remove projects again {inDuration}.",
-    "studios.mutedEdit": "You will be able to edit studios again {inDuration}.",
-    "studios.mutedPaused": "Your account has been paused from using studios until then.",
+    "studio.mutedCurators": "You will be able to invite curators and add managers again {inDuration}.",
+    "studio.mutedProjects": "You will be able to add and remove projects again {inDuration}.",
+    "studio.mutedEdit": "You will be able to edit studios again {inDuration}.",
+    "studio.mutedPaused": "Your account has been paused from using studios until then.",
+    "studio.mutedError": "Your account has been paused from using studios. Refresh for more information.",
 
     "studio.alertProjectAdded": "\"{title}\" added to studio",
     "studio.alertProjectAlreadyAdded": "That project is already in this studio",

src/views/studio/lib/studio-member-actions.js

@@ -10,6 +10,7 @@ const Errors = keyMirror({
     SERVER: null,
     PERMISSION: null,
     DUPLICATE: null,
+    USER_MUTED: null,
     UNKNOWN_USERNAME: null,
     RATE_LIMIT: null,
     MANAGER_LIMIT: null
@@ -20,6 +21,7 @@ const normalizeError = (err, body, res) => {
     if (res.statusCode === 400 && body.message === 'too many owners') {
         return Errors.MANAGER_LIMIT;
     }
+    if (res.statusCode === 403 && body.mute_status) return Errors.USER_MUTED;
     if (res.statusCode === 401 || res.statusCode === 403) return Errors.PERMISSION;
     if (res.statusCode === 404) return Errors.UNKNOWN_USERNAME;
     if (res.statusCode === 429) return Errors.RATE_LIMIT;

src/views/studio/lib/studio-project-actions.js

@@ -12,11 +12,13 @@ const Errors = keyMirror({
     PERMISSION: null,
     UNKNOWN_PROJECT: null,
     RATE_LIMIT: null,
-    DUPLICATE: null
+    DUPLICATE: null,
+    USER_MUTED: null
 });
 
 const normalizeError = (err, body, res) => {
     if (err) return Errors.NETWORK;
+    if (res.statusCode === 403 && body.mute_status) return Errors.USER_MUTED;
     if (res.statusCode === 401 || res.statusCode === 403) return Errors.PERMISSION;
     if (res.statusCode === 404) return Errors.UNKNOWN_PROJECT;
     if (res.statusCode === 409) return Errors.DUPLICATE;

src/views/studio/studio-comments-allowed.jsx

@@ -7,13 +7,13 @@ import classNames from 'classnames';
 
 import {selectStudioCommentsAllowed, selectIsFetchingInfo} from '../../redux/studio';
 import {
-    mutateStudioCommentsAllowed, selectIsMutatingCommentsAllowed, selectCommentsAllowedMutationError
+    mutateStudioCommentsAllowed, selectIsMutatingCommentsAllowed
 } from '../../redux/studio-mutations';
 
 import ToggleSlider from '../../components/forms/toggle-slider.jsx';
 
 const StudioCommentsAllowed = ({
-    commentsAllowedError, isFetching, isMutating, commentsAllowed, handleUpdate
+    isFetching, isMutating, commentsAllowed, handleUpdate
 }) => (
     <div>
         {isFetching ? (
@@ -33,14 +33,12 @@ const StudioCommentsAllowed = ({
                     })}
                     onChange={e => handleUpdate(e.target.checked)}
                 />
-                {commentsAllowedError && <div>Error mutating commentsAllowed: {commentsAllowedError}</div>}
             </div>
         )}
     </div>
 );
 
 StudioCommentsAllowed.propTypes = {
-    commentsAllowedError: PropTypes.string,
     isFetching: PropTypes.bool,
     isMutating: PropTypes.bool,
     commentsAllowed: PropTypes.bool,
@@ -51,8 +49,7 @@ export default connect(
     state => ({
         commentsAllowed: selectStudioCommentsAllowed(state),
         isFetching: selectIsFetchingInfo(state),
-        isMutating: selectIsMutatingCommentsAllowed(state),
-        commentsAllowedError: selectCommentsAllowedMutationError(state)
+        isMutating: selectIsMutatingCommentsAllowed(state)
     }),
     {
         handleUpdate: mutateStudioCommentsAllowed

src/views/studio/studio-curator-inviter.jsx

@@ -16,6 +16,7 @@ const errorToMessageId = error => {
     case Errors.PERMISSION: return 'studio.curatorErrors.generic';
     case Errors.DUPLICATE: return 'studio.curatorErrors.alreadyCurator';
     case Errors.UNKNOWN_USERNAME: return 'studio.curatorErrors.unknownUsername';
+    case Errors.USER_MUTED: return 'studio.mutedError';
     case Errors.RATE_LIMIT: return 'studio.curatorErrors.tooFast';
     default: return 'studio.curatorErrors.generic';
     }

src/views/studio/studio-description.jsx

@@ -21,6 +21,7 @@ const errorToMessageId = error => {
     case Errors.INAPPROPRIATE: return 'studio.updateErrors.inappropriate';
     case Errors.TEXT_TOO_LONG: return 'studio.updateErrors.textTooLong';
     case Errors.REQUIRED_FIELD: return 'studio.updateErrors.requiredField';
+    case Errors.USER_MUTED: return 'studio.mutedError';
     default: return 'studio.updateErrors.generic';
     }
 };

src/views/studio/studio-image.jsx

@@ -21,6 +21,7 @@ const errorToMessageId = error => {
     switch (error) {
     case Errors.THUMBNAIL_INVALID: return 'studio.updateErrors.thumbnailInvalid';
     case Errors.THUMBNAIL_TOO_LARGE: return 'studio.updateErrors.thumbnailTooLarge';
+    case Errors.USER_MUTED: return 'studio.mutedError';
     default: return 'studio.updateErrors.generic';
     }
 };

src/views/studio/studio-mute-edit-message.jsx

@@ -14,7 +14,7 @@ const StudioMuteEditMessage = ({
     <ValidationMessage
         mode="info"
         message={<FormattedMessage
-            id="studios.mutedEdit"
+            id="studio.mutedEdit"
             values={{
                 inDuration: formatRelativeTime(muteExpiresAtMs, window._locale)
             }}

src/views/studio/studio-open-to-all.jsx

@@ -7,13 +7,13 @@ import classNames from 'classnames';
 
 import {selectStudioOpenToAll, selectIsFetchingInfo} from '../../redux/studio';
 import {
-    mutateStudioOpenToAll, selectIsMutatingOpenToAll, selectOpenToAllMutationError
+    mutateStudioOpenToAll, selectIsMutatingOpenToAll
 } from '../../redux/studio-mutations';
 
 import ToggleSlider from '../../components/forms/toggle-slider.jsx';
 
 const StudioOpenToAll = ({
-    openToAllError, isFetching, isMutating, openToAll, handleUpdate
+    isFetching, isMutating, openToAll, handleUpdate
 }) => (
     <div>
         {isFetching ? (
@@ -29,14 +29,12 @@ const StudioOpenToAll = ({
                     })}
                     onChange={e => handleUpdate(e.target.checked)}
                 />
-                {openToAllError && <div>Error mutating openToAll: {openToAllError}</div>}
             </div>
         )}
     </div>
 );
 
 StudioOpenToAll.propTypes = {
-    openToAllError: PropTypes.string,
     isFetching: PropTypes.bool,
     isMutating: PropTypes.bool,
     openToAll: PropTypes.bool,
@@ -47,8 +45,7 @@ export default connect(
     state => ({
         openToAll: selectStudioOpenToAll(state),
         isFetching: selectIsFetchingInfo(state),
-        isMutating: selectIsMutatingOpenToAll(state),
-        openToAllError: selectOpenToAllMutationError(state)
+        isMutating: selectIsMutatingOpenToAll(state)
     }),
     {
         handleUpdate: mutateStudioOpenToAll

src/views/studio/studio-project-adder.jsx

@@ -18,6 +18,7 @@ const errorToMessageId = error => {
     case Errors.DUPLICATE: return 'studio.projectErrors.duplicate';
     case Errors.RATE_LIMIT: return 'studio.projectErrors.tooFast';
     case Errors.UNKNOWN_PROJECT: return 'studio.projectErrors.checkUrl';
+    case Errors.USER_MUTED: return 'studio.mutedError';
     default: return 'studio.projectErrors.generic';
     }
 };

src/views/studio/studio-projects.jsx

@@ -38,13 +38,13 @@ const StudioProjects = ({
                         <p>
                             <div>
                                 <FormattedMessage
-                                    id="studios.mutedProjects"
+                                    id="studio.mutedProjects"
                                     values={{
                                         inDuration: formatRelativeTime(muteExpiresAtMs, window._locale)
                                     }}
                                 />
                             </div>
-                            <div><FormattedMessage id="studios.mutedPaused" /></div>
+                            <div><FormattedMessage id="studio.mutedPaused" /></div>
                         </p>
                     </CommentingStatus>
                 }

src/views/studio/studio-title.jsx

@@ -17,6 +17,7 @@ const errorToMessageId = error => {
     case Errors.INAPPROPRIATE: return 'studio.updateErrors.inappropriate';
     case Errors.TEXT_TOO_LONG: return 'studio.updateErrors.textTooLong';
     case Errors.REQUIRED_FIELD: return 'studio.updateErrors.requiredField';
+    case Errors.USER_MUTED: return 'studio.mutedError';
     default: return 'studio.updateErrors.generic';
     }
 };

src/views/studio/studio.jsx

@@ -48,7 +48,6 @@ import {selectShowCuratorMuteError} from '../../redux/studio-permissions.js';
 
 const StudioShell = ({showCuratorMuteError, muteExpiresAtMs, studioLoadFailed}) => {
     const match = useRouteMatch();
-
     return (
         studioLoadFailed ?
             <NotAvailable /> :
@@ -68,13 +67,13 @@ const StudioShell = ({showCuratorMuteError, muteExpiresAtMs, studioLoadFailed})
                                         <p>
                                             <div>
                                                 <FormattedMessage
-                                                    id="studios.mutedCurators"
+                                                    id="studio.mutedCurators"
                                                     values={{
                                                         inDuration: formatRelativeTime(muteExpiresAtMs, window._locale)
                                                     }}
                                                 />
                                             </div>
-                                            <div><FormattedMessage id="studios.mutedPaused" /></div>
+                                            <div><FormattedMessage id="studio.mutedPaused" /></div>
                                         </p>
                                     </CommentingStatus>
                                 }