nice bundles markup

client/src/routes/home.tsx

@@ -3,7 +3,32 @@ import { connect } from 'unistore/preact'
 
 import actions from './../actions';
 
-function Home({ bundles, getBundles }) {
+// import Bundle from './../components/bundle';
+
+interface Props {
+    bundles: any[];
+    getBundles: () => void,
+}
+
+function Bundle(bundle) {
+	return (
+		<div class="bundle">
+			<h2>{bundle.username} - {bundle.seller}</h2>
+			<h3>{bundle.total} {bundle.currency}</h3>
+			{bundle.items.map(i => (
+				<div key={i.id}>
+					<a href={i.uri}>
+						<h4>{i.description}</h4>
+					</a>
+					<h5>{i.price} {i.currency}</h5>
+				</div>
+			))}
+		</div>
+	)
+}
+
+
+function Home({ bundles, getBundles }: Props) {
 	if (!bundles.length) {
 		getBundles();
 
@@ -16,7 +41,7 @@ function Home({ bundles, getBundles }) {
 
 	return (
 		<div class={'home'}>
-			{JSON.stringify(bundles)}
+			{bundles.map(Bundle)}
 		</div>
 	);
 }