From b2ad7e9e46963953523979c912a00bdcd23e5f8b Mon Sep 17 00:00:00 2001
From: Andrew Michael McNutt <mcnutt.andrew@gmail.com>
Date: Sun, 29 Sep 2024 18:47:22 -0600
Subject: [PATCH] take all of the suggestions at once

---
 .../SuggestionModificationToSelection.svelte  | 128 +++++++++---------
 .../src/linting/EvalResponse.svelte           |  66 ++++-----
 2 files changed, 96 insertions(+), 98 deletions(-)

diff --git a/apps/color-buddy/src/controls/SuggestionModificationToSelection.svelte b/apps/color-buddy/src/controls/SuggestionModificationToSelection.svelte
index abeec14..54f57f3 100644
--- a/apps/color-buddy/src/controls/SuggestionModificationToSelection.svelte
+++ b/apps/color-buddy/src/controls/SuggestionModificationToSelection.svelte
@@ -96,77 +96,75 @@
   >
     <Wand />
   </button>
-  <div slot="content" let:onClick>
-    <div class="flex flex-col w-full">
-      <label for="pal-prompt" class="italic text-sm">
+  <div slot="content" let:onClick class="flex flex-col w-full">
+    <label for="pal-prompt" class="italic text-sm">
+      <div>
+        Change {selectedColors.length ? "selected" : "all"} points with AI
+      </div>
+    </label>
+    {#if requestState === "loaded"}
+      {#each suggestedColorSets as suggestedColors, idx}
         <div>
-          Change {selectedColors.length ? "selected" : "all"} points with AI
+          <PalDiff
+            beforePal={selectedColors.length
+              ? toPal(selectedColors, currentPal, colorSpace)
+              : currentPal}
+            afterPal={toPal(suggestedColors, currentPal, colorSpace)}
+          />
         </div>
-      </label>
-      {#if requestState === "loaded"}
-        {#each suggestedColorSets as suggestedColors, idx}
-          <div>
-            <PalDiff
-              beforePal={selectedColors.length
-                ? toPal(selectedColors, currentPal, colorSpace)
-                : currentPal}
-              afterPal={toPal(suggestedColors, currentPal, colorSpace)}
-            />
-          </div>
-          <div class="flex justify-between">
-            <button
-              class={buttonStyle}
-              on:click={() => {
-                useSuggestion(idx);
-                onClick();
-              }}
-            >
-              Use
-            </button>
-            <button
-              class={buttonStyle}
-              on:click={() => {
-                suggestedColorSets = suggestedColorSets.filter(
-                  (_, jdx) => jdx !== idx
-                );
-                if (suggestedColorSets.length === 0) {
-                  requestState = "idle";
-                }
-              }}
-            >
-              Reject
-            </button>
-          </div>
-        {/each}
-      {:else}
-        <form
-          on:submit|preventDefault={makeRequest}
-          class="flex flex-col pr-2 w-full"
-        >
-          <textarea
-            bind:value={palPrompt}
-            on:keypress={(e) => {
-              if (e.key === "Enter") {
-                // @ts-ignore
-                e.target.blur();
-                makeRequest();
-              }
+        <div class="flex justify-between">
+          <button
+            class={buttonStyle}
+            on:click={() => {
+              useSuggestion(idx);
+              onClick();
             }}
-            id="pal-prompt"
-            class="indent-2 text-sm leading-6 border-2 w-full"
-            placeholder="e.g. 'Make them groovier' or 'Add two more colors'"
-          />
+          >
+            Use
+          </button>
           <button
             class={buttonStyle}
-            class:pointer-events-none={requestState === "loading"}
+            on:click={() => {
+              suggestedColorSets = suggestedColorSets.filter(
+                (_, jdx) => jdx !== idx
+              );
+              if (suggestedColorSets.length === 0) {
+                requestState = "idle";
+              }
+            }}
           >
-            {requestState === "loading" ? "loading..." : "Submit"}
+            Reject
           </button>
-        </form>
-      {/if}
-      {#if requestState === "failed"}
-        <div class="text-red-500">No suggestions found, please try again</div>
-      {/if}
-    </div>
+        </div>
+      {/each}
+    {:else}
+      <form
+        on:submit|preventDefault={makeRequest}
+        class="flex flex-col pr-2 w-full"
+      >
+        <textarea
+          bind:value={palPrompt}
+          on:keypress={(e) => {
+            if (e.key === "Enter") {
+              // @ts-ignore
+              e.target.blur();
+              makeRequest();
+            }
+          }}
+          id="pal-prompt"
+          class="indent-2 text-sm leading-6 border-2 w-full min-w-80"
+          placeholder="e.g. 'Make them groovier' or 'Add two more colors'"
+        />
+        <button
+          class={buttonStyle}
+          class:pointer-events-none={requestState === "loading"}
+        >
+          {requestState === "loading" ? "loading..." : "Submit"}
+        </button>
+      </form>
+    {/if}
+    {#if requestState === "failed"}
+      <div class="text-red-500">No suggestions found, please try again</div>
+    {/if}
   </div>
 </Tooltip>
diff --git a/apps/color-buddy/src/linting/EvalResponse.svelte b/apps/color-buddy/src/linting/EvalResponse.svelte
index f4d9f6c..48c670b 100644
--- a/apps/color-buddy/src/linting/EvalResponse.svelte
+++ b/apps/color-buddy/src/linting/EvalResponse.svelte
@@ -26,12 +26,12 @@
 
   $: palette = $colorStore.palettes[$colorStore.currentPal];
   $: engine = $configStore.engine;
-  $: suggestions = [] as { pal: Palette; label: string }[];
+  type FixSuggestion = { pal: Palette; label: string; fixesIssue: boolean };
+  $: suggestions = [] as FixSuggestion[];
   $: colorSpace = palette.colorSpace;
   $: lintProgram = lintResult.lintProgram;
 
   function proposeFix(fixType: "ai" | "monte" | "heuristic", label: string) {
-    requestState = "loading";
     let hasRetried = false;
     const getFix = () => {
       let fix;
@@ -42,22 +42,25 @@
       } else {
         fix = suggestLintFix(palette, lintResult);
       }
-      return fix.then((x) => {
-        suggestions = [...suggestions, ...x.map((pal) => ({ pal, label }))];
-        requestState = "loaded";
-        logEvent(
-          "lint-fix",
-          {
-            fixType,
-            errorName: lintProgram.name,
-            lintProgram: lintProgram.program,
-            palette: palette.colors.map((x) => x.toDisplay()),
-            background: palette.background.toDisplay(),
-            fix: x.map((y) => y.colors.map((z) => z.toDisplay())),
-          },
-          $configStore.userName
-        );
-      });
+      return fix
+        .then((x) => x.map((pal) => ({ pal, label })).at(0))
+
+        .then((x) => {
+          suggestions = [...suggestions, x].filter((x) => x) as FixSuggestion[];
+          requestState = "loaded";
+          logEvent(
+            "lint-fix",
+            {
+              fixType,
+              errorName: lintProgram.name,
+              lintProgram: lintProgram.program,
+              palette: palette.colors.map((x) => x.toDisplay()),
+              background: palette.background.toDisplay(),
+              fix: x?.pal?.colors.map((z) => z.toDisplay()),
+            },
+            $configStore.userName
+          );
+        });
     };
 
     getFix().catch((e) => {
@@ -70,6 +73,16 @@
       }
     });
   }
+  function generateFixes() {
+    proposeFix("ai", "LLMs");
+    if (lintProgram && lintProgram.program.length) {
+      proposeFix("monte", "Monte Carlo");
+    }
+    if (lintProgram.subscribedFix && lintProgram.subscribedFix !== "none") {
+      proposeFix("heuristic", "Hand tuned fix");
+    }
+  }
+
   $: currentPal = $colorStore.palettes[$colorStore.currentPal];
   $: evalConfig = currentPal.evalConfig;
 
@@ -123,22 +136,9 @@
 
     {#if lintResult.kind === "success" && !lintResult.passes}
       <!-- hiding the LLM based solution, bc it works poorly -->
-      <button class={buttonStyle} on:click={() => proposeFix("ai", "LLM")}>
-        Try to fix (LLM)
+      <button on:click={generateFixes} class={buttonStyle}>
+        Suggest Fixes
       </button>
-      {#if lintProgram && lintProgram.program.length}
-        <button class={buttonStyle} on:click={() => proposeFix("monte", "AI")}>
-          Try to fix (AI)
-        </button>
-      {/if}
-      {#if lintProgram.subscribedFix && lintProgram.subscribedFix !== "none"}
-        <button
-          class={buttonStyle}
-          on:click={() => proposeFix("heuristic", "ColorBuddy")}
-        >
-          Try to fix (ColorBuddy)
-        </button>
-      {/if}
     {/if}
 
     {#if !ignored}