frontend. export/view button. interactivity sanity check

1 files changed, 16 insertions, 2 deletions

diff --git a/frontend/app/views/page/components/page.header.js b/frontend/app/views/page/components/page.header.js
index 998572a..dbdf1b6 100644
--- a/frontend/app/views/page/components/page.header.js
+++ b/frontend/app/views/page/components/page.header.js
@@ -3,6 +3,9 @@ import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
 import { Link } from 'react-router-dom'
 
+import { Loader } from 'app/common'
+import { capitalize } from 'app/utils'
+
 import * as graphActions from '../../graph/graph.actions'
 import * as pageActions from '../page.actions'
 
@@ -10,13 +13,22 @@ function PageHeader(props) {
   return (
     <header>
       <div>
-        <Link to={props.graph.show.res ? "/" + props.graph.show.res.path : "/"} className="logo arrow">{"◁"}</Link>
+        <Link to={props.graph ? "/" + props.graph.path : "/"} className="logo arrow">{"◁"}</Link>
         <b>{props.site.siteTitle}</b>
+        {props.building && (
+          <div className='building'>
+            <div className='loader'>
+              <Loader />
+            </div>
+            {capitalize(props.building)}ing...
+          </div>
+        )}
       </div>
       <div>
         <button onClick={() => props.pageActions.toggleAddTileForm()}>+ Add tile</button>
         <button onClick={() => props.pageActions.toggleTileList()}>Sort tiles</button>
         <button onClick={() => props.graphActions.toggleEditPageForm()}>Edit page</button>
+        <button onClick={() => props.graphActions.viewPage(props.graph, props.page)}>View page</button>
       </div>
     </header>
   )
@@ -25,7 +37,9 @@ function PageHeader(props) {
 const mapStateToProps = (state) => ({
   // auth: state.auth,
   site: state.site,
-  graph: state.graph,
+  graph: state.graph.show.res,
+  page: state.page.show.res,
+  building: state.graph.editor.building,
   // isAuthenticated: state.auth.isAuthenticated,
 })