diff --git a/src/redux/studio.js b/src/redux/studio.js index bfe677399..29cfb39b1 100644 --- a/src/redux/studio.js +++ b/src/redux/studio.js @@ -91,6 +91,7 @@ const selectStudioDescription = state => state.studio.description; const selectStudioImage = state => state.studio.image; const selectStudioOpenToAll = state => state.studio.openToAll; const selectStudioCommentsAllowed = state => state.studio.commentsAllowed; +const selectStudioLoadFailed = state => state.studio.infoStatus === Status.ERROR; const selectIsFetchingInfo = state => state.studio.infoStatus === Status.FETCHING; const selectIsFollowing = state => state.studio.following; const selectIsFetchingRoles = state => state.studio.rolesStatus === Status.FETCHING; @@ -157,6 +158,7 @@ module.exports = { selectStudioImage, selectStudioOpenToAll, selectStudioCommentsAllowed, + selectStudioLoadFailed, selectIsFetchingInfo, selectIsFetchingRoles, selectIsFollowing diff --git a/src/views/studio/studio.jsx b/src/views/studio/studio.jsx index 001fc3655..37ebb9517 100644 --- a/src/views/studio/studio.jsx +++ b/src/views/studio/studio.jsx @@ -6,9 +6,14 @@ import { Redirect, useRouteMatch } from 'react-router-dom'; +import PropTypes from 'prop-types'; +import {connect} from 'react-redux'; + import Page from '../../components/page/www/page.jsx'; import render from '../../lib/render.jsx'; +import NotAvailable from '../../components/not-available/not-available.jsx'; + import StudioTabNav from './studio-tab-nav.jsx'; import StudioProjects from './studio-projects.jsx'; @@ -25,56 +30,68 @@ import { activity } from './lib/redux-modules'; -const {getInitialState, studioReducer} = require('../../redux/studio'); +const {getInitialState, studioReducer, selectStudioLoadFailed} = require('../../redux/studio'); const {studioReportReducer} = require('../../redux/studio-report'); const {commentsReducer} = require('../../redux/comments'); const {studioMutationsReducer} = require('../../redux/studio-mutations'); import './studio.scss'; -const StudioShell = () => { +const StudioShell = ({studioLoadFailed}) => { const match = useRouteMatch(); return ( -
-
- -
-
- -
- - - - - - - - - - - - - {/* We can force /projects back to / this way */} - - - - - - + studioLoadFailed ? + : +
+
+ +
+
+ +
+ + + + + + + + + + + + + {/* We can force /projects back to / this way */} + + + + + + +
-
); }; +StudioShell.propTypes = { + studioLoadFailed: PropTypes.bool +}; + +const ConnectedStudioShell = connect( + state => ({ + studioLoadFailed: selectStudioLoadFailed(state) + }), +)(StudioShell); + render( {/* Use variable studioPath to support /studio-playground/ or future route */} - +