Fixed deleting element around array/map expressions #786
Conversation
| const signature = [ | ||
| child.tagName, | ||
| child.className, | ||
| child.getAttribute(EditorAttributes.DATA_ONLOOK_ID), |
There was a problem hiding this comment.
My understanding: We're making an assumption that if an element has the same data-onlook-id as its sibling, it would be part of an array?
One edge case is if an element is an instance and it's used twice, these would have the same signature?
export default function Page() {
return (
<div>
<Instance />
<Instance />
</div>
);
}
function Instance() {
return <div>Instance</div>;
}There was a problem hiding this comment.
Thought this is really close! I wonder if there's something we can do on the plugin side to populate these attributes
|
@iNerdStack , does this need review? |
|
@Kitenite No not yet, I have some pending local changes to move dynamic type logic and also alerts when attempting to delete element in an array etc, i will make the push soon and inform you |
|
@iNerdStack awesome, just wanted to make sure I'm not blocking. Take your time :) |
|
@Kitenite |
| @@ -79,3 +81,27 @@ export const jsxFilter = ( | |||
| export function generateCode(ast: t.File, options: GeneratorOptions, codeBlock: string): string { | |||
| return generate(ast, options, codeBlock).code; | |||
| } | |||
|
|
|||
| export function getDynamicType(elementPath: NodePath<t.JSXElement>): DynamicType | null { | |||
There was a problem hiding this comment.
My understanding is that this traverse up the entire element tree, is this too much? I would think if the immediate parent is an array then we will add it, otherwise we don't. In this case, we don't want to delete a but do we delete b and c?
Perhaps once we run into another parent that is a jsxelement, we can return.
<>{arr.map(_ =>
<a>
<b/>
<c/>
<a/>
)}</>There was a problem hiding this comment.
export function getDynamicType(elementPath: NodePath<t.JSXElement>): DynamicType | null {
const parentPath = elementPath.parentPath;
if (t.isJSXElement(parentPath.node)) {
return null; // Stop if we hit another JSX element
}
if (parentPath && t.isCallExpression(parentPath.node) &&
t.isMemberExpression(parentPath.node.callee) &&
t.isIdentifier(parentPath.node.callee.property) &&
parentPath.node.callee.property.name === 'map') {
return 'array';
}
return null;
}@Kitenite does this solve the concern with returning early if the parent is another jsx element?
There was a problem hiding this comment.
Never mind, it didn't work as expected. root element in the array were not flagged as dynamic
Description
What is the purpose of this pull request?
Related: #644