forked from TeamTurkey/Reactide2.0
-
Notifications
You must be signed in to change notification settings - Fork 2
/
importPath.js
234 lines (229 loc) · 8.3 KB
/
importPath.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
const fs = require('fs');
const path = require('path');
const flowParser = require('flow-parser');
/**
* Iterates through AST Object and returns the entry point for the Class or Function Block;
* @param {Object} obj AST JSON Object
*/
function getClassEntry(obj) {
let entry = null;
// Start lookup if Program body has ClassDeclaration or inside ExportDefaultDeclaration has ClassDeclaration
for (let elem of obj.body) {
if (elem.type === 'ClassDeclaration') {
return entry = elem.body;
}
else if (elem.type === 'ExportDefaultDeclaration' && elem.declaration.type === 'ClassDeclaration') {
return entry = elem.declaration.body;
}
}
return entry;
}
/**
* grabs state of stateful Component if available;
* @param {Object} obj AST object created from file at Class Block
*/
function grabState(obj) {
let ret = [];
let entry = getClassEntry(obj);
if (entry) ret = digStateInClassBody(entry);
return ret;
}
/**
* traverses through AST object and returns entry point for constructor Object;
* @param {Object} obj - classBody object from AST
*/
function digStateInClassBody(obj) {
if (obj.type !== 'ClassBody')
return;
let ret = [];
obj.body.forEach((elem) => {
if (elem.type = "MethodDefinition" && elem.key.name === "constructor") {
ret = digStateInBlockStatement(elem.value.body);
}
});
return ret;
}
/**
* traverses through AST BlockStatement object and returns the state of Component;
* @param {*} obj
*/
function digStateInBlockStatement(obj) {
if (obj.type !== 'BlockStatement')
return;
let ret = [];
obj.body.forEach((elem) => {
if (elem.type === "ExpressionStatement" && elem.expression.type === "AssignmentExpression")
if (elem.expression.left.property.name === 'state') {
if (elem.expression.right.type === "ObjectExpression")
return elem.expression.right.properties.forEach(elem => {
return ret.push(elem.key.name);
});
}
});
return ret;
}
/**
* parses through AST Object and returns an object of props
* @param {Array} arrOfAttr - Array of AST Object attributes
*/
function grabAttr(arrOfAttr) {
return arrOfAttr.reduce((acc, curr) => {
if (curr.value.type === 'JSXExpressionContainer') {
if (curr.value.expression.type === 'ArrowFunctionExpression' || curr.value.expression.type === 'FunctionExpression') {
if(curr.value.expression.body.body) {
acc[curr.name.name] = curr.value.expression.body.body[0].expression.callee.name
} else {
acc[curr.name.name] = curr.value.expression.body.callee.name
}
} else if (curr.value.expression.type === 'Literal') {
acc[curr.name.name] = curr.value.expression.value;
} else if (curr.value.expression.type === 'MemberExpression') {
acc[curr.name.name] = curr.value.expression.property.name;
} else if (curr.value.expression.type === 'ConditionalExpression') {
let condition, consequent, alternate;
if(curr.value.expression.test.type === 'MemberExpression') {
condition = curr.value.expression.test.property.name;
} else{
condition = curr.value.expression.test.name;
}
if(curr.value.expression.consequent.type === 'MemberExpression') {
consequent = curr.value.expression.consequent.property.name;
} else{
consequent = curr.value.expression.consequent.name;
}
if(curr.value.expression.alternate.type === 'MemberExpression') {
alternate = curr.value.expression.alternate.property.name;
} else{
alternate = curr.value.expression.consequent.name;
}
acc[curr.name.name + 'True'] = {condition: condition, value:consequent};
acc[curr.name.name + 'False'] = {condition: condition, value: alternate}
} else {
acc[curr.name.name] = curr.value.expression.name;
}
} else {
acc[curr.name.name] = curr.value.value;
}
return acc;
},{})
};
/**
* returns an Array of Objects with the name and path of IMPORT objects
* @param {Object} json- AST Object
*/
function grabImportNameAndPath(json) {
let output;
const importObjectArr = json.body.filter((importObj) => {
if (importObj.type === 'ImportDeclaration') {
return {
importObj
}
}
})
output = importObjectArr.map((importObj) => {
if (importObj.specifiers[0]) {
return {
name: importObj.specifiers[0].local.name,
path: importObj.source.value,
}
}
})
output = output.filter((obj) => {
if (obj) {
return obj;
}
})
return output;
}
/**
* returns an Object with Component name and props from AST Object;
* @param {Object} returnObj - AST object
*/
const constructComponentProps = (returnObj) => {
const output = {};
output[returnObj.openingElement.name.name] = grabAttr(returnObj.openingElement.attributes)
return output;
}
/**
* returns Object with name and props of current Component;
* @param {String} jsxPath - Path of file to convert into a AST object
*/
function constructSingleLevel(jsxPath) {
let reactObj = {};
// grabs content from file and creates an AST Object
const fileContent = fs.readFileSync(jsxPath, { encoding: 'utf-8' });
let jsonObj = flowParser.parse(fileContent);
// checks for Components in imports section
let imports = grabImportNameAndPath(jsonObj);
let componentTags = grabChildComponents(imports, fileContent);
// checks if component is Stateful and grabs state;
let state = grabState(jsonObj);
// iterates through components array and creates object with Component name, props and path;
if (componentTags !== null){
componentTags.forEach(elem => {
let ast = flowParser.parse(elem).body[0].expression
reactObj = Object.assign(reactObj, constructComponentProps(ast));
});
imports = imports.filter(comp => {
comp.props = reactObj[comp.name]
return Object.keys(reactObj).includes(comp.name);
});
} else {
imports = [];
}
let outputObj = {
name: path.basename(jsxPath).split('.')[0],
childProps: imports,
stateProps: state,
children: []
}
return outputObj;
}
/**
* recursively traverses through all folders given from filePath and creates JSON Object;
* @param {String} filePath Path to Component folder
* @param {String} rootPath - name of File
*/
function constructComponentTree(filePath, rootPath) {
// create object at current level;
let result = constructSingleLevel(path.join(rootPath, filePath));
// checks if current Object has children and traverses through children to create Object;
if(result && Object.keys(result.childProps).length > 0){
for(let childProp of result.childProps) {
//creates new path for children components - if girootPath doesnt have an extension adds .js extension
let fullPath = path.join(rootPath, childProp.path);
let newRootPath = path.dirname(fullPath);
let newFileName = path.basename(fullPath);
let childPathSplit = newFileName.split('.');
if (childPathSplit.length === 1)
newFileName += '.js';
let newFullPath = path.join(newRootPath, newFileName);
//traverses through children
result.children.push(constructComponentTree(newFileName, newRootPath));
}
}
return result;
}
/**
* returns an array of React Components in String Format, checks imports array and filters fileContent to find Components;
* @param {Array} imports - Array of Objects with name and path of all Import Objects;
* @param {String} fileContent - String of File Content;
*/
function grabChildComponents(imports, fileContent) {
// grab all import object name from import array;
let compNames = imports.reduce((arr, cur) => {
// skips <Provider/> component from redux
if (cur.name !== 'Provider') {
arr.push(cur.name);
}
return arr;
}, []);
// format all import names for regex
compNames = compNames.join('|');
let pattern = '<\s*(' + compNames + ')(>|(.|[\r\n])*?[^?]>)'
const regExp = new RegExp(pattern, 'g');
// finds all components that match imports;
let matchedComponents = fileContent.match(regExp);
return matchedComponents;
}
module.exports = {grabChildComponents, constructComponentTree, constructSingleLevel, constructComponentProps, grabImportNameAndPath, grabAttr, digStateInBlockStatement, digStateInClassBody, grabState, getClassEntry}