Skip to content

Commit 0174dcc

Browse files
committed
(MAJOR) Massive folder structure refactoring, using modular approach and module path aliases (#264)
Breaking changes. Using module path aliasing instead of relative paths. Using a more modular design pattern.
1 parent 0850614 commit 0174dcc

369 files changed

Lines changed: 3010 additions & 1973 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.codeclimate.yml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,15 @@ checks:
1616
method-complexity:
1717
enabled: true
1818
config:
19-
threshold: 10
19+
threshold: 25 # 10 by default
2020
method-count:
2121
enabled: true
2222
config:
2323
threshold: 20
2424
method-lines:
2525
enabled: true
2626
config:
27-
threshold: 200 # 25 by default
27+
threshold: 300 # 25 by default
2828
nested-control-flow:
2929
enabled: true
3030
config:

.storybook/jsconfig.json

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"@/app/*": [
6+
"../src/app/*"
7+
],
8+
"@/common/*": [
9+
"../src/common/*"
10+
],
11+
"@/components/*": [
12+
"../src/common/components/*"
13+
],
14+
"@/utils/*": [
15+
"../src/common/utils/*"
16+
],
17+
"@/layouts/*": [
18+
"../src/layouts/*"
19+
],
20+
"@/modules/*": [
21+
"../src/modules/*"
22+
],
23+
"@/pages/*": [
24+
"../src/pages/*"
25+
]
26+
}
27+
}
28+
}

.storybook/main.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -230,6 +230,24 @@ module.exports = {
230230
'@emotion/core': toPath('node_modules/@emotion/react'),
231231
'@emotion/styled': toPath('node_modules/@emotion/styled'),
232232
'emotion-theming': toPath('node_modules/@emotion/react'),
233+
234+
/**
235+
* Map our module path aliases, so that Storybook can understand modules loaded using "@/common" and load the proper file.
236+
* Required, or Storybook will fail to import dependencies from Stories.
237+
*
238+
* XXX The below list must match `tsconfig.json:compilerOptions.paths`, so the Next.js app and Storybook resolve all aliases the same way.
239+
* The paths mapping must also match the `jsconfig.json:compilerOptions.paths` file, which is necessary for WebStorm to understand them for .js files.
240+
*
241+
* @see https://nextjs.org/docs/advanced-features/module-path-aliases
242+
* @see https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003361399/comments/360002636080
243+
*/
244+
"@/app": path.resolve(__dirname, "../src/app"),
245+
"@/common": path.resolve(__dirname, "../src/common"),
246+
"@/components": path.resolve(__dirname, "../src/common/components"),
247+
"@/utils": path.resolve(__dirname, "../src/common/utils"),
248+
"@/layouts": path.resolve(__dirname, "../src/layouts"),
249+
"@/modules": path.resolve(__dirname, "../src/modules"),
250+
"@/pages": path.resolve(__dirname, "../src/pages"),
233251
},
234252
},
235253
};

.storybook/preview.js

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -8,23 +8,23 @@ import find from 'lodash.find';
88
import React from 'react';
99
import { withNextRouter } from 'storybook-addon-next-router';
1010
import { withPerformance } from 'storybook-addon-performance';
11-
import '../src/components/appBootstrap/MultiversalGlobalExternalStyles'; // Import the same 3rd party libraries global styles as the pages/_app.tsx (for UI consistency)
12-
import MultiversalGlobalStyles from '../src/components/appBootstrap/MultiversalGlobalStyles';
13-
import { defaultLocale, getLangFromLocale, supportedLocales } from '../src/i18nConfig';
14-
import amplitudeContext from '../src/stores/amplitudeContext';
15-
import customerContext from '../src/stores/customerContext';
16-
import { cypressContext } from '../src/stores/cypressContext';
17-
import datasetContext from '../src/stores/datasetContext';
18-
import i18nContext from '../src/stores/i18nContext';
19-
import previewModeContext from '../src/stores/previewModeContext';
20-
import quickPreviewContext from '../src/stores/quickPreviewContext';
21-
import userConsentContext from '../src/stores/userConsentContext';
22-
import { userSessionContext } from '../src/stores/userSessionContext';
23-
import { getAmplitudeInstance } from '../src/utils/analytics/amplitude';
24-
import '../src/utils/app/ignoreNoisyWarningsHacks';
25-
import { initCustomerTheme } from '../src/utils/data/theme';
26-
import i18nextLocize from '../src/utils/i18n/i18nextLocize';
27-
import '../src/utils/icons/font-awesome';
11+
import '@/app/components/MultiversalGlobalExternalStyles'; // Import the same 3rd party libraries global styles as the pages/_app.tsx (for UI consistency)
12+
import MultiversalGlobalStyles from '@/app/components/MultiversalGlobalStyles';
13+
import { defaultLocale, getLangFromLocale, supportedLocales } from '@/modules/core/i18n/i18nConfig';
14+
import amplitudeContext from '@/modules/core/amplitude/context/amplitudeContext';
15+
import customerContext from '@/modules/core/data/contexts/customerContext';
16+
import { cypressContext } from '@/modules/core/testing/contexts/cypressContext';
17+
import datasetContext from '@/modules/core/data/contexts/datasetContext';
18+
import i18nContext from '@/modules/core/i18n/contexts/i18nContext';
19+
import previewModeContext from '@/modules/core/previewMode/contexts/previewModeContext';
20+
import quickPreviewContext from '@/modules/core/quickPreview/contexts/quickPreviewContext';
21+
import userConsentContext from '@/modules/core/userConsent/contexts/userConsentContext';
22+
import { userSessionContext } from '@/modules/core/userSession/userSessionContext';
23+
import { getAmplitudeInstance } from '@/modules/core/amplitude/amplitude';
24+
import '@/common/utils/ignoreNoisyWarningsHacks';
25+
import { initCustomerTheme } from '@/modules/core/theming/theme';
26+
import i18nextLocize from '@/modules/core/i18n/i18nextLocize';
27+
import '@/modules/core/fontAwesome/fontAwesome';
2828
import dataset from './mock/sb-dataset';
2929

