Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added state to plugins configuration scope #1432

Merged
merged 1 commit into from
Feb 10, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 11 additions & 4 deletions web/client/components/plugins/PluginsContainer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ const PluginsUtils = require('../../utils/PluginsUtils');

const assign = require('object-assign');

const {get} = require('lodash');

const PluginsContainer = React.createClass({
propTypes: {
mode: React.PropTypes.string,
Expand All @@ -21,7 +23,8 @@ const PluginsContainer = React.createClass({
className: React.PropTypes.string,
style: React.PropTypes.object,
pluginsState: React.PropTypes.object,
defaultMode: React.PropTypes.string
defaultMode: React.PropTypes.string,
stateSelector: React.PropTypes.func
},
getDefaultProps() {
return {
Expand All @@ -33,7 +36,8 @@ const PluginsContainer = React.createClass({
id: "plugins-container",
className: "plugins-container",
style: {},
pluginsState: {}
pluginsState: {},
stateSelector: () => ({})
};
},
getInitialState() {
Expand All @@ -47,8 +51,11 @@ const PluginsContainer = React.createClass({
componentWillReceiveProps(newProps) {
this.loadPlugins(newProps.pluginsState);
},
getState(path) {
return this.props.stateSelector(path) || get(this.props.params, path);
},
getPluginDescriptor(plugin) {
return PluginsUtils.getPluginDescriptor(this.props.plugins,
return PluginsUtils.getPluginDescriptor(this.getState, this.props.plugins,
this.props.pluginsConfig[this.props.mode], plugin, this.state.loadedPlugins);
},
renderPlugins(plugins) {
Expand Down Expand Up @@ -78,7 +85,7 @@ const PluginsContainer = React.createClass({
},
loadPlugins(state) {
(this.props.pluginsConfig && this.props.pluginsConfig[this.props.mode] || [])
.map((plugin) => PluginsUtils.getPluginDescriptor(this.props.plugins,
.map((plugin) => PluginsUtils.getPluginDescriptor(this.getState, this.props.plugins,
this.props.pluginsConfig[this.props.mode], plugin, this.state.loadedPlugins))
.filter((plugin) => plugin.impl.loadPlugin).forEach((plugin) => {
if (!this.state.loadedPlugins[plugin.name]) {
Expand Down
7 changes: 5 additions & 2 deletions web/client/containers/Embedded.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,14 @@ const {connect} = require('react-redux');

const url = require('url');
const urlQuery = url.parse(window.location.href, true).query;

const {get} = require('lodash');

const PluginsContainer = connect((state) => ({
mode: (urlQuery.mode || (state.browser && state.browser.mobile ? 'mobile' : 'desktop')),
pluginsState: state && state.controls || {}
pluginsState: state && state.controls || {},
stateSelector: (path) => {
return get(state, path);
}
}))(require('../components/plugins/PluginsContainer'));

const Embedded = React.createClass({
Expand Down
7 changes: 6 additions & 1 deletion web/client/containers/MapViewer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,15 @@ const urlQuery = url.parse(window.location.href, true).query;

const ConfigUtils = require('../utils/ConfigUtils');

const {get} = require('lodash');

const PluginsContainer = connect((state) => ({
pluginsConfig: state.plugins || ConfigUtils.getConfigProp('plugins') || null,
mode: (urlQuery.mode || (state.browser && state.browser.mobile ? 'mobile' : 'desktop')),
pluginsState: state && state.controls || {}
pluginsState: state && state.controls || {},
stateSelector: (path) => {
return get(state, path);
}
}))(require('../components/plugins/PluginsContainer'));

const MapViewer = React.createClass({
Expand Down
6 changes: 5 additions & 1 deletion web/client/containers/Page.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,13 @@ const {connect} = require('react-redux');

const url = require('url');
const urlQuery = url.parse(window.location.href, true).query;
const {get} = require('lodash');

const PluginsContainer = connect((state) => ({
mode: urlQuery.mode || ((urlQuery.mobile || (state.browser && state.browser.mobile)) ? 'mobile' : 'desktop')
mode: urlQuery.mode || ((urlQuery.mobile || (state.browser && state.browser.mobile)) ? 'mobile' : 'desktop'),
stateSelector: (path) => {
return get(state, path);
}
}))(require('../components/plugins/PluginsContainer'));

const Page = React.createClass({
Expand Down
6 changes: 5 additions & 1 deletion web/client/examples/plugins/app.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,13 @@ const startApp = () => {
const {loadMapConfig} = require('../../actions/config');
const {loadLocale} = require('../../actions/locale');
const {loadPrintCapabilities} = require('../../actions/print');
const {get} = require('lodash');

const PluginsContainer = connect((state) => ({
pluginsState: state && state.controls || {}
pluginsState: state && state.controls || {},
stateSelector: (path) => {
return get(state, path);
}
}))(require('../../components/plugins/PluginsContainer'));

const {plugins} = require('./plugins');
Expand Down
62 changes: 31 additions & 31 deletions web/client/utils/PluginsUtils.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,32 @@ const getMorePrioritizedContainer = (pluginImpl, plugins, priority) => {
}, {plugin: null, priority: priority});
};

const getPluginItems = (plugins, pluginsConfig, name, id, isDefault, loadedPlugins) => {
/*eslint-disable */
const parseExpression = (state, requires, value) => {
const searchExpression = /^\{(.*?)\}$/;
const context = requires || {};
const expression = searchExpression.exec(value);
if (expression !== null) {
return eval(expression[1]);
}
return value;
};
/*eslint-enable */

const parsePluginConfig = (state, requires, cfg) => {
if (isArray(cfg)) {
return cfg.map((value) => parsePluginConfig(state, requires, value));
}
if (isObject(cfg)) {
return Object.keys(cfg).reduce((previous, current) => {
const value = cfg[current];
return assign(previous, {[current]: parsePluginConfig(state, requires, value)});
}, {});
}
return parseExpression(state, requires, cfg);
};

const getPluginItems = (state, plugins, pluginsConfig, name, id, isDefault, loadedPlugins) => {
return Object.keys(plugins)
.filter((plugin) => plugins[plugin][name])
.filter((plugin) => {
Expand All @@ -61,40 +86,15 @@ const getPluginItems = (plugins, pluginsConfig, name, id, isDefault, loadedPlugi
item,
pluginCfg.override && pluginCfg.override[name] || {},
{
cfg: pluginCfg && pluginCfg.cfg || undefined
cfg: pluginCfg && parsePluginConfig(state, plugins.requires, pluginCfg.cfg || {}) || undefined
},
{
plugin: pluginImpl,
items: getPluginItems(plugins, pluginsConfig, pluginName, null, true, loadedPlugins)
items: getPluginItems(state, plugins, pluginsConfig, pluginName, null, true, loadedPlugins)
});
});
};

/*eslint-disable */
const parseExpression = (requires, value) => {
const searchExpression = /^\{(.*?)\}$/;
const context = requires || {};
const expression = searchExpression.exec(value);
if (expression !== null) {
return eval(expression[1]);
}
return value;
};
/*eslint-enable */


const parsePluginConfig = (requires, cfg) => {
if (isArray(cfg)) {
return cfg.map((value) => parsePluginConfig(requires, value));
}
if (isObject(cfg)) {
return Object.keys(cfg).reduce((previous, current) => {
const value = cfg[current];
return assign(previous, {[current]: parsePluginConfig(requires, value)});
}, {});
}
return parseExpression(requires, cfg);
};
const getReducers = (plugins) => Object.keys(plugins).map((name) => plugins[name].reducers)
.reduce((previous, current) => assign({}, previous, current), {});

Expand All @@ -106,7 +106,7 @@ const PluginsUtils = {
getReducers,
getPlugins: (plugins) => Object.keys(plugins).map((name) => plugins[name])
.reduce((previous, current) => assign({}, previous, omit(current, 'reducers')), {}),
getPluginDescriptor: (plugins, pluginsConfig, pluginDef, loadedPlugins = {}) => {
getPluginDescriptor: (state, plugins, pluginsConfig, pluginDef, loadedPlugins = {}) => {
const name = isObject(pluginDef) ? pluginDef.name : pluginDef;
const id = isObject(pluginDef) ? pluginDef.id : null;
const stateSelector = isObject(pluginDef) ? pluginDef.stateSelector : id || undefined;
Expand All @@ -120,8 +120,8 @@ const PluginsUtils = {
id: id || name,
name,
impl: includeLoaded(name, loadedPlugins, (impl.loadPlugin || impl.displayName) ? impl : impl(stateSelector)),
cfg: isObject(pluginDef) ? parsePluginConfig(plugins.requires, pluginDef.cfg) : {},
items: getPluginItems(plugins, pluginsConfig, name, id, isDefault, loadedPlugins)
cfg: isObject(pluginDef) ? parsePluginConfig(state, plugins.requires, pluginDef.cfg) : {},
items: getPluginItems(state, plugins, pluginsConfig, name, id, isDefault, loadedPlugins)
};
},
getMorePrioritizedContainer
Expand Down