Scoring types, components alias, increase height, vertical app

frontend/src/App.tsx

@@ -1,18 +1,28 @@
-import { Greet } from "@wails/go/main/App";
+import Offer from "@components/Offer";
+import { Search } from "@wails/go/main/App";
+import { api } from "@wails/go/models";
 import { useEffect, useState } from "react";
 
 function App() {
-  const [state, setState] = useState<string>("");
+  const [state, setState] = useState<api.ScoredOffer[] | null>(null);
+
+  async function invoke() {
+    const offers = await Search();
+    console.log({ offer: offers[0] });
+    setState(offers);
+  }
 
   useEffect(() => {
-    Greet("World").then((result) => {
-      setState(result);
-    });
+    if (state === null) invoke();
   });
 
   return (
     <div id="App">
-      <div className="p-4">{state}</div>
+      <div className="p-4" onClick={invoke}>
+        {state?.map((offer) => (
+          <Offer offer={offer} />
+        ))}
+      </div>
     </div>
   );
 }

frontend/src/components/Offer.tsx

@@ -1,7 +1,9 @@
-export default function Offer() {
-  return (
-    <div className="p-4">
-      <h1>Offer</h1>
-    </div>
-  );
+import { api } from "@wails/go/models";
+
+export default function Offer({
+  offer: scoredOffer,
+}: {
+  offer: api.ScoredOffer;
+}) {
+  return <div className="p-4">{scoredOffer.Score}</div>;
 }

frontend/src/main.css

@@ -3,5 +3,5 @@
 @tailwind utilities;
 
 html {
-  @apply bg-zinc-800 p-0 m-0 h-screen w-screen text-zinc-200;
+  @apply bg-zinc-800 p-0 m-0 h-screen w-screen text-zinc-200 overflow-x-hidden;
 }