|
1 | 1 | const path = require('path'); |
2 | 2 |
|
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 => { |
7 | 25 |
|
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; |
17 | 31 |
|
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 | +`;}; |
22 | 47 |
|
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 => { |
25 | 55 | 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 | +}; |
33 | 59 |
|
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) => { |
36 | 68 | const parts = path.parse(filename); |
37 | | - if (parts.ext.toLowerCase() === '.svg') |
38 | | - { |
| 69 | + if (parts.ext.toLowerCase() === '.svg') { |
39 | 70 | 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 | + }); |
41 | 76 | } |
42 | | - |
| 77 | + |
43 | 78 | return contents; |
44 | | -} |
| 79 | +}; |
45 | 80 |
|
46 | | -module.exports = |
47 | | -{ |
48 | | - process: processSvg |
49 | | -} |
| 81 | +module.exports = { process: processSvg }; |
0 commit comments