fix submit page issue

src/shared/containers/SubmissionPage.jsx

@@ -7,6 +7,7 @@
  *   Passes the relevent state and setters as properties to the UI components.
  */
 import actions from 'actions/page/submission';
+import { actions as api } from 'topcoder-react-lib';
 import { isMM } from 'utils/challenge';
 import communityActions from 'actions/tc-communities';
 import { PrimaryButton } from 'topcoder-react-ui-kit';
@@ -16,6 +17,7 @@ import PT from 'prop-types';
 import { connect } from 'react-redux';
 import SubmissionsPage from 'components/SubmissionPage';
 import AccessDenied, { CAUSE as ACCESS_DENIED_REASON } from 'components/tc-communities/AccessDenied';
+import LoadingIndicator from 'components/LoadingIndicator';
 
 /**
  * SubmissionsPage Container
@@ -30,8 +32,15 @@ class SubmissionsPageContainer extends React.Component {
     const {
       auth,
       getCommunitiesList,
+      challengeId,
+      loadChallengeDetails,
+      challengeName,
     } = this.props;
 
+    if (!challengeName) {
+      loadChallengeDetails(auth, challengeId);
+    }
+
     getCommunitiesList(auth);
   }
 
@@ -54,9 +63,14 @@ class SubmissionsPageContainer extends React.Component {
     const {
       isRegistered,
       challengeId,
+      challengeName,
     } = this.props;
 
-    if (!isRegistered) {
+    if (!challengeName) {
+      return <LoadingIndicator />;
+    }
+
+    if (!isRegistered && challengeName) {
       return (
         <React.Fragment>
           <AccessDenied cause={ACCESS_DENIED_REASON.NOT_AUTHORIZED}>
@@ -110,7 +124,7 @@ SubmissionsPageContainer.propTypes = {
   tokenV2: PT.string.isRequired,
   tokenV3: PT.string.isRequired,
   submit: PT.func.isRequired,
-  challengeId: PT.number.isRequired,
+  challengeId: PT.string.isRequired,
   track: PT.string.isRequired,
   challenge: PT.shape().isRequired,
   status: PT.string.isRequired,
@@ -139,6 +153,7 @@ SubmissionsPageContainer.propTypes = {
   setSubmissionFilestackData: PT.func.isRequired,
   submissionFilestackData: filestackDataProp.isRequired,
   winners: PT.arrayOf(PT.object).isRequired,
+  loadChallengeDetails: PT.func.isRequired,
 };
 
 /**
@@ -150,22 +165,23 @@ SubmissionsPageContainer.propTypes = {
  */
 const mapStateToProps = (state, ownProps) => {
   const { submission } = state.page;
+  const details = state.challenge.details || {};
   return {
     auth: state.auth,
-    phases: state.challenge.details.phases || [],
+    phases: details.phases || [],
     communitiesList: state.tcCommunities.list,
     /* Older stuff below. */
     userId: state.auth.user ? state.auth.user.userId : '',
-    challengeId: state.challenge.details.id,
-    challengeName: state.challenge.details.name,
+    challengeId: String(ownProps.match.params.challengeId),
+    challengeName: details.name,
     challengesUrl: ownProps.challengesUrl,
     tokenV2: state.auth.tokenV2,
     tokenV3: state.auth.tokenV3,
-    track: state.challenge.details.legacy.track,
+    track: details.legacy ? details.legacy.track : '',
     challenge: state.challenge,
-    status: state.challenge.details.status,
-    isRegistered: state.challenge.details.isRegistered,
-    groups: state.challenge.details.groups,
+    status: details.status,
+    isRegistered: details.isRegistered,
+    groups: details.groups,
     isSubmitting: submission.isSubmitting,
     submitDone: submission.submitDone,
     errorMsg: submission.submitErrorMsg,
@@ -174,7 +190,7 @@ const mapStateToProps = (state, ownProps) => {
     filePickers: submission.filePickers,
     notesLength: submission.notesLength,
     submissionFilestackData: submission.submissionFilestackData,
-    winners: state.challenge.details.winners,
+    winners: details.winners,
   };
 };
 
@@ -209,6 +225,11 @@ function mapDispatchToProps(dispatch) {
     setFilePickerUploadProgress: (id, p) => dispatch(a.setFilePickerUploadProgress(id, p)),
     updateNotesLength: length => dispatch(a.updateNotesLength(length)),
     setSubmissionFilestackData: (id, data) => dispatch(a.setSubmissionFilestackData(id, data)),
+    loadChallengeDetails: (tokens, challengeId) => {
+      const challengeAction = api.challenge;
+      dispatch(challengeAction.getDetailsInit(challengeId));
+      dispatch(challengeAction.getDetailsDone(challengeId, tokens.tokenV3, tokens.tokenV2));
+    },
   };
 }