From 4f44adfd3ef36da0538ed9e185759ca201933ba5 Mon Sep 17 00:00:00 2001 From: ash-t-luu Date: Mon, 4 Dec 2023 12:19:51 -0800 Subject: [PATCH 1/3] sending new conditionals --- src/parser.js | 63 ++++++++++++++++++++++++++++++++++++++++----------- 1 file changed, 50 insertions(+), 13 deletions(-) diff --git a/src/parser.js b/src/parser.js index d64ba47..fd43d99 100644 --- a/src/parser.js +++ b/src/parser.js @@ -290,26 +290,63 @@ class Parser { // output: boolean getCallee(body) { // does useStore count as a client component functionality? - const hooksArray = ['useState', 'useContext', 'useRef', 'useImperativeHandle', 'useNavigate', 'useLayoutEffect', 'useInsertionEffect', 'useMemo', 'useCallback', 'useTransition', 'useDeferredValue', 'useEffect', 'useReducer', 'useDispatch', 'useActions', 'useSelector', 'bindActionCreators']; + const hooksArray = ['useState', 'useContext', 'useRef', 'useImperativeHandle', 'useNavigate', 'useLocation', 'useLayoutEffect', 'useInsertionEffect', 'useMemo', 'useCallback', 'useTransition', 'useDeferredValue', 'useEffect', 'useReducer', 'useDispatch', 'useActions', 'useSelector', 'bindActionCreators']; - //! console.log('ast.program.body', body); + !console.log('ast.program.body', body); const bodyCallee = body.filter((item) => item.type === 'VariableDeclaration'); - const calleeArr = bodyCallee[0].declarations[0].init.body.body // gives us an array of callee nodes - - console.log('calleArr:', calleeArr); - for (let i = 0; i < calleeArr.length; i++) { - if (calleeArr[i].type === 'VariableDeclaration') { - if (hooksArray.includes(calleeArr[i].declarations[0].init.callee.name) || calleeArr[i].declarations[0].init.callee.name.startsWith('use')) { - return true; + console.log('bodyCallee', bodyCallee); + // const calleeArr = bodyCallee[0].declarations[0]?.init?.body?.body // gives us an array of callee nodes + console.log('bodyCallee.length', bodyCallee.length) + // so bodyCallee can return us an array with more than one element, and each element has their own property of declarations.init?.body + // we need to decipher if there is a body.body, if so, we need to access those elements + if (bodyCallee.length === 1) { + const calleeArr = bodyCallee[0].declarations[0] && bodyCallee[0].declarations[0].init && bodyCallee[0].declarations[0].init.body && bodyCallee[0].declarations[0].init.body.body; + + console.log('calleArr:', calleeArr); + for (let i = 0; i < calleeArr.length; i++) { + if (calleeArr[i].type === 'VariableDeclaration') { + if (hooksArray.includes(calleeArr[i].declarations[0].init.callee.name) || calleeArr[i].declarations[0].init.callee.name.startsWith('use')) { + return true; + } else { + return false; + } + } + if (calleeArr[i].type === 'ExpressionStatement') { + if (hooksArray.includes(calleeArr[i].expression.callee.name) || calleeArr[i].expression.callee.name.startsWith('use')) { + return true; + } else { + return false; + } } } - if (calleeArr[i].type === 'ExpressionStatement') { - if (hooksArray.includes(calleeArr[i].expression.callee.name) || calleeArr[i].expression.callee.name.startsWith('use')) { - return true; + } + if (bodyCallee.length > 1) { + const calleeArr1 = []; + for (let i = 0; i < bodyCallee.length; i++) { + if (bodyCallee[i].declarations[0] && bodyCallee[i].declarations[0].init && bodyCallee[i].declarations[0].init.body && bodyCallee[i].declarations[0].init.body.body) { + calleeArr1.push(bodyCallee[i]); + console.log('calleeArr from body', calleeArr1); + } + } + const calleeBodyArr = calleeArr1[0].declarations[0].init.body.body; + console.log('calleeBodyArr', calleeBodyArr); + for (let i = 0; i < calleeBodyArr.length; i++) { + if (calleeBodyArr[i].type === 'VariableDeclaration') { + if (hooksArray.includes(calleeBodyArr[i].declarations[0].init.callee.name) || calleeBodyArr[i].declarations[0].init.callee.name.startsWith('use')) { + return true; + } else { + return false; + } + } + if (calleeBodyArr[i].type === 'ExpressionStatement') { + if (hooksArray.includes(calleeBodyArr[i].expression.callee.name) || calleeBodyArr[i].expression.callee.name.startsWith('use')) { + return true; + } else { + return false; + } } } } - return false; } // Finds JSX React Components in current file From 832ddb1dc3dddec21e5d0d747513fbdb08a01ad4 Mon Sep 17 00:00:00 2001 From: ash-t-luu Date: Mon, 4 Dec 2023 15:49:00 -0800 Subject: [PATCH 2/3] Co-authored-by: Louis --- src/parser.js | 122 +++++++++++++++++++++++++++++++++----------------- 1 file changed, 81 insertions(+), 41 deletions(-) diff --git a/src/parser.js b/src/parser.js index fd43d99..51818ce 100644 --- a/src/parser.js +++ b/src/parser.js @@ -289,63 +289,103 @@ class Parser { // input: ast.program.body // output: boolean getCallee(body) { - // does useStore count as a client component functionality? - const hooksArray = ['useState', 'useContext', 'useRef', 'useImperativeHandle', 'useNavigate', 'useLocation', 'useLayoutEffect', 'useInsertionEffect', 'useMemo', 'useCallback', 'useTransition', 'useDeferredValue', 'useEffect', 'useReducer', 'useDispatch', 'useActions', 'useSelector', 'bindActionCreators']; + const defaultErr = (err,) => { + return { + method: 'Error in getCallee method of Parser:', + log: err, + } + }; - !console.log('ast.program.body', body); + console.log('ast.program.body', body); const bodyCallee = body.filter((item) => item.type === 'VariableDeclaration'); + if (bodyCallee.length === 0) return false; console.log('bodyCallee', bodyCallee); - // const calleeArr = bodyCallee[0].declarations[0]?.init?.body?.body // gives us an array of callee nodes - console.log('bodyCallee.length', bodyCallee.length) - // so bodyCallee can return us an array with more than one element, and each element has their own property of declarations.init?.body - // we need to decipher if there is a body.body, if so, we need to access those elements - if (bodyCallee.length === 1) { - const calleeArr = bodyCallee[0].declarations[0] && bodyCallee[0].declarations[0].init && bodyCallee[0].declarations[0].init.body && bodyCallee[0].declarations[0].init.body.body; - - console.log('calleArr:', calleeArr); - for (let i = 0; i < calleeArr.length; i++) { - if (calleeArr[i].type === 'VariableDeclaration') { - if (hooksArray.includes(calleeArr[i].declarations[0].init.callee.name) || calleeArr[i].declarations[0].init.callee.name.startsWith('use')) { + // console.log('bodyCallee.length', bodyCallee.length) + + const calleeHelper = (item) => { + const hooksObj = { + useState: 0, + useContext: 0, + useRef: 0, + useImperativeHandle: 0, + useNavigate: 0, + useLocation: 0, + useLayoutEffect: 0, + useInsertionEffect: 0, + useMemo: 0, + useCallback: 0, + useTransition: 0, + useDeferredValue: 0, + useEffect: 0, + useReducer: 0, + useDispatch: 0, + useActions: 0, + useSelector: 0, + bindActionCreators: 0, + } + if (item.type === 'VariableDeclaration') { + try { + let calleeName = item.declarations[0]?.init?.callee?.name; + console.log('passed into vardec statement'); + if (hooksObj.hasOwnProperty(calleeName) || (typeof calleeName === 'string' && calleeName.startsWith('use'))) { return true; - } else { - return false; } } - if (calleeArr[i].type === 'ExpressionStatement') { - if (hooksArray.includes(calleeArr[i].expression.callee.name) || calleeArr[i].expression.callee.name.startsWith('use')) { + catch (err) { + const error = defaultErr(err); + console.error(error.method, '\n', error.log); + } + } + else if (item.type === 'ExpressionStatement') { + try { + const calleeName = item.expression?.callee?.name; + if (calleeName === undefined) return false; + if (hooksObj.hasOwnProperty(calleeName) || (typeof calleeName === 'string' && calleeName.startsWith('use'))) { return true; - } else { - return false; } } + catch (err) { + const error = defaultErr(err); + console.error(error.method, '\n', error.log); + } } + return false; } - if (bodyCallee.length > 1) { - const calleeArr1 = []; - for (let i = 0; i < bodyCallee.length; i++) { - if (bodyCallee[i].declarations[0] && bodyCallee[i].declarations[0].init && bodyCallee[i].declarations[0].init.body && bodyCallee[i].declarations[0].init.body.body) { - calleeArr1.push(bodyCallee[i]); - console.log('calleeArr from body', calleeArr1); - } + + if (bodyCallee.length === 1) { + const calleeArr = bodyCallee[0].declarations[0]?.init?.body?.body; + if (calleeArr === undefined) return false; + + console.log('calleArr:', calleeArr); + let checkTrue = false; + for (let i = 0; i < calleeArr.length; i++) { + if (checkTrue) return true; + checkTrue = calleeHelper(calleeArr[i]); } - const calleeBodyArr = calleeArr1[0].declarations[0].init.body.body; - console.log('calleeBodyArr', calleeBodyArr); - for (let i = 0; i < calleeBodyArr.length; i++) { - if (calleeBodyArr[i].type === 'VariableDeclaration') { - if (hooksArray.includes(calleeBodyArr[i].declarations[0].init.callee.name) || calleeBodyArr[i].declarations[0].init.callee.name.startsWith('use')) { - return true; - } else { - return false; + return checkTrue; + } + else if (bodyCallee.length > 1) { + let calleeArr; + for (let i = 0; i < bodyCallee.length; i++) { + try { + if (bodyCallee[i].declarations[0]?.init?.body?.body) { + calleeArr = bodyCallee[i].declarations[0].init.body.body; + console.log('calleeArr from body', calleeArr); } } - if (calleeBodyArr[i].type === 'ExpressionStatement') { - if (hooksArray.includes(calleeBodyArr[i].expression.callee.name) || calleeBodyArr[i].expression.callee.name.startsWith('use')) { - return true; - } else { - return false; - } + catch (err) { + const error = defaultErr(err); + console.error(error.method, '\n', error.log); } } + + if (calleeArr === undefined) return false; + let checkTrue = false; + for (let i = 0; i < calleeArr.length; i++) { + if (checkTrue) return true; + checkTrue = calleeHelper(calleeArr[i]); + } + return checkTrue; } } From ef4035df1b0f23e0952a7298056089e6735a91b7 Mon Sep 17 00:00:00 2001 From: ash-t-luu Date: Mon, 4 Dec 2023 19:13:12 -0800 Subject: [PATCH 3/3] sending over new changes of working conditionals to check component type --- src/panel.js | 2 -- src/parser.js | 7 +++---- src/webview/Flow.jsx | 1 + 3 files changed, 4 insertions(+), 6 deletions(-) diff --git a/src/panel.js b/src/panel.js index e0cbd04..1050628 100644 --- a/src/panel.js +++ b/src/panel.js @@ -48,8 +48,6 @@ function createPanel(context) { // null, // vscode.Disposable // ); - - } // getNonce generates a new random string each time ext is used to prevent external injection of foreign code into the html diff --git a/src/parser.js b/src/parser.js index 51818ce..745f0a6 100644 --- a/src/parser.js +++ b/src/parser.js @@ -296,10 +296,10 @@ class Parser { } }; - console.log('ast.program.body', body); + // console.log('ast.program.body', body); const bodyCallee = body.filter((item) => item.type === 'VariableDeclaration'); if (bodyCallee.length === 0) return false; - console.log('bodyCallee', bodyCallee); + // console.log('bodyCallee', bodyCallee); // console.log('bodyCallee.length', bodyCallee.length) const calleeHelper = (item) => { @@ -326,7 +326,6 @@ class Parser { if (item.type === 'VariableDeclaration') { try { let calleeName = item.declarations[0]?.init?.callee?.name; - console.log('passed into vardec statement'); if (hooksObj.hasOwnProperty(calleeName) || (typeof calleeName === 'string' && calleeName.startsWith('use'))) { return true; } @@ -356,7 +355,7 @@ class Parser { const calleeArr = bodyCallee[0].declarations[0]?.init?.body?.body; if (calleeArr === undefined) return false; - console.log('calleArr:', calleeArr); + // console.log('calleArr:', calleeArr); let checkTrue = false; for (let i = 0; i < calleeArr.length; i++) { if (checkTrue) return true; diff --git a/src/webview/Flow.jsx b/src/webview/Flow.jsx index f84c382..87df5db 100644 --- a/src/webview/Flow.jsx +++ b/src/webview/Flow.jsx @@ -26,6 +26,7 @@ const OverviewFlow = () => { ); useEffect(() => { + // does not work currently window.addEventListener('message', (e) => { const msg = e.data; switch (msg.type) {