generated from nhcarrigan/template
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>
This commit was merged in pull request #2.
This commit is contained in:
@@ -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)}">
|
||||
|
||||
@@ -2,7 +2,7 @@ import { writable, derived } from "svelte/store";
|
||||
import { CHARACTER_STATES, type CharacterState } from "$lib/types/states";
|
||||
|
||||
function createCharacterStore() {
|
||||
const { subscribe, set, update } = writable<CharacterState>("idle");
|
||||
const { subscribe, set } = writable<CharacterState>("idle");
|
||||
|
||||
let stateTimeout: ReturnType<typeof setTimeout> | null = null;
|
||||
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
import { writable, derived } from "svelte/store";
|
||||
import type {
|
||||
ConnectionStatus,
|
||||
PermissionRequest,
|
||||
ClaudeStreamMessage,
|
||||
} from "$lib/types/messages";
|
||||
import type { ConnectionStatus, PermissionRequest } from "$lib/types/messages";
|
||||
|
||||
export interface TerminalLine {
|
||||
id: string;
|
||||
|
||||
+1
-1
@@ -65,7 +65,7 @@ export async function initializeTauriListeners() {
|
||||
);
|
||||
});
|
||||
|
||||
await listen<string>("claude:stream", (event) => {
|
||||
await listen<string>("claude:stream", () => {
|
||||
// no-op
|
||||
});
|
||||
|
||||
|
||||
@@ -0,0 +1,240 @@
|
||||
import { describe, it, expect } from "vitest";
|
||||
import { mapMessageToState, extractTextFromMessage, extractToolInfo } from "./stateMapper";
|
||||
import type { ClaudeStreamMessage } from "$lib/types/messages";
|
||||
|
||||
describe("stateMapper", () => {
|
||||
describe("mapMessageToState", () => {
|
||||
it("returns idle for system init message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "system",
|
||||
subtype: "init",
|
||||
session_id: "test-session",
|
||||
cwd: "/home/test",
|
||||
tools: ["Read", "Write", "Edit"],
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("idle");
|
||||
});
|
||||
|
||||
it("returns null for non-init system messages", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "system",
|
||||
subtype: "compact_boundary",
|
||||
};
|
||||
expect(mapMessageToState(message)).toBeNull();
|
||||
});
|
||||
|
||||
it("returns searching for Read tool", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "Read",
|
||||
input: { file_path: "/test/file.txt" },
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("searching");
|
||||
});
|
||||
|
||||
it("returns coding for Edit tool", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "Edit",
|
||||
input: { file_path: "/test/file.txt", old_string: "foo", new_string: "bar" },
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("coding");
|
||||
});
|
||||
|
||||
it("returns mcp for mcp__ prefixed tools", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "mcp__github__list_repos",
|
||||
input: {},
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("mcp");
|
||||
});
|
||||
|
||||
it("returns thinking for Task tool", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "Task",
|
||||
input: { prompt: "test task" },
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("thinking");
|
||||
});
|
||||
|
||||
it("returns typing for text content", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [{ type: "text", text: "Hello, Naomi!" }],
|
||||
model: "claude-3",
|
||||
stop_reason: "end_turn",
|
||||
},
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("typing");
|
||||
});
|
||||
|
||||
it("returns success for result success message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "result",
|
||||
subtype: "success",
|
||||
result: "Task completed",
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("success");
|
||||
});
|
||||
|
||||
it("returns error for result error message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "result",
|
||||
subtype: "error_max_turns",
|
||||
};
|
||||
expect(mapMessageToState(message)).toBe("error");
|
||||
});
|
||||
|
||||
it("returns null for user messages", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "user",
|
||||
message: { content: [{ type: "text", text: "Hello" }] },
|
||||
};
|
||||
expect(mapMessageToState(message)).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
describe("extractTextFromMessage", () => {
|
||||
it("extracts text from assistant message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{ type: "text", text: "Hello!" },
|
||||
{ type: "text", text: "How are you?" },
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "end_turn",
|
||||
},
|
||||
};
|
||||
expect(extractTextFromMessage(message)).toBe("Hello!\nHow are you?");
|
||||
});
|
||||
|
||||
it("returns null for assistant message without text", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "Read",
|
||||
input: { file_path: "/test/file.txt" },
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
expect(extractTextFromMessage(message)).toBeNull();
|
||||
});
|
||||
|
||||
it("extracts text from stream_event delta", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "stream_event",
|
||||
event: {
|
||||
type: "content_block_delta",
|
||||
index: 0,
|
||||
delta: { type: "text_delta", text: "streaming text" },
|
||||
},
|
||||
};
|
||||
expect(extractTextFromMessage(message)).toBe("streaming text");
|
||||
});
|
||||
|
||||
it("extracts result from result message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "result",
|
||||
subtype: "success",
|
||||
result: "Completed successfully",
|
||||
};
|
||||
expect(extractTextFromMessage(message)).toBe("Completed successfully");
|
||||
});
|
||||
});
|
||||
|
||||
describe("extractToolInfo", () => {
|
||||
it("extracts tool info from assistant message", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "assistant",
|
||||
message: {
|
||||
content: [
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-1",
|
||||
name: "Read",
|
||||
input: { file_path: "/test/file.txt" },
|
||||
},
|
||||
{
|
||||
type: "tool_use",
|
||||
id: "tool-2",
|
||||
name: "Edit",
|
||||
input: { file_path: "/test/file.txt", old_string: "a", new_string: "b" },
|
||||
},
|
||||
],
|
||||
model: "claude-3",
|
||||
stop_reason: "tool_use",
|
||||
},
|
||||
};
|
||||
const tools = extractToolInfo(message);
|
||||
expect(tools).toHaveLength(2);
|
||||
expect(tools[0]).toEqual({
|
||||
name: "Read",
|
||||
input: { file_path: "/test/file.txt" },
|
||||
});
|
||||
expect(tools[1]).toEqual({
|
||||
name: "Edit",
|
||||
input: { file_path: "/test/file.txt", old_string: "a", new_string: "b" },
|
||||
});
|
||||
});
|
||||
|
||||
it("returns empty array for non-assistant messages", () => {
|
||||
const message: ClaudeStreamMessage = {
|
||||
type: "user",
|
||||
message: { content: [{ type: "text", text: "Hello" }] },
|
||||
};
|
||||
expect(extractToolInfo(message)).toEqual([]);
|
||||
});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user