Skip to content

Commit 3cf85d5

Browse files
bletobleto
authored
Merge pull request #29 from bleto/replace-routing-helper
feature: replace routing helper
2 parents 0e258cc + 17b48f2 commit 3cf85d5

File tree

6 files changed

+161
-85
lines changed

6 files changed

+161
-85
lines changed

‎docs/content/en/module-config.md

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -311,15 +311,55 @@ Sometimes you need to replace certain elements or add some to already existing s
311311
In order not to modify existing modules, **VueMS library** provides a solution to easily extend already existing mechanisms.
312312
Thanks to it we have a lot of possibilities to extend modules from other modules.
313313

314-
In order to add any extensions you need to create an `extend.js` file
314+
In order to add any extensions you need to create an `extends.js` file
315315
and use specific properties in it depending on what you want to achieve.
316316

317317

318318
<alert type="info">
319-
You don't need to create an <code>extend.js</code> file if you don't want to extend anything
319+
You don't need to create an <code>extends.js</code> file if you don't want to extend anything
320320
</alert>
321321

322322
#### Properties:
323+
---
324+
325+
* `replaceRoutes`
326+
- Type: `Array`
327+
328+
This functionality allows you to replace a routing page by his name.
329+
The mechanism is based on routing and extends existing routing.
330+
331+
**`replaceRoutes`:**<br>
332+
- `name` - existing router name what we want replace,<br>
333+
- `routes` - new routing to replace,<br>
334+
335+
```javascript [@Products/config/extends.js]
336+
export default {
337+
replaceRoutes: [
338+
{
339+
name: 'products',
340+
routes: {
341+
name: 'products-new',
342+
path: '/new-products',
343+
component: Tabs.Product,
344+
meta: {
345+
title: 'New Products',
346+
visible: false,
347+
breadcrumbs: [
348+
{
349+
title: 'New Products',
350+
icon: Icons.Product,
351+
},
352+
],
353+
privileges: [],
354+
},
355+
},
356+
},
357+
],
358+
};
359+
```
360+
<alert type="info">
361+
The extended routing <b>must exist</b>. The mechanism substitutes all routing with the given name. <br>First the routing is replaced and then extended (<code>extendRoutesChildren</code>), so if a routing is added to the given name, it will be added correctly.
362+
</alert>
323363

324364
---
325365

‎docs/package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vuems",
3-
"version": "0.14.0",
3+
"version": "1.0.0",
44
"private": true,
55
"scripts": {
66
"dev": "nuxt",
@@ -10,8 +10,8 @@
1010
"deploy": "push-dir --dir=dist --branch=docs --remote=upstream --cleanup"
1111
},
1212
"dependencies": {
13-
"@nuxt/content-theme-docs": "^0.8.2",
14-
"nuxt": "^2.15.7"
13+
"@nuxt/content-theme-docs": "^0.11.1",
14+
"nuxt": "^2.15.8"
1515
},
1616
"devDependencies": {
1717
"push-dir": "^0.4.1"

‎package.json

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@ergonode/vuems",
3-
"version": "0.15.1",
3+
"version": "1.0.0",
44
"description": "A simple mechanism to transform a monolithic Vue application into an application based on Micro Services architecture.",
55
"author": "Bletek Piotr <p.bletek@gmail.com>",
66
"license": "OSL",
@@ -41,21 +41,21 @@
4141
"consola": "^2.15.3",
4242
"deepmerge": "^4.2.2",
4343
"fs-extra": "^10.0.0",
44-
"recursive-readdir-async": "^1.1.8"
44+
"recursive-readdir-async": "^1.2.0"
4545
},
4646
"devDependencies": {
4747
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
4848
"babel-eslint": "^10.1.0",
4949
"babel-plugin-dynamic-import-node": "^2.3.3",
50-
"eslint": "^7.30.0",
51-
"eslint-config-airbnb": "^18.2.1",
50+
"eslint": "^8.4.0",
51+
"eslint-config-airbnb": "^19.0.2",
5252
"eslint-config-prettier": "^8.3.0",
53-
"eslint-plugin-import": "^2.23.4",
54-
"eslint-plugin-jsx-a11y": "^6.4.1",
53+
"eslint-plugin-import": "^2.25.3",
54+
"eslint-plugin-jsx-a11y": "^6.5.1",
5555
"eslint-plugin-notice": "^0.9.10",
56-
"eslint-plugin-prettier": "^3.4.0",
57-
"eslint-plugin-react": "^7.24.0",
58-
"eslint-plugin-react-hooks": "^4.2.0",
59-
"prettier": "^2.3.2"
56+
"eslint-plugin-prettier": "^4.0.0",
57+
"eslint-plugin-react": "^7.27.1",
58+
"eslint-plugin-react-hooks": "^4.3.0",
59+
"prettier": "^2.5.1"
6060
}
6161
}

‎src/templates/plugin.ejs

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,10 @@ import extendsModules from '~/.nuxt/extends.modules';
1010

1111
export default ({ app }, inject) => {
1212
const extendMethods = {};
13-
const extendComponents = Object.values(extendsModules)
14-
.reduce((acc, current) => deepmerge(acc, current.extendComponents || {}), {});
13+
const extendComponents = Object.values(extendsModules).reduce(
14+
(acc, current) => deepmerge(acc, current.extendComponents || {}),
15+
{},
16+
);
1517

1618
Object.values(extendsModules).forEach((extendContent) => {
1719
if (extendContent.extendMethods) {
@@ -21,16 +23,20 @@ export default ({ app }, inject) => {
2123
extendContent.extendMethods[extendName],
2224
];
2325
} else {
24-
extendMethods[extendName].push(extendContent.extendMethods[extendName]);
26+
extendMethods[extendName].push(
27+
extendContent.extendMethods[extendName],
28+
);
2529
}
2630
});
2731
}
2832
});
2933

