Does this work for TSX ? #34
Description
I tried this plugin on a simple react app and it doesn't seem to mangle correctly. As you can see in this example, the props for Skeleton components gets mangled and in the actual caller place, it uses original prop name instead of mangled name. I understand why this happens and it is hard for the plugin to know that we pass the arguments as an object and possibly might need a new check to handle this.
Actual code
import React from "react";
export interface SkeletonProps {
Header: React.ComponentType;
Content: React.ComponentType;
AppTabs: React.ComponentType;
history: History;
}
export const Skeleton = ({
Header,
Content,
AppTabs,
history,
}: SkeletonProps) => (
<div className={styles.skeleton}>
.....
</div>
);
const AppImpl = () => (
<Skeleton
history={history}
AppTabs={() => <div></div>}
Header={Header}
Content={AppContent}
/>
);Compiled code
export const Skeleton = ({
_internal_Header: Header,
_internal_Content: Content,
_internal_AppTabs: AppTabs,
_internal_history: history,
}) =>
( ...
);
const AppImpl = () =>
React.createElement(Skeleton, {
history: history,
AppTabs: () => React.createElement("div", null),
Header: Header,
Content: AppContent,
});