From 8d501d42a3788c5cc862e3ccca9199523fa80a4b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jonas=20R=C3=B6ger?= <jonas.roeger@tu-dortmund.de>
Date: Fri, 21 Aug 2026 14:14:24 +0200
Subject: [PATCH] feat(web): add solution space info

---
 src/lib/wasm.rs                      |  4 ++--
 web/src/App.svelte                   | 23 ++++++++++++++++---
 web/src/components/WordleLine.svelte |  4 ++--
 web/src/solver/solver.ts             | 34 ++++++++++++++++++++--------
 web/src/solver/types.ts              | 23 +++++++++++++++----
 web/src/solver/worker.ts             | 26 ++++++++++++++++-----
 6 files changed, 88 insertions(+), 26 deletions(-)

diff --git a/src/lib/wasm.rs b/src/lib/wasm.rs
index bbe268e..1854a20 100644
--- a/src/lib/wasm.rs
+++ b/src/lib/wasm.rs
@@ -58,8 +58,8 @@ impl Solver {
             .collect()
     }
 
-    pub fn solution_space(&self) -> u64 {
-        self.0.stats().0
+    pub fn solution_space(&self) -> u32 {
+        self.0.stats().0 as u32
     }
 
     pub fn solution_space_uncertainty(&self) -> f64 {
diff --git a/web/src/App.svelte b/web/src/App.svelte
index b792ade..030fef4 100644
--- a/web/src/App.svelte
+++ b/web/src/App.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
     import { Color } from "wordle-solver";
     import WordleLine from "./components/WordleLine.svelte";
-    import { solver_guess } from "./solver/solver.ts";
+    import { solver_guess, solver_solution_space } from "./solver/solver.ts";
+    import type { GuessResult, SolutionSpaceResult } from "./solver/types.ts";
 
     let guesses = $state([
         {
@@ -16,7 +17,14 @@
         },
     ]);
 
-    let infos_gained: (Promise<number> | null)[] = $state([null]);
+    let infos_gained: (Promise<GuessResult> | null)[] = $state([null]);
+
+    let solution_space: Promise<SolutionSpaceResult> = $state(
+        solver_solution_space(),
+    );
+    self.setTimeout(() => {
+        solution_space = solver_solution_space();
+    }, 300);
 
     let cursor = $state(0);
 
@@ -33,6 +41,7 @@
                 guess.colors,
             );
             infos_gained.push(null);
+            solution_space = solver_solution_space();
 
             cursor = 0;
 
@@ -58,7 +67,15 @@
     <div class="text-center">
         <h1 class="mb-6 text-3xl font-bold">Wordle Solver</h1>
 
-        <p class="mt-4 text-sm text-zinc-500">SolutionSpace</p>
+        <p class="mt-4 text-sm text-zinc-500">
+            {#await solution_space then s}
+                Solution-space: {s.size}, Uncertainty: {s.uncertainty.toFixed(
+                    2,
+                )}bits
+            {:catch e}
+                {e}
+            {/await}
+        </p>
 
         <div class="mt-4 flex flex-col gap-2">
             {#each guesses as g, i (g)}
diff --git a/web/src/components/WordleLine.svelte b/web/src/components/WordleLine.svelte
index 78f90df..4424aeb 100644
--- a/web/src/components/WordleLine.svelte
+++ b/web/src/components/WordleLine.svelte
@@ -74,7 +74,7 @@
         </div>
     {/each}
     <span
-        class="w-12 text-sm text-zinc-500 self-center flex items-center justify-center"
+        class="w-16 text-sm text-zinc-500 self-center flex items-center justify-center"
     >
         {#if info_gained === null}
             ↵
@@ -84,7 +84,7 @@
                     class="size-3 animate-spin rounded-full border-2 border-gray-300 border-t-gray-700"
                 ></div>
             {:then i}
-                {i.toFixed(2)}
+                {i.info_gained.toFixed(2)} bits
             {:catch e}
                 <span
                     title={e}
diff --git a/web/src/solver/solver.ts b/web/src/solver/solver.ts
index 9fa1cbe..965744f 100644
--- a/web/src/solver/solver.ts
+++ b/web/src/solver/solver.ts
@@ -1,6 +1,6 @@
 import type { Color } from "wordle-solver";
 import SolverWorker from "./worker?worker";
-import type { SolverRequest, SolverResponse } from "./types";
+import type { GuessResult, SolutionSpaceResult, SolverRequest, SolverResponse } from "./types";
 
 let solver_worker = new SolverWorker();
 
@@ -11,7 +11,7 @@ const pending = new Map<number, {
   reject: (error: unknown) => void;
 }>();
 
-export function solver_guess(word: string[], colors: Color[]): Promise<number> {
+export function solver_guess(word: string[], colors: Color[]): Promise<GuessResult> {
   const id = msg_id++;
 
   return new Promise((resolve, reject) => {
@@ -22,7 +22,23 @@ export function solver_guess(word: string[], colors: Color[]): Promise<number> {
       id: id,
       input: { word: word, colors: colors },
     };
-    
+
+    solver_worker.postMessage(JSON.parse(JSON.stringify(r)));
+  });
+}
+
+export function solver_solution_space(): Promise<SolutionSpaceResult> {
+  const id = msg_id++;
+  
+  return new Promise((resolve, reject) => {
+    pending.set(id, { resolve, reject });
+
+    const r: SolverRequest = {
+      type: "solution_space",
+      id: id,
+      input: null,
+    };
+
     solver_worker.postMessage(JSON.parse(JSON.stringify(r)));
   });
 }
@@ -37,12 +53,12 @@ solver_worker.onmessage = (event: MessageEvent<SolverResponse>) => {
   }
 
   pending.delete(res.id);
-  
+
   if (res.error) {
-    pendingRequest.reject(res.result);
-  } else if (res.type == "guess") {
-    pendingRequest.resolve(res.result.info_gained);
-  } else if (event.type == "evaluate_words") {
-    pendingRequest.resolve(res.result.stats);
+    pendingRequest.reject(res.error);
+  } else if (res.result) {
+    pendingRequest.resolve(res.result);
+  } else {
+    pendingRequest.reject("No result");
   }
 };
diff --git a/web/src/solver/types.ts b/web/src/solver/types.ts
index e62cf65..5ae557d 100644
--- a/web/src/solver/types.ts
+++ b/web/src/solver/types.ts
@@ -10,20 +10,31 @@ export type SolverRequest =
     type: "evaluate_words",
     id: number,
     input: EvaluateWords
+  }
+  | {
+    type: "solution_space",
+    id: number,
+    input: null,
   };
 
 export type SolverResponse =
   | {
     type: "guess",
     id: number,
-    error: boolean,
-    result: GuessResult | string
+    error: string | null,
+    result: GuessResult | null
   }
   | {
     type: "evaluate_words",
     id: number,
-    error: boolean,
-    result: EvaluateWordsResult | string
+    error: string | null,
+    result: EvaluateWordsResult | null
+  }
+  | {
+    type: "solution_space",
+    id: number,
+    error: string | null,
+    result: SolutionSpaceResult | null
   };
 
 export type Guess = {
@@ -42,3 +53,7 @@ export type WordStats = {
 export type EvaluateWordsResult = {
   stats: WordStats[]
 };
+export type SolutionSpaceResult = {
+  size: number,
+  uncertainty: number
+};
diff --git a/web/src/solver/worker.ts b/web/src/solver/worker.ts
index 39d1039..267a2da 100644
--- a/web/src/solver/worker.ts
+++ b/web/src/solver/worker.ts
@@ -1,7 +1,6 @@
 import { Solver } from "wordle-solver";
 import type { SolverRequest, SolverResponse } from "./types";
 
-
 let solver = Solver.new();
 
 self.onmessage = (event: MessageEvent<SolverRequest>) => {
@@ -16,7 +15,7 @@ self.onmessage = (event: MessageEvent<SolverRequest>) => {
         const response: SolverResponse = {
           type: "guess",
           id: request.id,
-          error: false,
+          error: null,
           result: { info_gained: infos[infos.length - 1] }
         };
 
@@ -27,8 +26,8 @@ self.onmessage = (event: MessageEvent<SolverRequest>) => {
         const response: SolverResponse = {
           type: "guess",
           id: request.id,
-          error: true,
-          result: e,
+          error: e,
+          result: null,
         };
 
         self.setTimeout(() => {
@@ -43,12 +42,27 @@ self.onmessage = (event: MessageEvent<SolverRequest>) => {
       const response: SolverResponse = {
         type: "evaluate_words",
         id: request.id,
-        error: true,
-        result: "Not implemented"
+        error: "not implemented",
+        result: null,
       };
 
       self.postMessage(JSON.parse(JSON.stringify(response)));
       break;
     };
+    case "solution_space": {
+      const response: SolverResponse = {
+        type: "solution_space",
+        id: request.id,
+        error: null,
+        result: {
+          size: solver.solution_space(),
+          uncertainty: solver.solution_space_uncertainty()
+        }
+      };
+      self.postMessage(JSON.parse(JSON.stringify(response)));
+      break;
+    };
   }
 };
+
+