From 1b1a8fe176eb5aad0f1a3be4084c464df75b4bb0 Mon Sep 17 00:00:00 2001
From: Matthias Hannig <matthias@hannig.cc>
Date: Tue, 26 Jun 2018 16:59:01 +0200
Subject: [PATCH 1/3] added content store and extension endpoint

---
 client/app.jsx                                | 12 +++++++
 client/components/config/reducer.jsx          |  3 +-
 client/components/content/actions.jsx         | 10 ++++++
 client/components/content/index.jsx           | 36 +++++++++++++++++++
 client/components/content/reducer.jsx         | 17 +++++++++
 client/components/sidebar/header/index.jsx    |  9 +++--
 .../components/sidebar/routeservers/index.jsx |  2 +-
 client/reducer/app-reducer.jsx                |  4 +++
 8 files changed, 88 insertions(+), 5 deletions(-)
 create mode 100644 client/components/content/actions.jsx
 create mode 100644 client/components/content/index.jsx
 create mode 100644 client/components/content/reducer.jsx

diff --git a/client/app.jsx b/client/app.jsx
index cde28b0..fcd1f3d 100644
--- a/client/app.jsx
+++ b/client/app.jsx
@@ -16,6 +16,9 @@ import { Component } from 'react'
 // Config
 import { configureAxios } from './config'
 
+// Content
+import { contentUpdate } from './components/content/actions'
+
 // Redux
 import { createStore, applyMiddleware } from 'redux'
 import { Provider } from 'react-redux'
@@ -56,6 +59,7 @@ const browserHistory = useRouterHistory(createHistory)({
   basename: '/alice'
 });
 
+
 // Setup application
 let store;
 const routerMiddleware = createRouterMiddleware(browserHistory);
@@ -73,6 +77,14 @@ if (window.NO_LOG) {
   ));
 }
 
+
+// Create extension endpoint:
+window.Alice = {
+  updateContent: (content) => {
+    store.dispatch(contentUpdate(content));    
+  }
+};
+
 const history = syncHistoryWithStore(browserHistory, store);
 
 // Setup axios
diff --git a/client/components/config/reducer.jsx b/client/components/config/reducer.jsx
index 6544392..77d1104 100644
--- a/client/components/config/reducer.jsx
+++ b/client/components/config/reducer.jsx
@@ -6,7 +6,8 @@ const initialState = {
     Interface: "interface",
     Metric: "metric",
   },
-  prefix_lookup_enabled: false
+  prefix_lookup_enabled: false,
+  content: {}
 };
 
 
diff --git a/client/components/content/actions.jsx b/client/components/content/actions.jsx
new file mode 100644
index 0000000..bd06322
--- /dev/null
+++ b/client/components/content/actions.jsx
@@ -0,0 +1,10 @@
+
+export const CONTENT_UPDATE = "@content/CONTENT_UPDATE";
+
+export function contentUpdate(content) {
+  return {
+    type: CONTENT_UPDATE,
+    payload: content
+  }
+}
+
diff --git a/client/components/content/index.jsx b/client/components/content/index.jsx
new file mode 100644
index 0000000..fffbf14
--- /dev/null
+++ b/client/components/content/index.jsx
@@ -0,0 +1,36 @@
+
+import react from 'react'
+import {connect} from 'react-redux'
+
+/*
+ * Content Component
+ */
+function contentComponent(props) {
+  if (!props.key) {
+    return null;
+  }
+
+  // Traverse content by key, if content is found
+  // return content, otherwise fall back to the default
+  let tokens = key.split(".");
+  let resolved = props.content;
+  for (let part of tokens) {
+    resolved = resolved[part];
+    if (!resolved) {
+      break;
+    }
+  }
+
+  if (!resolved) {
+    resolved = defaultValue; 
+  }
+
+  return (<span>{resolved}</span>);
+}
+
+export default connect(
+  (state) => ({
+    content: state.content
+  })
+)(contentComponent);
+
diff --git a/client/components/content/reducer.jsx b/client/components/content/reducer.jsx
new file mode 100644
index 0000000..555072e
--- /dev/null
+++ b/client/components/content/reducer.jsx
@@ -0,0 +1,17 @@
+/*
+ * Content reducer
+ */
+
+import {CONTENT_UPDATE} from './actions'
+
+const initialState = {};
+
+export default function reducer(state = initialState, action) {
+  switch(action.type) {
+    case CONTENT_UPDATE:
+      return Object.assign({}, state, action.payload);
+  }
+
+  return state;
+}
+
diff --git a/client/components/sidebar/header/index.jsx b/client/components/sidebar/header/index.jsx
index 21652ce..f0016db 100644
--- a/client/components/sidebar/header/index.jsx
+++ b/client/components/sidebar/header/index.jsx
@@ -2,18 +2,21 @@
 import React from 'react'
 import {Link} from 'react-router'
 