3030
// Loads translations from local file cache (Locize)

cypress/README.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,3 +51,19 @@ The files `cypress/config-*` are used for different purposes.
5151
_[Source](https://docs.cypress.io/faq/questions/using-cypress-faq.html#What-are-your-best-practices-for-organizing-tests)_
5252

5353
[Cypress releases "Real World App" (RWA) - Blog post](https://www.cypress.io/blog/2020/06/11/introducing-the-cypress-real-world-app/)
54+
55+
## Module path alias mapping
56+
57+
We use module alias path mappings, to avoid using relative paths (e.g: `../../src/common`) but absolute paths (AKA "module paths") instead (e.g: `@/common`).
58+
59+
Although it's simpler to use, it's harder to configure because it affects several configuration files:
60+
- The paths mapping in `tsconfig.json:compilerOptions.paths` must match those in `../tsconfig.json:compilerOptions.paths`
61+
- They must also match those in `jsconfig.json` file, which is necessary for WebStorm to understand them for .js files.
62+
63+
If the module path mappings aren't properly set everywhere, it won't work.
64+
65+
> You can still use relative paths.
66+
67+
Reference:
68+
- See [Next.js "Module path aliases" documentation](https://nextjs.org/docs/advanced-features/module-path-aliases)
69+
- See [WebStorm issue](https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003361399/comments/360002636080)

cypress/integration/app/_sanity/2-customer.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { Customer } from '../../../../src/types/data/Customer';
2-
import { CYPRESS_WINDOW_NS } from '../../../../src/utils/testing/cypress';
1+
import { Customer } from '@/modules/core/data/types/Customer';
2+
import { CYPRESS_WINDOW_NS } from '@/modules/core/testing/cypress';
33

44
describe('Sanity checks > Browser data', () => {
55
/**

cypress/integration/app/common/footer.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Customer } from '../../../../src/types/data/Customer';
1+
import { Customer } from '@/modules/core/data/types/Customer';
22

33
const baseUrl = Cypress.config().baseUrl;
44

cypress/integration/app/common/nav.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Customer } from '../../../../src/types/data/Customer';
1+
import { Customer } from '@/modules/core/data/types/Customer';
22

33
const baseUrl = Cypress.config().baseUrl;
44

cypress/jsconfig.json

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"@/app/*": [
6+
"../src/app/*"
7+
],
8+
"@/common/*": [
9+
"../src/common/*"
10+
],
11+
"@/components/*": [
12+
"../src/common/components/*"
13+
],
14+
"@/utils/*": [
15+
"../src/common/utils/*"
16+
],
17+
"@/layouts/*": [
18+
"../src/layouts/*"
19+
],
20+
"@/modules/*": [
21+
"../src/modules/*"
22+
],
23+
"@/pages/*": [
24+
"../src/pages/*"
25+
]
26+
}
27+
}
28+
}

cypress/support/commands.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
// https://on.cypress.io/custom-commands
99
// ***********************************************
1010

11-
import { CYPRESS_WINDOW_NS } from '../../src/utils/testing/cypress';
11+
import { CYPRESS_WINDOW_NS } from '@/modules/core/testing/cypress';
1212

1313
/**
1414
* Prepare DOM aliases by fetching the customer data from the browser window and aliasing them for later use.

0 commit comments

Comments
 (0)