Skip to content

Commit c1c0ca0

Browse files
committed
refactoring, docs
1 parent 6cfc2d4 commit c1c0ca0

File tree

7 files changed

+111
-37
lines changed

7 files changed

+111
-37
lines changed

.idea/.gitignore

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/misc.xml

Lines changed: 11 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/modules.xml

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/sonarlint/issuestore/index.pb

Whitespace-only changes.

.idea/svg-jest.iml

Lines changed: 12 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/vcs.xml

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

index.js

Lines changed: 69 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,81 @@
11
const path = require('path');
22

3-
function buildModule(functionName, pathname, filename)
4-
{
5-
return `
6-
const React = require('react');
3+
/**
4+
* This function build module.
5+
*
6+
* P.S.:
7+
* The string "module.exports.default = ${functionName};"
8+
* replaced with (by https://github.com/ChromeQ):
9+
* ```
10+
* module.exports.__esModule = true;
11+
* module.exports.default = '${pathname}';
12+
* ```
13+
*
14+
* Object props is a more extensible solution when we have a lot of props
15+
* @param {Object} props
16+
* @param {string} props.functionName
17+
* @param {string} props.pathname
18+
* @param {string} props.filename
19+
*
20+
* @function {(functionName, pathname, filename) => string} buildModule
21+
* @param {string} props
22+
* @return {string} string module
23+
*/
24+
const buildModule = props => {
725

8-
const ${functionName} = (props) =>
9-
{
10-
return React.createElement('svg', {
11-
...props,
12-
'data-jest-file-name': '${pathname}',
13-
'data-jest-svg-name': '${filename}',
14-
'data-testid': '${filename}'
15-
});
16-
}
26+
const {
27+
filename,
28+
functionName,
29+
pathname,
30+
} = props;
1731

18-
module.exports.default = ${functionName};
19-
module.exports.ReactComponent = ${functionName};
20-
`;
21-
}
32+
return `
33+
const React = require('react');
34+
const ${functionName} = (props) =>
35+
{
36+
return React.createElement('svg', {
37+
...props,
38+
'data-jest-file-name': '${pathname}',
39+
'data-jest-svg-name': '${filename}',
40+
'data-testid': '${filename}'
41+
});
42+
}
43+
module.exports.__esModule = true;
44+
module.exports.default = '${pathname}';
45+
module.exports.ReactComponent = ${functionName};
46+
`;};
2247

23-
function createFunctionName(base)
24-
{
48+
/**
49+
* This function creates a function name
50+
* @function {(base) => string} createFunctionName
51+
* @param {string} base
52+
* @return {string} string module
53+
*/
54+
const createFunctionName = base => {
2555
const words = base.split(/\W+/);
26-
return words.reduce(
27-
(identifer, word) => {
28-
return identifer +
29-
word.substr(0, 1).toUpperCase() +
30-
word.substr(1);
31-
}, '');
32-
}
56+
/* here I refactored the code a bit and replaced "substr" (Deprecated) with "substring" */
57+
return words.reduce((identifier, word) => identifier + word.substring(0, 1).toUpperCase() + word.substring(1), '');
58+
};
3359

34-
function processSvg(contents, filename)
35-
{
60+
/**
61+
* This function process incoming svg data
62+
* @function {(contents, filename) => string} processSvg
63+
* @param {string} contents - your svg. String like "<svg viewBox="..."><path d="..."/></svg>"
64+
* @param {string} filename - full path of your file
65+
* @return {string} string module
66+
*/
67+
const processSvg = (contents, filename) => {
3668
const parts = path.parse(filename);
37-
if (parts.ext.toLowerCase() === '.svg')
38-
{
69+
if (parts.ext.toLowerCase() === '.svg') {
3970
const functionName = createFunctionName(parts.name);
40-
return buildModule(functionName, parts.base, parts.name);
71+
return buildModule({
72+
filename: functionName,
73+
functionName: parts.base,
74+
pathname: parts.name,
75+
});
4176
}
42-
77+
4378
return contents;
44-
}
79+
};
4580

46-
module.exports =
47-
{
48-
process: processSvg
49-
}
81+
module.exports = { process: processSvg };

0 commit comments

Comments
 (0)