feat(tools): set up proper CI (#2)

### Explanation _No response_ ### Issue _No response_ ### Attestations - [ ] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/) - [ ] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/). - [ ] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/). ### Dependencies - [ ] I have pinned the dependencies to a specific patch version. ### Style - [ ] I have run the linter and resolved any errors. - [ ] My pull request uses an appropriate title, matching the conventional commit standards. - [ ] My scope of feat/fix/chore/etc. correctly matches the nature of changes in my pull request. ### Tests - [ ] My contribution adds new code, and I have added tests to cover it. - [ ] My contribution modifies existing code, and I have updated the tests to reflect these changes. - [ ] All new and existing tests pass locally with my changes. - [ ] Code coverage remains at or above the configured threshold. ### Documentation _No response_ ### Versioning _No response_ Reviewed-on: #2 Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com> Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2026-01-15 20:06:47 -08:00
parent bd04328e40
commit c241544743
80 changed files with 2689 additions and 266 deletions
@@ -81,8 +81,12 @@
  </div>

  <div class="speech-bubble mt-4 max-w-xs">
-    <div class="relative bg-[var(--bg-secondary)] rounded-lg px-4 py-2 border border-[var(--border-color)]">
-      <div class="absolute -top-2 left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-transparent border-b-[var(--bg-secondary)]"></div>
+    <div
+      class="relative bg-[var(--bg-secondary)] rounded-lg px-4 py-2 border border-[var(--border-color)]"
+    >
+      <div
+        class="absolute -top-2 left-1/2 transform -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-transparent border-b-[var(--bg-secondary)]"
+      ></div>
      <p class="text-sm text-gray-300 text-center italic">{info.description}</p>
    </div>
  </div>
@@ -123,7 +127,8 @@
  }

  @keyframes idle-bob {
-    0%, 100% {
+    0%,
+    100% {
      transform: translateY(0);
    }
    50% {
@@ -132,7 +137,8 @@
  }

  @keyframes thinking-sway {
-    0%, 100% {
+    0%,
+    100% {
      transform: rotate(-2deg);
    }
    50% {
@@ -141,7 +147,8 @@
  }

  @keyframes typing-bounce {
-    0%, 100% {
+    0%,
+    100% {
      transform: translateY(0) scale(1);
    }
    50% {
@@ -150,7 +157,8 @@
  }

  @keyframes searching-look {
-    0%, 100% {
+    0%,
+    100% {
      transform: translateX(0);
    }
    25% {
@@ -162,7 +170,8 @@
  }

  @keyframes celebrate {
-    0%, 100% {
+    0%,
+    100% {
      transform: scale(1) rotate(0deg);
    }
    25% {
@@ -177,13 +186,21 @@
  }

  @keyframes shake {
-    0%, 100% {
+    0%,
+    100% {
      transform: translateX(0);
    }
-    10%, 30%, 50%, 70%, 90% {
+    10%,
+    30%,
+    50%,
+    70%,
+    90% {
      transform: translateX(-5px);
    }
-    20%, 40%, 60%, 80% {
+    20%,
+    40%,
+    60%,
+    80% {
      transform: translateX(5px);
    }
  }
@@ -37,7 +37,10 @@

      claudeStore.grantTool(approvedTool);
      const newGrantedTools = [...grantedToolsList, approvedTool];
-      claudeStore.addLine("system", `Permission granted for: ${approvedTool}. Reconnecting with context...`);
+      claudeStore.addLine(
+        "system",
+        `Permission granted for: ${approvedTool}. Reconnecting with context...`
+      );
      claudeStore.clearPermission();

      // Stop current session and reconnect with new permissions
@@ -97,8 +100,12 @@ Please continue where we left off and retry that action now that you have permis
 </script>

 {#if isVisible && permission}
-  <div class="permission-overlay fixed inset-0 bg-black/70 flex items-center justify-center z-50 backdrop-blur-sm">
-    <div class="permission-modal bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-xl p-6 max-w-md w-full mx-4 shadow-2xl">
+  <div
+    class="permission-overlay fixed inset-0 bg-black/70 flex items-center justify-center z-50 backdrop-blur-sm"
+  >
+    <div
+      class="permission-modal bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-xl p-6 max-w-md w-full mx-4 shadow-2xl"
+    >
      <div class="flex items-center gap-3 mb-4">
        <div class="w-10 h-10 rounded-full bg-yellow-500/20 flex items-center justify-center">
          <span class="text-xl">🔐</span>
@@ -117,10 +124,14 @@ Please continue where we left off and retry that action now that you have permis

      <div class="mb-4">
        <div class="text-sm text-gray-400 mb-1">Tool</div>
-        <div class="px-3 py-2 bg-[var(--bg-secondary)] rounded-md text-[var(--accent-primary)] font-mono flex items-center justify-between">
+        <div
+          class="px-3 py-2 bg-[var(--bg-secondary)] rounded-md text-[var(--accent-primary)] font-mono flex items-center justify-between"
+        >
          <span>{permission.tool}</span>
          {#if isToolAlreadyGranted(permission.tool)}
-            <span class="text-xs text-green-400 bg-green-500/20 px-2 py-0.5 rounded">Already Granted</span>
+            <span class="text-xs text-green-400 bg-green-500/20 px-2 py-0.5 rounded"
+              >Already Granted</span
+            >
          {/if}
        </div>
      </div>
@@ -135,7 +146,10 @@ Please continue where we left off and retry that action now that you have permis
      {#if Object.keys(permission.input).length > 0}
        <div class="mb-6">
          <div class="text-sm text-gray-400 mb-1">Details</div>
-          <pre class="px-3 py-2 bg-[var(--bg-terminal)] rounded-md text-gray-300 text-xs overflow-x-auto max-h-32">{formatInput(permission.input)}</pre>
+          <pre
+            class="px-3 py-2 bg-[var(--bg-terminal)] rounded-md text-gray-300 text-xs overflow-x-auto max-h-32">{formatInput(
+              permission.input
+            )}</pre>
        </div>
      {/if}

@@ -101,7 +101,9 @@
  }
 </script>

-<div class="status-bar flex items-center justify-between px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)]">
+<div
+  class="status-bar flex items-center justify-between px-4 py-2 bg-[var(--bg-secondary)] border-b border-[var(--border-color)]"
+>
  <div class="flex items-center gap-4">
    <div class="flex items-center gap-2">
      <div class="w-2.5 h-2.5 rounded-full {getStatusColor()}"></div>
@@ -111,7 +113,8 @@
    {#if connectionStatus === "connected"}
      {#if workingDirectory}
        <div class="text-sm text-gray-500">
-          <span class="text-gray-600">cwd:</span> {workingDirectory}
+          <span class="text-gray-600">cwd:</span>
+          {workingDirectory}
        </div>
      {/if}
    {:else}
@@ -143,7 +146,9 @@
      title="Join our Discord"
    >
      <svg class="w-5 h-5" viewBox="0 0 24 24" fill="currentColor">
-        <path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418z"/>
+        <path
+          d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418z"
+        />
      </svg>
    </button>
    {#if appVersion}
@@ -1,6 +1,6 @@
 <script lang="ts">
  import { claudeStore, type TerminalLine } from "$lib/stores/claude";
-  import { onMount, afterUpdate } from "svelte";
+  import { afterUpdate } from "svelte";

  let terminalElement: HTMLDivElement;
  let shouldAutoScroll = true;
@@ -67,7 +67,9 @@
 <div
  class="terminal-container flex-1 overflow-hidden rounded-lg bg-[var(--bg-terminal)] border border-[var(--border-color)]"
 >
-  <div class="terminal-header flex items-center gap-2 px-4 py-2 border-b border-[var(--border-color)] bg-[var(--bg-secondary)]">
+  <div
+    class="terminal-header flex items-center gap-2 px-4 py-2 border-b border-[var(--border-color)] bg-[var(--bg-secondary)]"
+  >
    <div class="flex gap-1.5">
      <div class="w-3 h-3 rounded-full bg-red-500"></div>
      <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
@@ -82,9 +84,7 @@
    class="terminal-content h-[calc(100%-40px)] overflow-y-auto p-4 font-mono text-sm"
  >
    {#if lines.length === 0}
-      <div class="text-gray-500 italic">
-        Waiting for Claude... Type a message below to start!
-      </div>
+      <div class="text-gray-500 italic">Waiting for Claude... Type a message below to start!</div>
    {:else}
      {#each lines as line (line.id)}
        <div class="terminal-line mb-2 {getLineClass(line.type)}">