From 2eeb662ce2b138f07fbfe8354f64d3921a458383 Mon Sep 17 00:00:00 2001 From: Boaz Poolman Date: Sat, 20 Mar 2021 00:54:18 +0100 Subject: [PATCH] Initial frontend setup --- admin/src/components/.gitkeep | 0 admin/src/config/constants.js | 1 + admin/src/config/logger.js | 8 +++ admin/src/containers/App/index.js | 15 ++--- admin/src/containers/ConfigPage/index.js | 7 +++ admin/src/containers/HomePage/index.js | 20 ------- admin/src/containers/Initializer/index.js | 2 +- admin/src/helpers/configureStore.js | 67 +++++++++++++++++++++++ admin/src/{ => helpers}/pluginId.js | 2 +- admin/src/index.js | 42 +++++++------- admin/src/lifecycles.js | 3 - admin/src/state/actions/Config.js | 16 ++++++ admin/src/state/reducers/Config/index.js | 20 +++++++ admin/src/state/reducers/index.js | 8 +++ admin/src/translations/en.json | 4 +- admin/src/utils/getTrad.js | 5 -- 16 files changed, 162 insertions(+), 58 deletions(-) create mode 100644 admin/src/components/.gitkeep create mode 100644 admin/src/config/constants.js create mode 100755 admin/src/config/logger.js create mode 100644 admin/src/containers/ConfigPage/index.js delete mode 100644 admin/src/containers/HomePage/index.js create mode 100755 admin/src/helpers/configureStore.js rename admin/src/{ => helpers}/pluginId.js (65%) delete mode 100644 admin/src/lifecycles.js create mode 100644 admin/src/state/actions/Config.js create mode 100644 admin/src/state/reducers/Config/index.js create mode 100644 admin/src/state/reducers/index.js delete mode 100644 admin/src/utils/getTrad.js diff --git a/admin/src/components/.gitkeep b/admin/src/components/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/admin/src/config/constants.js b/admin/src/config/constants.js new file mode 100644 index 0000000..1d32254 --- /dev/null +++ b/admin/src/config/constants.js @@ -0,0 +1 @@ +export const __DEBUG__ = strapi.env === 'development'; diff --git a/admin/src/config/logger.js b/admin/src/config/logger.js new file mode 100755 index 0000000..e6cd0eb --- /dev/null +++ b/admin/src/config/logger.js @@ -0,0 +1,8 @@ +const config = { + blacklist: [ + 'REDUX_STORAGE_SAVE', + 'REDUX_STORAGE_LOAD', + ], +}; + +export default config; diff --git a/admin/src/containers/App/index.js b/admin/src/containers/App/index.js index 9755fb0..7ff148f 100644 --- a/admin/src/containers/App/index.js +++ b/admin/src/containers/App/index.js @@ -8,19 +8,20 @@ import React from 'react'; import { Switch, Route } from 'react-router-dom'; import { NotFound } from 'strapi-helper-plugin'; -// Utils -import pluginId from '../../pluginId'; -// Containers -import HomePage from '../HomePage'; +import { Provider } from 'react-redux'; + +import { store } from "../../helpers/configureStore"; +import pluginId from '../../helpers/pluginId'; +import ConfigPage from '../ConfigPage'; const App = () => { return ( -
+ - + -
+ ); }; diff --git a/admin/src/containers/ConfigPage/index.js b/admin/src/containers/ConfigPage/index.js new file mode 100644 index 0000000..eb3f0db --- /dev/null +++ b/admin/src/containers/ConfigPage/index.js @@ -0,0 +1,7 @@ +import React from 'react'; + +const ConfigPage = () => { + return
Config diff
+} + +export default ConfigPage; \ No newline at end of file diff --git a/admin/src/containers/HomePage/index.js b/admin/src/containers/HomePage/index.js deleted file mode 100644 index 05c5a6a..0000000 --- a/admin/src/containers/HomePage/index.js +++ /dev/null @@ -1,20 +0,0 @@ -/* - * - * HomePage - * - */ - -import React, { memo } from 'react'; -// import PropTypes from 'prop-types'; -import pluginId from '../../pluginId'; - -const HomePage = () => { - return ( -
-