30-
inject('getExtendSlot', key => extendComponents[key] || {});
34+
inject('getExtendSlot', (key) => extendComponents[key] || {});
3135
inject('getExtendMethod', async (key, payload) => {
3236
if (extendMethods[key]) {
33-
const methods = await Promise.all(extendMethods[key].map(method => method(payload)));
37+
const methods = await Promise.all(
38+
extendMethods[key].map((method) => method(payload)),
39+
);
3440

3541
return methods;
3642
}

‎src/templates/pluginVuex.ejs

Lines changed: 49 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
* See LICENSE for license details.
44
*/
55
/* eslint-disable no-await-in-loop */
6+
/* eslint-disable no-param-reassign */
67

78
import deepmerge from 'deepmerge';
89
import extendsModules from '~/.nuxt/extends.modules';
@@ -24,34 +25,41 @@ export default async ({ app }) => {
2425

2526
await asyncForEach(Object.values(extendsModules), async (extendContent) => {
2627
if (extendContent.extendStore) {
27-
await asyncForEach(Object.keys(extendContent.extendStore), async (extendName) => {
28-
const tmpStore = {};
29-
const storeContent = await extendContent.extendStore[extendName]();
28+
await asyncForEach(
29+
Object.keys(extendContent.extendStore),
30+
async (extendName) => {
31+
const tmpStore = {};
32+
const storeContent = await extendContent.extendStore[
33+
extendName
34+
]();
3035

31-
Object.keys(storeKeys).forEach((key) => {
32-
if (storeContent[key]) {
33-
if (key === 'state') {
34-
tmpStore[key] = storeContent[key]();
35-
} else {
36-
tmpStore[key] = storeContent[key];
36+
Object.keys(storeKeys).forEach((key) => {
37+
if (storeContent[key]) {
38+
if (key === 'state') {
39+
tmpStore[key] = storeContent[key]();
40+
} else {
41+
tmpStore[key] = storeContent[key];
42+
}
3743
}
38-
}
39-
});
44+
});
4045

41-
extendedStore[extendName] = deepmerge(
42-
extendedStore[extendName] || {},
43-
tmpStore,
44-
);
45-
});
46+
extendedStore[extendName] = deepmerge(
47+
extendedStore[extendName] || {},
48+
tmpStore,
49+
);
50+
},
51+
);
4652
}
4753
});
4854

4955
app.store.registerModule('index', {
5056
actions: {
5157
resetState({ dispatch }) {
5258
Object.keys(storeModules).forEach((storeName) => {
53-
if (app.store._actions[`${storeName}/__clearStorage`]
54-
&& app.store._actions[`${storeName}/__clearStorage`].length) {
59+
if (
60+
app.store._actions[`${storeName}/__clearStorage`] &&
61+
app.store._actions[`${storeName}/__clearStorage`].length
62+
) {
5563
dispatch(`${storeName}/__clearStorage`);
5664
}
5765
});
@@ -60,7 +68,8 @@ export default async ({ app }) => {
6068
});
6169

6270
Object.keys(storeModules).forEach((storeName) => {
63-
const moduleIsRegistered = app.store._modules.root._children[storeName] !== undefined;
71+
const moduleIsRegistered =
72+
app.store._modules.root._children[storeName] !== undefined;
6473
const stateExists = app.store.state[storeName];
6574
let states = storeModules[storeName].state();
6675

@@ -92,31 +101,35 @@ export default async ({ app }) => {
92101

93102
// DEFAULT VUEX METHODS
94103
// MUTATIONS
95-
storeModules[storeName].mutations.__CLEAR_STORAGE = function __CLEAR_STORAGE(state) {
96-
Object.keys(states).forEach((key) => {
97-
state[key] = states[key];
98-
});
99-
};
100-
storeModules[storeName].mutations.__SET_STATE = function __SET_STATE(state, {
101-
key, value,
102-
}) {
104+
storeModules[storeName].mutations.__CLEAR_STORAGE =
105+
function __CLEAR_STORAGE(state) {
106+
Object.keys(states).forEach((key) => {
107+
state[key] = states[key];
108+
});
109+
};
110+
storeModules[storeName].mutations.__SET_STATE = function __SET_STATE(
111+
state,
112+
{ key, value },
113+
) {
103114
state[key] = value;
104115
};
105116

106117
// ACTIONS
107-
storeModules[storeName].actions.__clearStorage = function __clearStorage({ commit }) {
108-
commit('__CLEAR_STORAGE');
109-
};
110-
storeModules[storeName].actions.__setState = function __setState({ commit }, payload) {
118+
storeModules[storeName].actions.__clearStorage =
119+
function __clearStorage({ commit }) {
120+
commit('__CLEAR_STORAGE');
121+
};
122+
storeModules[storeName].actions.__setState = function __setState(
123+
{ commit },
124+
payload,
125+
) {
111126
commit('__SET_STATE', payload);
112127
};
113128

114129
if (!moduleIsRegistered) {
115-
app.store.registerModule(
116-
storeName,
117-
storeModules[storeName],
118-
{ preserveState: stateExists },
119-
);
130+
app.store.registerModule(storeName, storeModules[storeName], {
131+
preserveState: stateExists,
132+
});
120133
}
121134
});
122135
};

0 commit comments

Comments
 (0)