Merge pull request #1262 from appirio-tech/feature/sync-url-change-for-logged-in-user

Github issue#1234, Functions of the "Connect Logo", "Back", "Esc" buttons in logged in and logged out states

Author: vikasrohit

src/projects/create/components/FillProjectDetails.js

@@ -1,10 +1,8 @@
 import _ from 'lodash'
 import React, { PropTypes as PT, Component } from 'react'
-import { Link } from 'react-router'
 import Sticky from 'react-stickynode'
 
 import config from '../../../config/projectWizard'
-import SVGIconImage from '../../../components/SVGIconImage'
 import './FillProjectDetails.scss'
 import ProjectBasicDetailsForm from '../components/ProjectBasicDetailsForm'
 import ProjectOutline from '../components/ProjectOutline'
@@ -34,9 +32,7 @@ class FillProjectDetails extends Component  {
   }
 
   render() {
-    const { project, dirtyProject, processing, submitBtnText, userRoles } = this.props
-    const isLoggedIn = userRoles && userRoles.length
-    const logoTargetUrl = isLoggedIn ? '/projects' : '/'
+    const { project, dirtyProject, processing, submitBtnText } = this.props
     const product = _.get(project, 'details.products[0]')
     const projectTypeId = _.get(project, 'type')
     const subConfig = config[_.findKey(config, {id : projectTypeId})]
@@ -49,8 +45,6 @@ class FillProjectDetails extends Component  {
     return (
       <div className="FillProjectDetailsWrapper">
         <div className="header headerFillProjectDetails">
-          { !isLoggedIn && <Link className="logo" to={logoTargetUrl} target="_self"><SVGIconImage filePath="connect-logo-mono" className="connectLogo"/></Link>}
-          { !isLoggedIn && <button className="tc-btn tc-btn-default tc-btn-sm" onClick={ this.props.onChangeProjectType }><SVGIconImage filePath="arrows-undo" />Change project type</button> }
         </div>
         <div className="FillProjectDetails">
           <div className="header">

src/projects/create/components/IncompleteProjectConfirmation.js

@@ -1,15 +1,13 @@
 import React, { PropTypes as PT } from 'react'
-import { Link } from 'react-router'
 import SVGIconImage from '../../../components/SVGIconImage'
 import './IncompleteProjectConfirmation.scss'
 
-function IncompleteProjectConfirmation({ loadIncompleteProject, removeIncompleteProject, userRoles }) {
-  const isLoggedIn = userRoles && userRoles.length
-  const logoTargetUrl = isLoggedIn ? '/projects' : '/'
+function IncompleteProjectConfirmation({ loadIncompleteProject, removeIncompleteProject }) {
+  // const isLoggedIn = userRoles && userRoles.length
   return (
     <div className="IncompleteProjectConfirmation">
       <div className="header">
-        { !isLoggedIn && <Link className="logo" to={logoTargetUrl} target="_self"><SVGIconImage filePath="connect-logo-mono" className="connectLogo"/></Link>}
+        <SVGIconImage filePath="connect-logo-mono" className="connectLogo"/>
       </div>
       <h3>Welcome back!</h3>
       <h5>You started a project with us recently.</h5>

src/projects/create/components/ProjectWizard.jsx

@@ -385,7 +385,7 @@ class ProjectWizard extends Component {
         onCancel={this.handleWizardCancel}
         onStepChange={ this.handleStepChange }
         step={this.state.wizardStep}
-        shouldRenderBackButton={ (step) => userRoles && userRoles.length && step > 1 }
+        shouldRenderBackButton={ (step) => step > 1 }
       >
         <IncompleteProjectConfirmation
           loadIncompleteProject={ this.loadIncompleteProject }

src/projects/create/components/SelectProduct.js

@@ -1,15 +1,12 @@
 import React, { PropTypes as PT } from 'react'
-import { Link } from 'react-router'
 import config from '../../../config/projectWizard'
 import ProductCard from './ProductCard'
 import SVGIconImage from '../../../components/SVGIconImage'
 import { findCategory } from '../../../config/projectWizard'
 import './SelectProduct.scss'
 
 function SelectProduct(props) {
-  const { userRoles, projectType, onChangeProjectType } = props
-  const isLoggedIn = userRoles && userRoles.length
-  const logoTargetUrl = isLoggedIn ? '/projects' : '/'
+  const { projectType } = props
   const cards = []
   for (const key in config) {
     const type = config[key]
@@ -36,8 +33,6 @@ function SelectProduct(props) {
   return (
     <div>
       <div className="header headerSelectProduct">
-        { !isLoggedIn && <Link className="logo" to={logoTargetUrl} target="_self"><SVGIconImage filePath="connect-logo-mono" className="connectLogo"/></Link>}
-        { !isLoggedIn && <button className="tc-btn tc-btn-default tc-btn-sm" onClick={ onChangeProjectType }><SVGIconImage filePath="arrows-undo" />Change project type</button> }
       </div>
       <div className="SelectProduct">
         <h1> { projectCategory.name } projects </h1>

src/projects/create/components/SelectProjectType.jsx

@@ -1,15 +1,11 @@
 import React, { PropTypes as PT } from 'react'
-import { Link } from 'react-router'
 import config from '../../../config/projectWizard'
 import ProjectTypeCard from './ProjectTypeCard'
 import SVGIconImage from '../../../components/SVGIconImage'
 import { findProductsOfCategory } from '../../../config/projectWizard'
 import './SelectProjectType.scss'
 
 function SelectProjectType(props) {
-  const { userRoles } = props
-  const isLoggedIn = userRoles && userRoles.length
-  const logoTargetUrl = isLoggedIn ? '/projects' : '/'
   const cards = []
   for (const key in config) {
     const item = config[key]
@@ -32,7 +28,7 @@ function SelectProjectType(props) {
   return (
     <div>
       <div className="header headerSelectProjectType">
-        { !isLoggedIn && <Link className="logo" to={logoTargetUrl} target="_self"><SVGIconImage filePath="connect-logo-mono" className="connectLogo"/></Link>}
+        <SVGIconImage filePath="connect-logo-mono" className="connectLogo"/>
       </div>
       <div className="SelectProjectType">
         <h1>Create a new project</h1>

src/projects/create/components/_layout.scss

@@ -29,6 +29,7 @@ $minimumPageWidth: 984px;
   display: flex;
   justify-content: space-between;
   margin: 20px 0 0;
+  height: 43px;
 
   button {
     align-self: flex-start;

src/projects/create/containers/CreateContainer.jsx

@@ -148,7 +148,9 @@ class CreateConainer extends React.Component {
     if (isLoggedIn) {
       this.props.router.push('/projects')
     } else {
-      this.props.router.push('/')
+      // this.props.router.push('/')
+      // FIXME ideally we should push on router
+      window.location = window.location.origin
     }
   }