{pluginId}'s HomePage

-

Happy coding

-
- ); -}; - -export default memo(HomePage); diff --git a/admin/src/containers/Initializer/index.js b/admin/src/containers/Initializer/index.js index 06b5488..83cc4ef 100644 --- a/admin/src/containers/Initializer/index.js +++ b/admin/src/containers/Initializer/index.js @@ -6,7 +6,7 @@ import { useEffect, useRef } from 'react'; import PropTypes from 'prop-types'; -import pluginId from '../../pluginId'; +import pluginId from '../../helpers/pluginId'; const Initializer = ({ updatePlugin }) => { const ref = useRef(); diff --git a/admin/src/helpers/configureStore.js b/admin/src/helpers/configureStore.js new file mode 100755 index 0000000..bd0fc8e --- /dev/null +++ b/admin/src/helpers/configureStore.js @@ -0,0 +1,67 @@ +import { createStore, applyMiddleware, compose } from 'redux'; +import { createLogger } from 'redux-logger'; +import thunkMiddleware from 'redux-thunk'; +import { Map } from 'immutable'; + +import rootReducer from '../state/reducers'; +import loggerConfig from '../config/logger'; +import { __DEBUG__ } from '../config/constants'; + +const configureStore = () => { + let initialStoreState = Map(); + + const enhancers = []; + const middlewares = [ + thunkMiddleware, + ]; + + let devtools; + + if (__DEBUG__) { + devtools = ( + typeof window !== 'undefined' + && typeof window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ === 'function' + && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ actionsBlacklist: [] }) + ); + + if (devtools) { + console.info('[setup] ✓ Enabling Redux DevTools Extension'); + } + + console.info('[setup] ✓ Enabling state logger'); + const loggerMiddleware = createLogger({ + level: 'info', + collapsed: true, + stateTransformer: (state) => state.toJS(), + predicate: (getState, action) => { + const state = getState(); + + const showBlacklisted = state.getIn(['debug', 'logs', 'blacklisted']); + if (loggerConfig.blacklist.indexOf(action.type) !== -1 && !showBlacklisted) { + return false; + } + + return state.getIn(['debug', 'logs', 'enabled']); + }, + }); + middlewares.push(loggerMiddleware); + } + + const composedEnhancers = devtools || compose; + const storeEnhancers = composedEnhancers( + applyMiddleware(...middlewares), + ...enhancers + ); + + const store = createStore( + rootReducer, + initialStoreState, + storeEnhancers, + ); + + return store; +}; + +export default configureStore; + +export const store = configureStore(); diff --git a/admin/src/pluginId.js b/admin/src/helpers/pluginId.js similarity index 65% rename from admin/src/pluginId.js rename to admin/src/helpers/pluginId.js index 1b059dd..41d89c1 100644 --- a/admin/src/pluginId.js +++ b/admin/src/helpers/pluginId.js @@ -1,4 +1,4 @@ -const pluginPkg = require('../../package.json'); +const pluginPkg = require('../../../package.json'); const pluginId = pluginPkg.name.replace( /^strapi-plugin-/i, '' diff --git a/admin/src/index.js b/admin/src/index.js index 6c5be5b..c700182 100644 --- a/admin/src/index.js +++ b/admin/src/index.js @@ -1,48 +1,50 @@ +import React from 'react'; import pluginPkg from '../../package.json'; -import pluginId from './pluginId'; +import pluginId from './helpers/pluginId'; import App from './containers/App'; import Initializer from './containers/Initializer'; -import lifecycles from './lifecycles'; import trads from './translations'; +function Comp(props) { + return ; +} + export default strapi => { - const pluginDescription = pluginPkg.strapi.description || pluginPkg.description; + const pluginDescription = + pluginPkg.strapi.description || pluginPkg.description; + const icon = pluginPkg.strapi.icon; const name = pluginPkg.strapi.name; const plugin = { + icon, + name, + destination: `/plugins/${pluginId}`, blockerComponent: null, blockerComponentProps: {}, description: pluginDescription, - icon, + icon: pluginPkg.strapi.icon, id: pluginId, initializer: Initializer, injectedComponents: [], isReady: false, - isRequired: pluginPkg.strapi.required || false, layout: null, - lifecycles, - mainComponent: App, - name, + leftMenuLinks: [], + leftMenuSections: [], + mainComponent: Comp, + name: pluginPkg.strapi.name, preventComponentRendering: false, trads, menu: { pluginsSectionLinks: [ { - destination: `/plugins/${pluginId}`, + destination: `/plugins/${pluginId}`, // Endpoint of the link icon, - label: { - id: `${pluginId}.plugin.name`, - defaultMessage: name, - }, name, - permissions: [ - // Uncomment to set the permissions of the plugin here - // { - // action: '', // the action name should be plugins::plugin-name.actionType - // subject: null, - // }, - ], + label: { + id: `${pluginId}.plugin.name`, // Refers to a i18n + defaultMessage: 'Config Sync', + }, }, ], }, diff --git a/admin/src/lifecycles.js b/admin/src/lifecycles.js deleted file mode 100644 index 81b0172..0000000 --- a/admin/src/lifecycles.js +++ /dev/null @@ -1,3 +0,0 @@ -function lifecycles() {} - -export default lifecycles; diff --git a/admin/src/state/actions/Config.js b/admin/src/state/actions/Config.js new file mode 100644 index 0000000..2f6c24d --- /dev/null +++ b/admin/src/state/actions/Config.js @@ -0,0 +1,16 @@ +/** + * + * Main actions + * + */ + +import { request } from 'strapi-helper-plugin'; +import { Map } from 'immutable'; + +// export const EXAMPLE_ACTION = 'EXAMPLE_ACTION'; +// export function exampleAction(value) { +// return { +// type: EXAMPLE_ACTION, +// value, +// }; +// } \ No newline at end of file diff --git a/admin/src/state/reducers/Config/index.js b/admin/src/state/reducers/Config/index.js new file mode 100644 index 0000000..0d952d4 --- /dev/null +++ b/admin/src/state/reducers/Config/index.js @@ -0,0 +1,20 @@ +/** + * + * Main reducer + * + */ + +import { fromJS, Map } from 'immutable'; +import { EXAMPLE_ACTION } from '../../actions/Config'; + +const initialState = fromJS({}); + +export default function configReducer(state = initialState, action) { + switch (action.type) { + case EXAMPLE_ACTION: + return state + .update('value', () => action.value) + default: + return state; + } +} \ No newline at end of file diff --git a/admin/src/state/reducers/index.js b/admin/src/state/reducers/index.js new file mode 100644 index 0000000..b2d1c7d --- /dev/null +++ b/admin/src/state/reducers/index.js @@ -0,0 +1,8 @@ +import { combineReducers } from 'redux-immutable'; +import configReducer from './Config'; + +const rootReducer = combineReducers({ + config: configReducer, +}); + +export default rootReducer; diff --git a/admin/src/translations/en.json b/admin/src/translations/en.json index 9e26dfe..466b80b 100644 --- a/admin/src/translations/en.json +++ b/admin/src/translations/en.json @@ -1 +1,3 @@ -{} \ No newline at end of file +{ + "plugin.name": "Config Sync" +} \ No newline at end of file diff --git a/admin/src/utils/getTrad.js b/admin/src/utils/getTrad.js deleted file mode 100644 index a2b8632..0000000 --- a/admin/src/utils/getTrad.js +++ /dev/null @@ -1,5 +0,0 @@ -import pluginId from '../pluginId'; - -const getTrad = id => `${pluginId}.${id}`; - -export default getTrad;