From 1e8f80ddbf0289d72db0b6a2a5c7062c3751270d Mon Sep 17 00:00:00 2001
From: Ayoub Adib <adbayb@gmail.com>
Date: Mon, 22 Nov 2021 21:08:33 +0100
Subject: [PATCH] fix: typescript transpilation by enabling tsx loader for
 jsxPlugin

---
 examples/ts-module/src/Button.tsx | 8 ++++++--
 examples/ts-react/src/App.tsx     | 2 +-
 src/bundler/bundler.ts            | 2 +-
 src/bundler/plugins.ts            | 2 +-
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/examples/ts-module/src/Button.tsx b/examples/ts-module/src/Button.tsx
index 24317ab..9fec92c 100644
--- a/examples/ts-module/src/Button.tsx
+++ b/examples/ts-module/src/Button.tsx
@@ -1,7 +1,11 @@
-export const Button = () => {
+interface ButtonProps {
+	label: string;
+}
+
+export const Button = (props: ButtonProps) => {
 	return (
 		<>
-			<button>Click me!</button>Plop
+			<button>{props.label}</button> Plop
 		</>
 	);
 };
diff --git a/examples/ts-react/src/App.tsx b/examples/ts-react/src/App.tsx
index bc15896..ee282f0 100644
--- a/examples/ts-react/src/App.tsx
+++ b/examples/ts-react/src/App.tsx
@@ -1,7 +1,7 @@
 import { useState } from "react";
 
 interface AppProps {
-	label: string;
+	label?: string;
 }
 
 export const App = (props: AppProps) => {
diff --git a/src/bundler/bundler.ts b/src/bundler/bundler.ts
index f2a4261..8f81da2 100644
--- a/src/bundler/bundler.ts
+++ b/src/bundler/bundler.ts
@@ -32,7 +32,7 @@ export const createBundler = async (
 
 		await build({
 			absWorkingDir: CWD,
-			// bundle: true, // @todo: fix (not working with typescript like syntax (type/interface))
+			bundle: Boolean(metadata.externalDependencies),
 			define: {
 				"process.env.NODE_ENV": isProduction
 					? '"production"'
diff --git a/src/bundler/plugins.ts b/src/bundler/plugins.ts
index cf37a0c..6c5c05d 100644
--- a/src/bundler/plugins.ts
+++ b/src/bundler/plugins.ts
@@ -32,7 +32,7 @@ export const jsxPlugin = (
 
 			return {
 				contents: `import * as React from "${module}";${content}`,
-				loader: "jsx",
+				loader: "tsx",
 			};
 		});
 	},