+import content from 'helpers/content'
+
 export default class SidebarHeader extends React.Component {
   render() {
     return (
       <div className="sidebar-header">
         <div className="logo">
           <Link to='/'>
-            <i className="fa fa-cloud"></i>
+            <i className={content("header.icon", "fa fa-cloud")}></i>
           </Link>
         </div>
         <div className="title">
-          <h1>Alice</h1>
-          <p>Your friendly bird looking glass</p>
+          <h1>{content("header.title", "Alice")}</h1>
+          <p>{content("header.tagline",
+                      "Your friendly bird looking glass")}</p>
         </div>
       </div>
     );
diff --git a/client/components/sidebar/routeservers/index.jsx b/client/components/sidebar/routeservers/index.jsx
index 9032836..8f3638f 100644
--- a/client/components/sidebar/routeservers/index.jsx
+++ b/client/components/sidebar/routeservers/index.jsx
@@ -39,7 +39,7 @@ class RouteserversList extends React.Component {
 
     return (
       <div className="routeservers-list">
-        <h2>Routeservers</h2>
+        <h2>route servers</h2>
         <ul> 
           {routeservers}
         </ul>
diff --git a/client/reducer/app-reducer.jsx b/client/reducer/app-reducer.jsx
index 0110f7b..ca4e25f 100644
--- a/client/reducer/app-reducer.jsx
+++ b/client/reducer/app-reducer.jsx
@@ -18,6 +18,9 @@ import errorsReducer
 import configReducer
   from 'components/config/reducer'
 
+import contentReducer
+  from 'components/content/reducer'
+
 import lookupReducer
 	from 'components/lookup/reducer'
 
@@ -28,5 +31,6 @@ export default combineReducers({
 	lookup:				 lookupReducer,
   errors:        errorsReducer,
   config:        configReducer,
+  content:       contentReducer,
 });
 

From 6d6c41409ac94ad2e915d162e6cb75bc8ecd30ea Mon Sep 17 00:00:00 2001
From: Matthias Hannig <matthias@hannig.cc>
Date: Tue, 26 Jun 2018 17:09:34 +0200
Subject: [PATCH 2/3] introduced content resolver

---
 client/components/content/index.jsx        | 13 ++++++++-----
 client/components/sidebar/header/index.jsx | 14 +++++++++-----
 2 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/client/components/content/index.jsx b/client/components/content/index.jsx
index fffbf14..8c48e90 100644
--- a/client/components/content/index.jsx
+++ b/client/components/content/index.jsx
@@ -1,13 +1,16 @@
 
-import react from 'react'
+import React from 'react'
 import {connect} from 'react-redux'
 
 /*
  * Content Component
  */
-function contentComponent(props) {
-  if (!props.key) {
-    return null;
+function ContentComponent(props) {
+  let key = props.id;
+  let defaultValue = props.children;
+
+  if (!key) {
+    return <span>{defaultValue}</span>;
   }
 
   // Traverse content by key, if content is found
@@ -32,5 +35,5 @@ export default connect(
   (state) => ({
     content: state.content
   })
-)(contentComponent);
+)(ContentComponent);
 
diff --git a/client/components/sidebar/header/index.jsx b/client/components/sidebar/header/index.jsx
index f0016db..2bbc3e4 100644
--- a/client/components/sidebar/header/index.jsx
+++ b/client/components/sidebar/header/index.jsx
@@ -2,7 +2,8 @@
 import React from 'react'
 import {Link} from 'react-router'
 
-import content from 'helpers/content'
+import Content from 'components/content'
+
 
 export default class SidebarHeader extends React.Component {
   render() {
@@ -10,13 +11,16 @@ export default class SidebarHeader extends React.Component {
       <div className="sidebar-header">
         <div className="logo">
           <Link to='/'>
-            <i className={content("header.icon", "fa fa-cloud")}></i>
+            <i className="fa fa-cloud"></i>
           </Link>
         </div>
         <div className="title">
-          <h1>{content("header.title", "Alice")}</h1>
-          <p>{content("header.tagline",
-                      "Your friendly bird looking glass")}</p>
+          <h1><Content id="header.title">Alice</Content></h1>
+          <p>
+            <Content id="header.tagline">
+              Your friendly bird looking glass.
+            </Content>
+          </p>
         </div>
       </div>
     );

From a6be2c99151a70bc5bbeb3285b00fa48302bb15a Mon Sep 17 00:00:00 2001
From: Matthias Hannig <matthias@hannig.cc>
Date: Tue, 26 Jun 2018 17:12:16 +0200
Subject: [PATCH 3/3] dynamic content for welcome screen

---
 client/components/welcome/index.jsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/client/components/welcome/index.jsx b/client/components/welcome/index.jsx
index beeb2e6..cf90adf 100644
--- a/client/components/welcome/index.jsx
+++ b/client/components/welcome/index.jsx
@@ -7,6 +7,8 @@ import PageHeader from 'components/page-header'
 import Lookup from 'components/lookup'
 import LookupSummary from 'components/lookup/results-summary'
 
+import Content from 'components/content'
+
 class LookupView extends React.Component {
   render() {
     if (this.props.enabled == false) {
@@ -42,8 +44,8 @@ export default class Welcome extends React.Component {
        <PageHeader></PageHeader>
 
        <div className="jumbotron">
-         <h1>Welcome to Alice!</h1>
-         <p>Your friendly bird looking glass</p>
+         <h1><Content id="welcome.title">Welcome to Alice!</Content></h1>
+         <p><Content id="welcome.tagline">Your friendly bird looking glass</Content></p>
        </div>
 
        <LookupPage />