diff --git a/helpers/handleShowRender.jsx b/helpers/handleShowRender.jsx
index 4b7b7c44..7e53bd54 100644
--- a/helpers/handleShowRender.jsx
+++ b/helpers/handleShowRender.jsx
@@ -12,6 +12,8 @@ import { call } from 'redux-saga/effects';
import { handleShowPageUri } from '../react/sagas/show_uri';
import { onHandleShowPageUri } from '../react/actions/show';
+import Helmet from 'react-helmet';
+
const returnSagaWithParams = (saga, params) => {
return function * () {
yield call(saga, params);
@@ -49,6 +51,9 @@ module.exports = (req, res) => {
);
+ // get head tags from helmet
+ const helmet = Helmet.renderStatic();
+
// check for a redirect
if (context.url) {
console.log('REDIRECTING:', context.url);
@@ -61,6 +66,6 @@ module.exports = (req, res) => {
const preloadedState = store.getState();
// send the rendered page back to the client
- res.send(renderFullPage(html, preloadedState));
+ res.send(renderFullPage(helmet, html, preloadedState));
});
};
diff --git a/helpers/renderFullPage.js b/helpers/renderFullPage.js
index ee5fb732..4c5089ad 100644
--- a/helpers/renderFullPage.js
+++ b/helpers/renderFullPage.js
@@ -1,6 +1,4 @@
-const { site } = require('../config/speechConfig.js');
-
-module.exports = (html, preloadedState) => {
+module.exports = (helmet, html, preloadedState) => {
// take the html and preloadedState and return the full page
return `
@@ -9,7 +7,10 @@ module.exports = (html, preloadedState) => {
-
${site.title}
+
+ ${helmet.title.toString()}
+ ${helmet.link.toString()}
+
diff --git a/package.json b/package.json
index 9f504d0f..77bc1322 100644
--- a/package.json
+++ b/package.json
@@ -48,6 +48,7 @@
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-ga": "^2.4.1",
+ "react-helmet": "^5.2.0",
"react-redux": "^5.0.6",
"react-router-dom": "^4.2.2",
"redux": "^3.7.2",
diff --git a/react/api/channelApi.js b/react/api/channelApi.js
index ddc25c05..859af0c7 100644
--- a/react/api/channelApi.js
+++ b/react/api/channelApi.js
@@ -1,5 +1,4 @@
-import Request from 'utils/request';
-import request from '../utils/request';
+import request from 'utils/request';
const { site: { host } } = require('../../config/speechConfig.js');
export function getChannelData (name, id) {
@@ -12,6 +11,6 @@ export function getChannelData (name, id) {
export function getChannelClaims (name, longId, page) {
console.log('getting channel claims for channel:', name, longId);
if (!page) page = 1;
- const url = `${host}/api/channel/claims/${name}/${longId}/${page}`;
+ const url = `/api/channel/claims/${name}/${longId}/${page}`;
return Request(url);
};
diff --git a/react/app.js b/react/app.js
index 212713c0..8c8e00ff 100644
--- a/react/app.js
+++ b/react/app.js
@@ -1,6 +1,6 @@
import React from 'react';
import { Route, Switch } from 'react-router-dom';
-import PublishPage from 'components/PublishPage';
+import HomePage from 'components/HomePage';
import AboutPage from 'components/AboutPage';
import LoginPage from 'containers/LoginPage';
import ShowPage from 'containers/ShowPage';
@@ -9,7 +9,7 @@ import FourOhFourPage from 'components/FourOhFourPage';
const App = () => {
return (
-
+
diff --git a/react/components/AboutPage/index.js b/react/components/AboutPage/index.js
index ee425186..566dd94c 100644
--- a/react/components/AboutPage/index.js
+++ b/react/components/AboutPage/index.js
@@ -1,10 +1,17 @@
import React from 'react';
import NavBar from 'containers/NavBar';
+import Helmet from 'react-helmet';
+
+const { site: { title, host } } = require('../../../config/speechConfig.js');
class AboutPage extends React.Component {
render () {
return (
+
+ {title} - About
+
+
diff --git a/react/components/FourOhFourPage/index.js b/react/components/FourOhFourPage/index.js
index 20e9c9ca..0c2a3c12 100644
--- a/react/components/FourOhFourPage/index.js
+++ b/react/components/FourOhFourPage/index.js
@@ -1,10 +1,16 @@
import React from 'react';
import NavBar from 'containers/NavBar';
+import Helmet from 'react-helmet';
+const { site: { title, host } } = require('../../../config/speechConfig.js');
class FourOhForPage extends React.Component {
render () {
return (
+
+ {title} - 404
+
+
404
diff --git a/react/components/PublishPage/index.js b/react/components/HomePage/index.js
similarity index 55%
rename from react/components/PublishPage/index.js
rename to react/components/HomePage/index.js
index d803eb06..57331257 100644
--- a/react/components/PublishPage/index.js
+++ b/react/components/HomePage/index.js
@@ -1,11 +1,18 @@
import React from 'react';
+import Helmet from 'react-helmet';
import NavBar from 'containers/NavBar';
import PublishTool from 'containers/PublishTool';
-class PublishPage extends React.Component {
+const { site: { title, host } } = require('../../../config/speechConfig.js');
+
+class HomePage extends React.Component {
render () {
return (
+
+ {title}
+
+
@@ -15,4 +22,4 @@ class PublishPage extends React.Component {
}
};
-export default PublishPage;
+export default HomePage;
diff --git a/react/components/ShowAssetDetails/view.jsx b/react/components/ShowAssetDetails/view.jsx
index 42047032..3ee78911 100644
--- a/react/components/ShowAssetDetails/view.jsx
+++ b/react/components/ShowAssetDetails/view.jsx
@@ -1,37 +1,52 @@
import React from 'react';
+import Helmet from 'react-helmet';
import NavBar from 'containers/NavBar';
import ErrorPage from 'components/ErrorPage';
import AssetTitle from 'components/AssetTitle';
import AssetDisplay from 'components/AssetDisplay';
import AssetInfo from 'components/AssetInfo';
+const { site: { title, host } } = require('../../../config/speechConfig.js');
+
class ShowAssetDetails extends React.Component {
render () {
const { asset } = this.props;
+ let channelName, certificateId, name, claimId;
+ if (asset.claimData) {
+ ({ channelName, certificateId, name, claimId } = asset.claimData);
+ };
if (asset) {
return (
-
-
-
+
+ {title} - {name} - details
+ {channelName ? (
+
+ ) : (
+
+ )}
+
+
+
+
-
);
};
return (
-
+
);
}
};
diff --git a/react/components/ShowAssetLite/view.jsx b/react/components/ShowAssetLite/view.jsx
index e8567fbc..e919b35d 100644
--- a/react/components/ShowAssetLite/view.jsx
+++ b/react/components/ShowAssetLite/view.jsx
@@ -1,19 +1,38 @@
import React from 'react';
+import Helmet from 'react-helmet';
import { Link } from 'react-router-dom';
import AssetDisplay from 'components/AssetDisplay';
+const { site: { title, host } } = require('../../../config/speechConfig.js');
+
class ShowLite extends React.Component {
render () {
const { asset } = this.props;
- return (
-
- { (asset) &&
-
-
-
hosted via Spee.ch
+ if (asset) {
+ let channelName, certificateId, name, claimId, fileExt;
+ if (asset.claimData) {
+ ({ channelName, certificateId, name, claimId, fileExt } = asset.claimData);
+ };
+ return (
+
+
+ {title} - {name}
+ {channelName ? (
+
+ ) : (
+
+ )}
+
+
+
+
hosted
+ via Spee.ch
+
- }
-
+ );
+ }
+ return (
+
loading asset data...
);
}
};
diff --git a/react/components/ShowChannel/view.jsx b/react/components/ShowChannel/view.jsx
index 3867cde2..a328cc13 100644
--- a/react/components/ShowChannel/view.jsx
+++ b/react/components/ShowChannel/view.jsx
@@ -1,8 +1,11 @@
import React from 'react';
+import Helmet from 'react-helmet';
import ErrorPage from 'components/ErrorPage';
import NavBar from 'containers/NavBar';
import ChannelClaimsDisplay from 'containers/ChannelClaimsDisplay';
+const { site: { title, host } } = require('../../../config/speechConfig.js');
+
class ShowChannel extends React.Component {
render () {
const { channel } = this.props;
@@ -10,14 +13,18 @@ class ShowChannel extends React.Component {
const { name, longId, shortId } = channel;
return (
-
-
-
+
+ {title} - {name}
+
+
+
+
+
channel name: {name || 'loading...'}
full channel id: {longId || 'loading...'}
short channel id: {shortId || 'loading...'}
-
@@ -25,7 +32,7 @@ class ShowChannel extends React.Component {
);
};
return (
-
+
);
}
};
diff --git a/react/containers/LoginPage/view.jsx b/react/containers/LoginPage/view.jsx
index dea4f950..b984265f 100644
--- a/react/containers/LoginPage/view.jsx
+++ b/react/containers/LoginPage/view.jsx
@@ -1,10 +1,13 @@
import React from 'react';
import { withRouter } from 'react-router-dom';
+import Helmet from 'react-helmet';
import NavBar from 'containers/NavBar';
import ChannelLoginForm from 'containers/ChannelLoginForm';
import ChannelCreateForm from 'containers/ChannelCreateForm';
-class PublishPage extends React.Component {
+const { site: { title, host } } = require('../../../config/speechConfig.js');
+
+class LoginPage extends React.Component {
componentWillReceiveProps (newProps) {
// re-route the user to the homepage if the user is logged in
if (newProps.loggedInChannelName !== this.props.loggedInChannelName) {
@@ -15,24 +18,28 @@ class PublishPage extends React.Component {
render () {
return (
-
-
-
-
-
Channels allow you to publish and group content under an identity. You can create a channel for yourself, or share one with like-minded friends. You can create 1 channel, or 100, so whether you're documenting important events , or making a public repository for cat gifs (password: '1234'), try creating a channel for it!
+
+ {title} - Login
+
+
+
+
+
+
+
Channels allow you to publish and group content under an identity. You can create a channel for yourself, or share one with like-minded friends. You can create 1 channel, or 100, so whether you're documenting important events , or making a public repository for cat gifs (password: '1234'), try creating a channel for it!
+
+
+
+
Log in to an existing channel:
+
+ Create a brand new channel:
+
-
-
-
Log in to an existing channel:
-
- Create a brand new channel:
-
-
);
}
};
-export default withRouter(PublishPage);
+export default withRouter(LoginPage);