scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 17:45:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Remove Debug component in studios

Browse source
This commit is contained in:
Paul Kaplan 2021-06-18 11:49:57 -04:00
parent fa8aff5837
commit ae202c7bcd
7 changed files with 53 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/views/studio/debug.jsx
View file

@ -1,18 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
const Debug = ({label, data}) => (<div style={{padding: '2rem', border: '1px solid red', margin: '2rem'}}>
<small>{label}</small>
<code>
<pre style={{fontSize: '0.75rem'}}>
{JSON.stringify(data, null, ' ')}
</pre>
</code>
</div>);
Debug.propTypes = {
label: PropTypes.string,
data: PropTypes.any // eslint-disable-line react/forbid-prop-types
};
export default Debug;

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

@ -21,6 +21,12 @@
"studio.followErrors.confirmEmail": "Please confirm your email address first",
"studio.followErrors.generic": "Something went wrong following the studio",
"studio.sectionLoadError.projectsHeadline": "Something went wrong loading projects",
"studio.sectionLoadError.curatorsHeadline": "Something went wrong loading curators",
"studio.sectionLoadError.managersHeadline": "Something went wrong loading managers",
"studio.sectionLoadError.activityHeadline": "Something went wrong loading managers",
"studio.sectionLoadError.tryAgain": "Try again",
"studio.projectsHeader": "Projects",
"studio.addProjectsHeader": "Add Projects",
"studio.addProject": "Add",

14
src/views/studio/studio-activity.jsx
View file

@ -6,7 +6,6 @@ import {connect} from 'react-redux';
import {activity} from './lib/redux-modules';
import {loadActivity} from './lib/studio-activity-actions';
import Debug from './debug.jsx';
import classNames from 'classnames';
import SocialMessage from '../../components/social-message/social-message.jsx';
@ -181,10 +180,15 @@ const StudioActivity = ({items, loading, error, moreToLoad, onLoadMore}) => {
<h2><FormattedMessage id="studio.activityHeader" /></h2>
</div>
{loading && <div>Loading...</div>}
{error && <Debug
label="Error"
data={error}
/>}
{error && <div className="studio-section-load-error studio-info-box studio-info-box-error">
<h3><FormattedMessage id="studio.sectionLoadError.activityHeadline" /></h3>
<button
className="button"
onClick={onLoadMore}
>
<FormattedMessage id="studio.sectionLoadError.tryAgain" />
</button>
</div>}
<ul
className="studio-messages-list"
>

14
src/views/studio/studio-curators.jsx
View file

@ -5,7 +5,6 @@ import {FormattedMessage} from 'react-intl';
import classNames from 'classnames';
import {curators} from './lib/redux-modules';
import Debug from './debug.jsx';
import {CuratorTile} from './studio-member-tile.jsx';
import CuratorInviter from './studio-curator-inviter.jsx';
import {loadCurators} from './lib/studio-member-actions';
@ -28,10 +27,15 @@ const StudioCurators = ({
<h2><FormattedMessage id="studio.curatorsHeader" /></h2>
</div>
{canInviteCurators && <CuratorInviter />}
{error && <Debug
label="Error"
data={error}
/>}
{error && <div className="studio-section-load-error studio-info-box studio-info-box-error">
<h3><FormattedMessage id="studio.sectionLoadError.curatorsHeadline" /></h3>
<button
className="button"
onClick={onLoadMore}
>
<FormattedMessage id="studio.sectionLoadError.tryAgain" />
</button>
</div>}
<div className="studio-members-grid">
{items.length === 0 && !loading ? (
<div className="studio-empty">

14
src/views/studio/studio-managers.jsx
View file

@ -12,7 +12,6 @@ import {
selectStudioHasReachedManagerThreshold
} from '../../redux/studio.js';
import {loadManagers} from './lib/studio-member-actions';
import Debug from './debug.jsx';
import {ManagerTile} from './studio-member-tile.jsx';
import StudioInfoBox from './studio-info-box.jsx';
import AlertProvider from '../../components/alert/alert-provider.jsx';
@ -85,10 +84,15 @@ const StudioManagers = ({
</div>
}
</div>
{error && <Debug
label="Error"
data={error}
/>}
{error && <div className="studio-section-load-error studio-info-box studio-info-box-error">
<h3><FormattedMessage id="studio.sectionLoadError.managersHeadline" /></h3>
<button
className="button"
onClick={onLoadMore}
>
<FormattedMessage id="studio.sectionLoadError.tryAgain" />
</button>
</div>}
<div className="studio-members-grid">
{items.map(item =>
(<ManagerTile

20
src/views/studio/studio-projects.jsx
View file

@ -7,7 +7,6 @@ import classNames from 'classnames';
import {projects} from './lib/redux-modules';
import {selectCanAddProjects, selectCanEditOpenToAll, selectShowProjectMuteError} from '../../redux/studio-permissions';
import Debug from './debug.jsx';
import StudioProjectAdder from './studio-project-adder.jsx';
import StudioProjectTile from './studio-project-tile.jsx';
import {loadProjects} from './lib/studio-project-actions.js';
@ -24,7 +23,7 @@ const StudioProjects = ({
useEffect(() => {
if (items.length === 0) onLoadMore();
}, []);
return (
<AlertProvider>
<div className="studio-projects">
@ -49,12 +48,19 @@ const StudioProjects = ({
</CommentingStatus>
}
{canAddProjects && <StudioProjectAdder />}
{error && <Debug
label="Error"
data={error}
/>}
{error && <div className="studio-section-load-error studio-info-box studio-info-box-error">
<h3><FormattedMessage id="studio.sectionLoadError.projectsHeadline" /></h3>
<button
className="button"
onClick={onLoadMore}
>
<FormattedMessage id="studio.sectionLoadError.tryAgain" />
</button>
</div>}
<div className="studio-projects-grid">
{items.length === 0 && !loading ? (
{items.length === 0 && !loading && !error ? (
<div className="studio-empty">
{canAddProjects ? (
<React.Fragment>

7
src/views/studio/studio.scss
View file

@ -174,6 +174,13 @@ $radius: 8px;
}
}
.studio-section-load-error {
margin-top: 2rem;
padding: 1rem;
flex-direction: column;
text-align: center;
}
.studio-tab-nav {
border-bottom: 1px solid $active-dark-gray;
padding-bottom: 8px;