scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 08:31:23 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Merge pull request #5370 from kchadha/studio-404-page

Browse source 
Set up studios view with 404 page
This commit is contained in:
Karishma Chadha 2021-05-10 17:49:30 -04:00 committed by GitHub
commit a9d70b2cc0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 49 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/redux/studio.js
View file

@ -91,6 +91,7 @@ const selectStudioDescription = state => state.studio.description;
const selectStudioImage = state => state.studio.image; const selectStudioImage = state => state.studio.image;
const selectStudioOpenToAll = state => state.studio.openToAll; const selectStudioOpenToAll = state => state.studio.openToAll;
const selectStudioCommentsAllowed = state => state.studio.commentsAllowed; const selectStudioCommentsAllowed = state => state.studio.commentsAllowed;
const selectStudioLoadFailed = state => state.studio.infoStatus === Status.ERROR;
const selectIsFetchingInfo = state => state.studio.infoStatus === Status.FETCHING; const selectIsFetchingInfo = state => state.studio.infoStatus === Status.FETCHING;
const selectIsFollowing = state => state.studio.following; const selectIsFollowing = state => state.studio.following;
const selectIsFetchingRoles = state => state.studio.rolesStatus === Status.FETCHING; const selectIsFetchingRoles = state => state.studio.rolesStatus === Status.FETCHING;
@ -157,6 +158,7 @@ module.exports = {
selectStudioImage, selectStudioImage,
selectStudioOpenToAll, selectStudioOpenToAll,
selectStudioCommentsAllowed, selectStudioCommentsAllowed,
selectStudioLoadFailed,
selectIsFetchingInfo, selectIsFetchingInfo,
selectIsFetchingRoles, selectIsFetchingRoles,
selectIsFollowing selectIsFollowing

77
src/views/studio/studio.jsx
View file

@ -6,9 +6,14 @@ import {
Redirect, Redirect,
useRouteMatch useRouteMatch
} from 'react-router-dom'; } from 'react-router-dom';
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import Page from '../../components/page/www/page.jsx'; import Page from '../../components/page/www/page.jsx';
import render from '../../lib/render.jsx'; import render from '../../lib/render.jsx';
import NotAvailable from '../../components/not-available/not-available.jsx';
import StudioTabNav from './studio-tab-nav.jsx'; import StudioTabNav from './studio-tab-nav.jsx';
import StudioProjects from './studio-projects.jsx'; import StudioProjects from './studio-projects.jsx';
@ -25,56 +30,68 @@ import {
activity activity
} from './lib/redux-modules'; } from './lib/redux-modules';
const {getInitialState, studioReducer} = require('../../redux/studio'); const {getInitialState, studioReducer, selectStudioLoadFailed} = require('../../redux/studio');
const {studioReportReducer} = require('../../redux/studio-report'); const {studioReportReducer} = require('../../redux/studio-report');
const {commentsReducer} = require('../../redux/comments'); const {commentsReducer} = require('../../redux/comments');
const {studioMutationsReducer} = require('../../redux/studio-mutations'); const {studioMutationsReducer} = require('../../redux/studio-mutations');
import './studio.scss'; import './studio.scss';
const StudioShell = () => { const StudioShell = ({studioLoadFailed}) => {
const match = useRouteMatch(); const match = useRouteMatch();
return ( return (
<div className="studio-shell"> studioLoadFailed ?
<div className="studio-info"> <NotAvailable /> :
<StudioInfo /> <div className="studio-shell">
</div> <div className="studio-info">
<div className="studio-tabs"> <StudioInfo />
<StudioTabNav /> </div>
<div> <div className="studio-tabs">
<Switch> <StudioTabNav />
<Route path={`${match.path}/curators`}> <div>
<StudioManagers /> <Switch>
<StudioCurators /> <Route path={`${match.path}/curators`}>
</Route> <StudioManagers />
<Route path={`${match.path}/comments`}> <StudioCurators />
<StudioComments /> </Route>
</Route> <Route path={`${match.path}/comments`}>
<Route path={`${match.path}/activity`}> <StudioComments />
<StudioActivity /> </Route>
</Route> <Route path={`${match.path}/activity`}>
<Route path={`${match.path}/projects`}> <StudioActivity />
{/* We can force /projects back to / this way */} </Route>
<Redirect to={match.url} /> <Route path={`${match.path}/projects`}>
</Route> {/* We can force /projects back to / this way */}
<Route path={match.path}> <Redirect to={match.url} />
<StudioProjects /> </Route>
</Route> <Route path={match.path}>
</Switch> <StudioProjects />
</Route>
</Switch>
</div>
</div> </div>
</div> </div>
</div>
); );
}; };
StudioShell.propTypes = {
studioLoadFailed: PropTypes.bool
};
const ConnectedStudioShell = connect(
state => ({
studioLoadFailed: selectStudioLoadFailed(state)
}),
)(StudioShell);
render( render(
<Page className="studio-page"> <Page className="studio-page">
<Router> <Router>
<Switch> <Switch>
{/* Use variable studioPath to support /studio-playground/ or future route */} {/* Use variable studioPath to support /studio-playground/ or future route */}
<Route path="/:studioPath/:studioId"> <Route path="/:studioPath/:studioId">
<StudioShell /> <ConnectedStudioShell />
</Route> </Route>
</Switch> </Switch>
</Router> </Router>