Compare commits

..

4 Commits

Author SHA1 Message Date
naomi ac84366716 feat: add automatic greeting upon connection (#42)
CI / Lint & Test (push) Successful in 14m0s
CI / Build Linux (push) Successful in 16m33s
CI / Build Windows (cross-compile) (push) Successful in 26m23s
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 1m5s
### Explanation

_No response_

### Issue

Closes #23

### 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: #42
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2026-01-16 15:10:28 -08:00
naomi 2220c26c5e feat: add ability to configure the agent (also theme switcher) (#3)
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 57s
CI / Lint & Test (push) Successful in 13m59s
CI / Build Linux (push) Successful in 16m25s
CI / Build Windows (cross-compile) (push) Successful in 26m30s
### 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: #3
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2026-01-16 11:56:17 -08:00
naomi c241544743 feat(tools): set up proper CI (#2)
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 57s
CI / Lint & Test (push) Successful in 14m1s
CI / Build Linux (push) Successful in 16m8s
CI / Build Windows (cross-compile) (push) Successful in 26m18s
### 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
naomi bd04328e40 feat: add windows build woooooo (#1)
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 51s
### Explanation

_No response_

### Issue

_No response_

### Attestations

- [x] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/)
- [x] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/).
- [x] 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

Minor - My pull request introduces a new non-breaking feature.

Reviewed-on: #1
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2026-01-15 10:05:22 -08:00
88 changed files with 3649 additions and 268 deletions
+1
View File
@@ -8,3 +8,4 @@
*.jpg binary
*.icons binary
*.ico binary
*.icns binary
+2 -3
View File
@@ -1,6 +1,6 @@
name: 🐛 Bug Report
description: Something isn't working as expected? Let us know!
title: '[BUG] - '
title: "[BUG] - "
labels:
- "status/awaiting triage"
body:
@@ -50,7 +50,7 @@ body:
description: The operating system you are using, including the version/build number.
validations:
required: true
# Remove this section for non-web apps.
# Remove this section for non-web apps.
- type: input
id: browser
attributes:
@@ -66,4 +66,3 @@ body:
- No
validations:
required: true
+1 -1
View File
@@ -1,6 +1,6 @@
name: 💭 Feature Proposal
description: Have an idea for how we can improve? Share it here!
title: '[FEAT] - '
title: "[FEAT] - "
labels:
- "status/awaiting triage"
body:
+1 -1
View File
@@ -1,6 +1,6 @@
name: ❓ Other Issue
description: I have something that is neither a bug nor a feature request.
title: '[OTHER] - '
title: "[OTHER] - "
labels:
- "status/awaiting triage"
body:
+189
View File
@@ -0,0 +1,189 @@
name: CI
on:
push:
branches: [main]
pull_request:
branches: [main]
workflow_dispatch:
jobs:
lint-and-test:
name: Lint & Test
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v4
- name: Install Linux dependencies
run: |
sudo apt-get update
sudo apt-get install -y \
libwebkit2gtk-4.1-dev \
librsvg2-dev \
patchelf \
libgtk-3-dev \
libayatana-appindicator3-dev
- name: Setup pnpm
uses: pnpm/action-setup@v4
with:
version: 9
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 22
cache: pnpm
- name: Install frontend dependencies
run: pnpm install
- name: Run ESLint
run: pnpm lint
- name: Run Prettier check
run: pnpm format:check
- name: Run Svelte Check
run: pnpm check
- name: Run frontend tests
run: pnpm test
- name: Setup Rust
uses: dtolnay/rust-toolchain@stable
with:
components: clippy
- name: Cache Rust dependencies
uses: actions/cache@v4
with:
path: |
~/.cargo/bin/
~/.cargo/registry/index/
~/.cargo/registry/cache/
~/.cargo/git/db/
src-tauri/target/
key: ${{ runner.os }}-cargo-${{ hashFiles('**/Cargo.lock') }}
- name: Run Clippy
working-directory: src-tauri
run: cargo clippy --all-targets --all-features -- -D warnings
- name: Run Rust tests
working-directory: src-tauri
run: cargo test
build-linux:
name: Build Linux
runs-on: ubuntu-latest
needs: lint-and-test
steps:
- name: Checkout code
uses: actions/checkout@v4
- name: Install Linux dependencies
run: |
sudo apt-get update
sudo apt-get install -y \
libwebkit2gtk-4.1-dev \
librsvg2-dev \
patchelf \
libgtk-3-dev \
libayatana-appindicator3-dev \
xdg-utils
- name: Setup pnpm
uses: pnpm/action-setup@v4
with:
version: 9
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 22
cache: pnpm
- name: Install frontend dependencies
run: pnpm install
- name: Setup Rust
uses: dtolnay/rust-toolchain@stable
- name: Cache Rust dependencies
uses: actions/cache@v4
with:
path: |
~/.cargo/bin/
~/.cargo/registry/index/
~/.cargo/registry/cache/
~/.cargo/git/db/
src-tauri/target/
key: ${{ runner.os }}-cargo-${{ hashFiles('**/Cargo.lock') }}
- name: Build Linux
run: pnpm build:linux
build-windows:
name: Build Windows (cross-compile)
runs-on: ubuntu-latest
needs: lint-and-test
steps:
- name: Checkout code
uses: actions/checkout@v4
- name: Install Linux dependencies for cross-compilation
run: |
sudo apt-get update
sudo apt-get install -y \
libwebkit2gtk-4.1-dev \
librsvg2-dev \
patchelf \
libgtk-3-dev \
libayatana-appindicator3-dev \
clang \
lld \
llvm \
nsis
- name: Setup pnpm
uses: pnpm/action-setup@v4
with:
version: 9
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 22
cache: pnpm
- name: Install frontend dependencies
run: pnpm install
- name: Setup Rust
uses: dtolnay/rust-toolchain@stable
with:
targets: x86_64-pc-windows-msvc
- name: Install cargo-xwin
run: |
curl -fsSL https://github.com/rust-cross/cargo-xwin/releases/download/v0.20.2/cargo-xwin-v0.20.2.x86_64-unknown-linux-musl.tar.gz | tar xz
sudo mv cargo-xwin /usr/local/bin/
- name: Cache Rust dependencies
uses: actions/cache@v4
with:
path: |
~/.cargo/bin/
~/.cargo/registry/index/
~/.cargo/registry/cache/
~/.cargo/git/db/
src-tauri/target/
key: ${{ runner.os }}-cargo-windows-${{ hashFiles('**/Cargo.lock') }}
- name: Build Windows
run: pnpm build:windows
+3 -3
View File
@@ -2,11 +2,11 @@ name: Security Scan and Upload
on:
push:
branches: [ main ]
branches: [main]
pull_request:
branches: [ main ]
branches: [main]
schedule:
- cron: '0 0 * * 1'
- cron: "0 0 * * 1"
workflow_dispatch:
jobs:
+7
View File
@@ -0,0 +1,7 @@
build/
.svelte-kit/
dist/
src-tauri/target/
node_modules/
.pnpm-store/
pnpm-lock.yaml
+16
View File
@@ -0,0 +1,16 @@
{
"semi": true,
"singleQuote": false,
"tabWidth": 2,
"trailingComma": "es5",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"overrides": [
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
]
}
+1 -5
View File
@@ -1,7 +1,3 @@
{
"recommendations": [
"svelte.svelte-vscode",
"tauri-apps.tauri-vscode",
"rust-lang.rust-analyzer"
]
"recommendations": ["svelte.svelte-vscode", "tauri-apps.tauri-vscode", "rust-lang.rust-analyzer"]
}
+1 -146
View File
@@ -1,146 +1 @@
# Hikari Desktop
A Linux desktop application that wraps Claude Code with an anime girl character that reacts to Claude's activities in real-time.
## Features
- Visual character that reflects Claude's current state (thinking, typing, searching, coding, etc.)
- Terminal-style output display
- Permission prompts with approve/deny interface
- Real-time state detection from Claude Code's NDJSON stream
## Installation
### 1. Install Claude Code
Hikari Desktop requires Claude Code to be installed and authenticated:
```bash
npm install -g @anthropic-ai/claude-code
claude # Follow the prompts to authenticate
```
### 2. Install Runtime Dependencies
**Debian/Ubuntu:**
```bash
sudo apt install libwebkit2gtk-4.1-0 libgtk-3-0 libayatana-appindicator3-1 xdg-utils
```
**Fedora:**
```bash
sudo dnf install webkit2gtk4.1 gtk3 libappindicator-gtk3 xdg-utils
```
**Arch Linux:**
```bash
sudo pacman -S webkit2gtk-4.1 gtk3 libappindicator-gtk3 xdg-utils
```
| Package | Purpose |
|---------|---------|
| webkit2gtk-4.1 | WebView rendering (app UI) |
| gtk3 | Window management and native widgets |
| libappindicator | System tray support |
| xdg-utils | Opening URLs/files with default applications |
### 3. Install Hikari Desktop
Download the latest release for your distribution:
**AppImage** (any distro):
```bash
chmod +x hikari-desktop_*.AppImage
./hikari-desktop_*.AppImage
```
**Debian/Ubuntu:**
```bash
sudo dpkg -i hikari-desktop_*.deb
```
**Fedora:**
```bash
sudo rpm -i hikari-desktop-*.rpm
```
## Character States
| State | Trigger |
|-------|---------|
| Idle | Waiting for user input |
| Thinking | Processing/API call in progress |
| Typing | Streaming text output |
| Searching | Using Read/Glob/Grep tools |
| Coding | Using Edit/Write tools |
| MCP | Running MCP tool calls |
| Permission | Permission prompt needed |
| Success | Task completed |
| Error | Error occurred |
## Building from Source
### Prerequisites
- Node.js and pnpm
- Rust toolchain
### Build
```bash
# Install dependencies
pnpm install
# Development mode
pnpm run dev
# Build for Linux
pnpm tauri build
```
## Architecture
```
Linux (Tauri App)
├── Svelte Frontend
│ ├── AnimeGirl (sprites + animations)
│ ├── Terminal (output display)
│ ├── InputBar (user input)
│ └── PermissionModal (approve/deny)
└── Rust Backend
├── Process Manager (spawn & communicate)
└── State Parser (NDJSON → character state)
│ stdin/stdout (NDJSON stream)
claude -p --output-format stream-json --input-format stream-json
```
## Tech Stack
- **Tauri 2.x** - Desktop framework with Rust backend
- **Svelte 5** - Reactive frontend with runes
- **Tailwind CSS** - Styling
- **Tokio** - Async runtime for process management
## Feedback and Bugs
If you have feedback or a bug report, please feel free to open a ticket request in our [Discord](https://chat.nhcarrigan.com)!
## Contributing
If you would like to contribute to the project, you may create a Pull Request containing your proposed changes and we will review it as soon as we are able! Please review our [contributing guidelines](CONTRIBUTING.md) first.
## Code of Conduct
Before interacting with our community, please read our [Code of Conduct](CODE_OF_CONDUCT.md).
## License
This software is licensed under our [global software license](https://docs.nhcarrigan.com/#/license).
Copyright held by Naomi Carrigan.
## Contact
We may be contacted through our [Chat Server](http://chat.nhcarrigan.com) or via email at `contact@nhcarrigan.com`.
tem
+32
View File
@@ -0,0 +1,32 @@
import js from "@eslint/js";
import tseslint from "typescript-eslint";
import svelte from "eslint-plugin-svelte";
import prettier from "eslint-config-prettier";
import globals from "globals";
export default tseslint.config(
js.configs.recommended,
...tseslint.configs.recommended,
...svelte.configs["flat/recommended"],
prettier,
...svelte.configs["flat/prettier"],
{
languageOptions: {
globals: {
...globals.browser,
...globals.node,
},
},
},
{
files: ["**/*.svelte", "**/*.svelte.ts", "**/*.svelte.js"],
languageOptions: {
parserOptions: {
parser: tseslint.parser,
},
},
},
{
ignores: ["build/", ".svelte-kit/", "dist/", "src-tauri/target/", "node_modules/"],
}
);
+26 -3
View File
@@ -9,25 +9,48 @@
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"tauri": "tauri"
"tauri": "tauri",
"build:linux": "tauri build",
"build:windows": "tauri build --runner cargo-xwin --target x86_64-pc-windows-msvc",
"build:all": "pnpm build:linux && pnpm build:windows",
"test": "vitest run",
"test:watch": "vitest",
"test:coverage": "vitest run --coverage",
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"format": "prettier --write .",
"format:check": "prettier --check ."
},
"license": "MIT",
"dependencies": {
"@tauri-apps/api": "^2",
"@tauri-apps/plugin-dialog": "^2",
"@tauri-apps/plugin-opener": "^2",
"@tauri-apps/plugin-shell": "^2.3.4"
"@tauri-apps/plugin-shell": "^2.3.4",
"@tauri-apps/plugin-store": "^2"
},
"devDependencies": {
"@eslint/js": "^9.39.2",
"@sveltejs/adapter-static": "^3.0.6",
"@sveltejs/kit": "^2.9.0",
"@sveltejs/vite-plugin-svelte": "^5.0.0",
"@tailwindcss/vite": "^4.1.18",
"@tauri-apps/cli": "^2",
"@testing-library/jest-dom": "^6.9.1",
"@testing-library/svelte": "^5.3.1",
"eslint": "^9.39.2",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-svelte": "^3.14.0",
"globals": "^17.0.0",
"jsdom": "^27.4.0",
"prettier": "^3.8.0",
"prettier-plugin-svelte": "^3.4.1",
"svelte": "^5.0.0",
"svelte-check": "^4.0.0",
"tailwindcss": "^4.1.18",
"typescript": "~5.6.2",
"vite": "^6.0.3"
"typescript-eslint": "^8.53.0",
"vite": "^6.0.3",
"vitest": "^4.0.17"
}
}
+1808
View File
File diff suppressed because it is too large Load Diff
+18
View File
@@ -1403,6 +1403,8 @@ dependencies = [
"tauri-plugin-dialog",
"tauri-plugin-opener",
"tauri-plugin-shell",
"tauri-plugin-store",
"tempfile",
"tokio",
"uuid",
]
@@ -3761,6 +3763,22 @@ dependencies = [
"tokio",
]
[[package]]
name = "tauri-plugin-store"
version = "2.4.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "5ca1a8ff83c269b115e98726ffc13f9e548a10161544a92ad121d6d0a96e16ea"
dependencies = [
"dunce",
"serde",
"serde_json",
"tauri",
"tauri-plugin",
"thiserror 2.0.17",
"tokio",
"tracing",
]
[[package]]
name = "tauri-runtime"
version = "2.9.2"
+2
View File
@@ -22,4 +22,6 @@ serde_json = "1"
tokio = { version = "1", features = ["full"] }
parking_lot = "0.12"
uuid = { version = "1", features = ["v4"] }
tauri-plugin-store = "2.4.2"
tempfile = "3"
Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.8 KiB

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 974 B

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 7.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.6 KiB

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 903 B

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.4 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 6.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
<background android:drawable="@color/ic_launcher_background"/>
</adaptive-icon>
Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="ic_launcher_background">#fff</color>
</resources>
Binary file not shown.
Binary file not shown.

Before

Width:  |  Height:  |  Size: 85 KiB

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 878 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 123 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

+33 -3
View File
@@ -1,16 +1,19 @@
use tauri::{AppHandle, State};
use tauri_plugin_store::StoreExt;
use crate::config::{ClaudeStartOptions, HikariConfig};
use crate::wsl_bridge::SharedBridge;
const CONFIG_STORE_KEY: &str = "config";
#[tauri::command]
pub async fn start_claude(
app: AppHandle,
bridge: State<'_, SharedBridge>,
working_dir: String,
allowed_tools: Option<Vec<String>>,
options: ClaudeStartOptions,
) -> Result<(), String> {
let mut bridge = bridge.lock();
bridge.start(app, &working_dir, allowed_tools.unwrap_or_default())
bridge.start(app, options)
}
#[tauri::command]
@@ -42,3 +45,30 @@ pub async fn get_working_directory(bridge: State<'_, SharedBridge>) -> Result<St
pub async fn select_wsl_directory() -> Result<String, String> {
Ok("/home".to_string())
}
#[tauri::command]
pub async fn get_config(app: AppHandle) -> Result<HikariConfig, String> {
let store = app
.store("hikari-config.json")
.map_err(|e| e.to_string())?;
match store.get(CONFIG_STORE_KEY) {
Some(value) => {
serde_json::from_value(value.clone()).map_err(|e| e.to_string())
}
None => Ok(HikariConfig::default()),
}
}
#[tauri::command]
pub async fn save_config(app: AppHandle, config: HikariConfig) -> Result<(), String> {
let store = app
.store("hikari-config.json")
.map_err(|e| e.to_string())?;
let value = serde_json::to_value(&config).map_err(|e| e.to_string())?;
store.set(CONFIG_STORE_KEY, value);
store.save().map_err(|e| e.to_string())?;
Ok(())
}
+127
View File
@@ -0,0 +1,127 @@
use serde::{Deserialize, Serialize};
#[derive(Debug, Clone, Serialize, Deserialize, Default)]
pub struct ClaudeStartOptions {
#[serde(default)]
pub working_dir: String,
#[serde(default)]
pub model: Option<String>,
#[serde(default)]
pub api_key: Option<String>,
#[serde(default)]
pub custom_instructions: Option<String>,
#[serde(default)]
pub mcp_servers_json: Option<String>,
#[serde(default)]
pub allowed_tools: Vec<String>,
}
#[derive(Debug, Clone, Serialize, Deserialize)]
pub struct HikariConfig {
#[serde(default)]
pub model: Option<String>,
#[serde(default)]
pub api_key: Option<String>,
#[serde(default)]
pub custom_instructions: Option<String>,
#[serde(default)]
pub mcp_servers_json: Option<String>,
#[serde(default)]
pub auto_granted_tools: Vec<String>,
#[serde(default)]
pub theme: Theme,
#[serde(default = "default_greeting_enabled")]
pub greeting_enabled: bool,
#[serde(default)]
pub greeting_custom_prompt: Option<String>,
}
impl Default for HikariConfig {
fn default() -> Self {
Self {
model: None,
api_key: None,
custom_instructions: None,
mcp_servers_json: None,
auto_granted_tools: Vec::new(),
theme: Theme::default(),
greeting_enabled: true,
greeting_custom_prompt: None,
}
}
}
fn default_greeting_enabled() -> bool {
true
}
#[derive(Debug, Clone, Serialize, Deserialize, Default, PartialEq)]
#[serde(rename_all = "lowercase")]
pub enum Theme {
#[default]
Dark,
Light,
}
#[cfg(test)]
mod tests {
use super::*;
#[test]
fn test_default_config() {
let config = HikariConfig::default();
assert!(config.model.is_none());
assert!(config.api_key.is_none());
assert!(config.custom_instructions.is_none());
assert!(config.mcp_servers_json.is_none());
assert!(config.auto_granted_tools.is_empty());
assert_eq!(config.theme, Theme::Dark);
assert!(config.greeting_enabled);
assert!(config.greeting_custom_prompt.is_none());
}
#[test]
fn test_config_serialization() {
let config = HikariConfig {
model: Some("claude-sonnet-4-20250514".to_string()),
api_key: None,
custom_instructions: Some("Be helpful".to_string()),
mcp_servers_json: None,
auto_granted_tools: vec!["Read".to_string(), "Glob".to_string()],
theme: Theme::Light,
greeting_enabled: true,
greeting_custom_prompt: Some("Hello!".to_string()),
};
let json = serde_json::to_string(&config).unwrap();
let deserialized: HikariConfig = serde_json::from_str(&json).unwrap();
assert_eq!(deserialized.model, config.model);
assert_eq!(deserialized.custom_instructions, config.custom_instructions);
assert_eq!(deserialized.auto_granted_tools, config.auto_granted_tools);
assert_eq!(deserialized.theme, Theme::Light);
assert!(deserialized.greeting_enabled);
assert_eq!(deserialized.greeting_custom_prompt, Some("Hello!".to_string()));
}
#[test]
fn test_theme_serialization() {
let dark = Theme::Dark;
let light = Theme::Light;
assert_eq!(serde_json::to_string(&dark).unwrap(), "\"dark\"");
assert_eq!(serde_json::to_string(&light).unwrap(), "\"light\"");
}
}
+4
View File
@@ -1,4 +1,5 @@
mod commands;
mod config;
mod types;
mod wsl_bridge;
@@ -13,6 +14,7 @@ pub fn run() {
.plugin(tauri_plugin_dialog::init())
.plugin(tauri_plugin_opener::init())
.plugin(tauri_plugin_shell::init())
.plugin(tauri_plugin_store::Builder::new().build())
.manage(bridge)
.invoke_handler(tauri::generate_handler![
start_claude,
@@ -21,6 +23,8 @@ pub fn run() {
is_claude_running,
get_working_directory,
select_wsl_directory,
get_config,
save_config,
])
.run(tauri::generate_context!())
.expect("error while running tauri application");
+132 -14
View File
@@ -1,8 +1,9 @@
use serde::{Deserialize, Serialize};
#[derive(Debug, Clone, Serialize, Deserialize, PartialEq)]
#[derive(Debug, Clone, Serialize, Deserialize, PartialEq, Default)]
#[serde(rename_all = "snake_case")]
pub enum CharacterState {
#[default]
Idle,
Thinking,
Typing,
@@ -14,27 +15,17 @@ pub enum CharacterState {
Error,
}
impl Default for CharacterState {
fn default() -> Self {
CharacterState::Idle
}
}
#[derive(Debug, Clone, Serialize, Deserialize)]
#[derive(Debug, Clone, Serialize, Deserialize, Default)]
#[serde(rename_all = "snake_case")]
pub enum ConnectionStatus {
#[default]
Disconnected,
Connecting,
Connected,
Error,
}
impl Default for ConnectionStatus {
fn default() -> Self {
ConnectionStatus::Disconnected
}
}
#[allow(dead_code)]
#[derive(Debug, Clone, Serialize, Deserialize)]
pub struct TerminalLine {
pub id: String,
@@ -46,6 +37,7 @@ pub struct TerminalLine {
pub tool_name: Option<String>,
}
#[allow(dead_code)]
#[derive(Debug, Clone, Serialize, Deserialize)]
pub struct PermissionRequest {
pub id: String,
@@ -186,3 +178,129 @@ pub struct PermissionPromptEvent {
pub tool_input: serde_json::Value,
pub description: String,
}
#[cfg(test)]
mod tests {
use super::*;
#[test]
fn test_character_state_default() {
let state = CharacterState::default();
assert_eq!(state, CharacterState::Idle);
}
#[test]
fn test_connection_status_default() {
let status = ConnectionStatus::default();
matches!(status, ConnectionStatus::Disconnected);
}
#[test]
fn test_character_state_serialization() {
let state = CharacterState::Thinking;
let serialized = serde_json::to_string(&state).unwrap();
assert_eq!(serialized, "\"thinking\"");
let deserialized: CharacterState = serde_json::from_str(&serialized).unwrap();
assert_eq!(deserialized, CharacterState::Thinking);
}
#[test]
fn test_all_character_states_serialize() {
let states = vec![
(CharacterState::Idle, "\"idle\""),
(CharacterState::Thinking, "\"thinking\""),
(CharacterState::Typing, "\"typing\""),
(CharacterState::Searching, "\"searching\""),
(CharacterState::Coding, "\"coding\""),
(CharacterState::Mcp, "\"mcp\""),
(CharacterState::Permission, "\"permission\""),
(CharacterState::Success, "\"success\""),
(CharacterState::Error, "\"error\""),
];
for (state, expected) in states {
let serialized = serde_json::to_string(&state).unwrap();
assert_eq!(serialized, expected, "Failed for state: {:?}", state);
}
}
#[test]
fn test_terminal_line_serialization() {
let line = TerminalLine {
id: "test-123".to_string(),
line_type: "assistant".to_string(),
content: "Hello, world!".to_string(),
timestamp: "2024-01-01T00:00:00Z".to_string(),
tool_name: None,
};
let serialized = serde_json::to_string(&line).unwrap();
assert!(serialized.contains("\"type\":\"assistant\""));
assert!(serialized.contains("\"content\":\"Hello, world!\""));
assert!(!serialized.contains("tool_name"));
}
#[test]
fn test_terminal_line_with_tool_name() {
let line = TerminalLine {
id: "test-456".to_string(),
line_type: "tool".to_string(),
content: "Reading file...".to_string(),
timestamp: "2024-01-01T00:00:00Z".to_string(),
tool_name: Some("Read".to_string()),
};
let serialized = serde_json::to_string(&line).unwrap();
assert!(serialized.contains("\"tool_name\":\"Read\""));
}
#[test]
fn test_content_block_text() {
let block = ContentBlock::Text {
text: "Hello!".to_string(),
};
let serialized = serde_json::to_string(&block).unwrap();
assert!(serialized.contains("\"type\":\"text\""));
assert!(serialized.contains("\"text\":\"Hello!\""));
}
#[test]
fn test_content_block_tool_use() {
let block = ContentBlock::ToolUse {
id: "tool-123".to_string(),
name: "Read".to_string(),
input: serde_json::json!({"file_path": "/test.txt"}),
};
let serialized = serde_json::to_string(&block).unwrap();
assert!(serialized.contains("\"type\":\"tool_use\""));
assert!(serialized.contains("\"name\":\"Read\""));
}
#[test]
fn test_state_change_event() {
let event = StateChangeEvent {
state: CharacterState::Coding,
tool_name: Some("Edit".to_string()),
};
let serialized = serde_json::to_string(&event).unwrap();
assert!(serialized.contains("\"state\":\"coding\""));
assert!(serialized.contains("\"tool_name\":\"Edit\""));
}
#[test]
fn test_output_event() {
let event = OutputEvent {
line_type: "assistant".to_string(),
content: "Test output".to_string(),
tool_name: None,
};
let serialized = serde_json::to_string(&event).unwrap();
assert!(serialized.contains("\"line_type\":\"assistant\""));
assert!(serialized.contains("\"content\":\"Test output\""));
}
}
+243 -23
View File
@@ -4,7 +4,12 @@ use std::process::{Child, ChildStdin, Command, Stdio};
use std::sync::Arc;
use std::thread;
use tauri::{AppHandle, Emitter};
use tempfile::NamedTempFile;
#[cfg(target_os = "windows")]
use std::os::windows::process::CommandExt;
use crate::config::ClaudeStartOptions;
use crate::types::{CharacterState, ClaudeMessage, ConnectionStatus, ContentBlock, StateChangeEvent, OutputEvent, PermissionPromptEvent};
const SEARCH_TOOLS: [&str; 5] = ["Read", "Glob", "Grep", "WebSearch", "WebFetch"];
@@ -66,6 +71,7 @@ pub struct WslBridge {
stdin: Option<ChildStdin>,
working_directory: String,
session_id: Option<String>,
mcp_config_file: Option<NamedTempFile>,
}
impl WslBridge {
@@ -75,22 +81,50 @@ impl WslBridge {
stdin: None,
working_directory: String::new(),
session_id: None,
mcp_config_file: None,
}
}
pub fn start(&mut self, app: AppHandle, working_dir: &str, allowed_tools: Vec<String>) -> Result<(), String> {
pub fn start(&mut self, app: AppHandle, options: ClaudeStartOptions) -> Result<(), String> {
if self.process.is_some() {
return Err("Process already running".to_string());
}
self.working_directory = working_dir.to_string();
let working_dir = &options.working_dir;
self.working_directory = working_dir.clone();
emit_connection_status(&app, ConnectionStatus::Connecting);
// Create temp file for MCP config if provided
let mcp_config_path = if let Some(ref mcp_json) = options.mcp_servers_json {
if !mcp_json.trim().is_empty() {
// Validate JSON before writing
serde_json::from_str::<serde_json::Value>(mcp_json)
.map_err(|e| format!("Invalid MCP servers JSON: {}", e))?;
let mut temp_file = NamedTempFile::new()
.map_err(|e| format!("Failed to create temp file for MCP config: {}", e))?;
temp_file
.write_all(mcp_json.as_bytes())
.map_err(|e| format!("Failed to write MCP config: {}", e))?;
temp_file
.flush()
.map_err(|e| format!("Failed to flush MCP config: {}", e))?;
let path = temp_file.path().to_string_lossy().to_string();
self.mcp_config_file = Some(temp_file);
Some(path)
} else {
None
}
} else {
None
};
// Detect if we're running inside WSL or on Windows
let is_wsl = detect_wsl();
eprintln!("[DEBUG] is_wsl: {}", is_wsl);
eprintln!("[DEBUG] allowed_tools: {:?}", allowed_tools);
eprintln!("[DEBUG] options: {:?}", options);
let mut command = if is_wsl {
// Running inside WSL - call claude directly
@@ -108,32 +142,93 @@ impl WslBridge {
"--verbose",
]);
// Add model if specified
if let Some(ref model) = options.model {
if !model.is_empty() {
cmd.args(["--model", model]);
}
}
// Add allowed tools if any
for tool in &allowed_tools {
for tool in &options.allowed_tools {
cmd.args(["--allowedTools", tool]);
}
cmd.current_dir(working_dir);
cmd
} else {
// Running on Windows - use wsl to call claude
eprintln!("[DEBUG] Windows path - using wsl");
let mut cmd = Command::new("wsl");
let mut args = vec![
"--cd".to_string(), working_dir.to_string(),
"--".to_string(), "claude".to_string(),
"--output-format".to_string(), "stream-json".to_string(),
"--input-format".to_string(), "stream-json".to_string(),
"--verbose".to_string(),
];
// Add allowed tools if any
for tool in &allowed_tools {
args.push("--allowedTools".to_string());
args.push(tool.clone());
// Add custom instructions as system prompt if specified
if let Some(ref instructions) = options.custom_instructions {
if !instructions.is_empty() {
cmd.args(["--system-prompt", instructions]);
}
}
cmd.args(&args);
// Add MCP config if provided
if let Some(ref mcp_path) = mcp_config_path {
cmd.args(["--mcp-config", mcp_path]);
}
cmd.current_dir(working_dir);
// Set API key as environment variable if specified
if let Some(ref api_key) = options.api_key {
if !api_key.is_empty() {
cmd.env("ANTHROPIC_API_KEY", api_key);
}
}
cmd
} else {
// Running on Windows - use wsl with bash login shell to ensure PATH is loaded
eprintln!("[DEBUG] Windows path - using wsl");
let mut cmd = Command::new("wsl");
// Build the claude command with all arguments
let mut claude_cmd = format!(
"cd '{}' && ",
working_dir
);
// Set API key as environment variable if specified
if let Some(ref api_key) = options.api_key {
if !api_key.is_empty() {
claude_cmd.push_str(&format!("ANTHROPIC_API_KEY='{}' ", api_key));
}
}
claude_cmd.push_str("claude --output-format stream-json --input-format stream-json --verbose");
// Add model if specified
if let Some(ref model) = options.model {
if !model.is_empty() {
claude_cmd.push_str(&format!(" --model '{}'", model));
}
}
// Add allowed tools if any
for tool in &options.allowed_tools {
claude_cmd.push_str(&format!(" --allowedTools '{}'", tool));
}
// Add custom instructions as system prompt if specified
if let Some(ref instructions) = options.custom_instructions {
if !instructions.is_empty() {
// Escape single quotes in instructions
let escaped = instructions.replace('\'', "'\\''");
claude_cmd.push_str(&format!(" --system-prompt '{}'", escaped));
}
}
// Add MCP config if provided
if let Some(ref mcp_path) = mcp_config_path {
claude_cmd.push_str(&format!(" --mcp-config '{}'", mcp_path));
}
// Use bash -lc to load login profile (ensures PATH includes claude)
cmd.args(["-e", "bash", "-lc", &claude_cmd]);
// Hide the console window on Windows
#[cfg(target_os = "windows")]
cmd.creation_flags(0x08000000); // CREATE_NO_WINDOW
cmd
};
@@ -205,6 +300,7 @@ impl WslBridge {
}
self.stdin = None;
self.session_id = None;
self.mcp_config_file = None; // Temp file is automatically deleted when dropped
emit_connection_status(app, ConnectionStatus::Disconnected);
}
@@ -465,3 +561,127 @@ pub type SharedBridge = Arc<Mutex<WslBridge>>;
pub fn create_shared_bridge() -> SharedBridge {
Arc::new(Mutex::new(WslBridge::new()))
}
#[cfg(test)]
mod tests {
use super::*;
#[test]
fn test_get_tool_state_search_tools() {
assert!(matches!(get_tool_state("Read"), CharacterState::Searching));
assert!(matches!(get_tool_state("Glob"), CharacterState::Searching));
assert!(matches!(get_tool_state("Grep"), CharacterState::Searching));
assert!(matches!(get_tool_state("WebSearch"), CharacterState::Searching));
assert!(matches!(get_tool_state("WebFetch"), CharacterState::Searching));
}
#[test]
fn test_get_tool_state_coding_tools() {
assert!(matches!(get_tool_state("Edit"), CharacterState::Coding));
assert!(matches!(get_tool_state("Write"), CharacterState::Coding));
assert!(matches!(get_tool_state("NotebookEdit"), CharacterState::Coding));
}
#[test]
fn test_get_tool_state_mcp_tools() {
assert!(matches!(get_tool_state("mcp__github__create_issue"), CharacterState::Mcp));
assert!(matches!(get_tool_state("mcp__notion__search"), CharacterState::Mcp));
}
#[test]
fn test_get_tool_state_task() {
assert!(matches!(get_tool_state("Task"), CharacterState::Thinking));
}
#[test]
fn test_get_tool_state_unknown() {
assert!(matches!(get_tool_state("SomeUnknownTool"), CharacterState::Typing));
assert!(matches!(get_tool_state("Bash"), CharacterState::Typing));
}
#[test]
fn test_format_tool_description_read() {
let input = serde_json::json!({"file_path": "/home/test/file.txt"});
let desc = format_tool_description("Read", &input);
assert_eq!(desc, "Reading file: /home/test/file.txt");
}
#[test]
fn test_format_tool_description_read_no_path() {
let input = serde_json::json!({});
let desc = format_tool_description("Read", &input);
assert_eq!(desc, "Reading file...");
}
#[test]
fn test_format_tool_description_glob() {
let input = serde_json::json!({"pattern": "**/*.rs"});
let desc = format_tool_description("Glob", &input);
assert_eq!(desc, "Searching for files: **/*.rs");
}
#[test]
fn test_format_tool_description_grep() {
let input = serde_json::json!({"pattern": "TODO"});
let desc = format_tool_description("Grep", &input);
assert_eq!(desc, "Searching for: TODO");
}
#[test]
fn test_format_tool_description_edit() {
let input = serde_json::json!({"file_path": "/home/test/main.rs"});
let desc = format_tool_description("Edit", &input);
assert_eq!(desc, "Editing: /home/test/main.rs");
}
#[test]
fn test_format_tool_description_write() {
let input = serde_json::json!({"file_path": "/home/test/new.txt"});
let desc = format_tool_description("Write", &input);
assert_eq!(desc, "Editing: /home/test/new.txt");
}
#[test]
fn test_format_tool_description_bash_short() {
let input = serde_json::json!({"command": "ls -la"});
let desc = format_tool_description("Bash", &input);
assert_eq!(desc, "Running: ls -la");
}
#[test]
fn test_format_tool_description_bash_long() {
let long_cmd = "a".repeat(100);
let input = serde_json::json!({"command": long_cmd});
let desc = format_tool_description("Bash", &input);
assert!(desc.starts_with("Running: "));
assert!(desc.ends_with("..."));
assert!(desc.len() < 70);
}
#[test]
fn test_format_tool_description_unknown() {
let input = serde_json::json!({"some": "data"});
let desc = format_tool_description("CustomTool", &input);
assert_eq!(desc, "Using tool: CustomTool");
}
#[test]
fn test_wsl_bridge_new() {
let bridge = WslBridge::new();
assert!(!bridge.is_running());
assert_eq!(bridge.get_working_directory(), "");
}
#[test]
fn test_wsl_bridge_default() {
let bridge = WslBridge::default();
assert!(!bridge.is_running());
}
#[test]
fn test_create_shared_bridge() {
let shared = create_shared_bridge();
let bridge = shared.lock();
assert!(!bridge.is_running());
}
}
+15 -1
View File
@@ -1,9 +1,11 @@
@import "tailwindcss";
:root {
:root,
[data-theme="dark"] {
--bg-primary: #1a1a2e;
--bg-secondary: #16213e;
--bg-terminal: #0f0f1a;
--bg-hover: #2a2a4a;
--accent-primary: #e94560;
--accent-secondary: #ff6b9d;
--text-primary: #ffffff;
@@ -11,6 +13,18 @@
--border-color: #2a2a4a;
}
[data-theme="light"] {
--bg-primary: #f8f9fa;
--bg-secondary: #ffffff;
--bg-terminal: #f1f3f4;
--bg-hover: #e8e8e8;
--accent-primary: #e94560;
--accent-secondary: #ff6b9d;
--text-primary: #1a1a2e;
--text-secondary: #5a5a7a;
--border-color: #d0d0e0;
}
html,
body {
margin: 0;
+27 -10
View File
@@ -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);
}
}
+408
View File
@@ -0,0 +1,408 @@
<script lang="ts">
import { configStore, type HikariConfig, type Theme } from "$lib/stores/config";
import { claudeStore } from "$lib/stores/claude";
let config: HikariConfig = $state({
model: null,
api_key: null,
custom_instructions: null,
mcp_servers_json: null,
auto_granted_tools: [],
theme: "dark",
greeting_enabled: true,
greeting_custom_prompt: null,
});
let isOpen = $state(false);
let isSaving = $state(false);
let saveError: string | null = $state(null);
let newToolName = $state("");
let showApiKey = $state(false);
let grantedTools: string[] = $state([]);
configStore.config.subscribe((c) => {
config = { ...c };
});
configStore.isSidebarOpen.subscribe((open) => {
isOpen = open;
});
configStore.saveError.subscribe((error) => {
saveError = error;
});
claudeStore.grantedTools.subscribe((tools) => {
grantedTools = Array.from(tools);
});
const availableModels = [
{ value: "", label: "Default (from ~/.claude)" },
{ value: "claude-sonnet-4-20250514", label: "Claude Sonnet 4" },
{ value: "claude-opus-4-20250514", label: "Claude Opus 4" },
];
const commonTools = [
"Read",
"Write",
"Edit",
"Bash",
"Glob",
"Grep",
"WebFetch",
"WebSearch",
"Task",
];
async function handleSave() {
isSaving = true;
saveError = null;
try {
await configStore.saveConfig(config);
} catch {
// Error is handled by the store
} finally {
isSaving = false;
}
}
async function handleThemeChange(theme: Theme) {
config.theme = theme;
await configStore.setTheme(theme);
}
function toggleTool(tool: string) {
if (config.auto_granted_tools.includes(tool)) {
config.auto_granted_tools = config.auto_granted_tools.filter((t) => t !== tool);
} else {
config.auto_granted_tools = [...config.auto_granted_tools, tool];
}
}
function addCustomTool() {
if (newToolName.trim() && !config.auto_granted_tools.includes(newToolName.trim())) {
config.auto_granted_tools = [...config.auto_granted_tools, newToolName.trim()];
newToolName = "";
}
}
function removeTool(tool: string) {
config.auto_granted_tools = config.auto_granted_tools.filter((t) => t !== tool);
}
function importFromSession() {
config.auto_granted_tools = [...new Set([...config.auto_granted_tools, ...grantedTools])];
}
</script>
<!-- Backdrop -->
{#if isOpen}
<div
class="fixed inset-0 bg-black/50 z-40 transition-opacity"
onclick={configStore.closeSidebar}
onkeydown={(e) => e.key === "Escape" && configStore.closeSidebar()}
role="button"
tabindex="-1"
aria-label="Close sidebar"
></div>
{/if}
<!-- Sidebar -->
<aside
class="fixed right-0 top-0 h-full w-96 bg-[var(--bg-secondary)] border-l border-[var(--border-color)] z-50 transform transition-transform duration-300 ease-in-out overflow-y-auto {isOpen
? 'translate-x-0'
: 'translate-x-full'}"
>
<div class="p-4">
<!-- Header -->
<div class="flex items-center justify-between mb-6">
<h2 class="text-lg font-semibold text-[var(--text-primary)]">Settings</h2>
<button
onclick={configStore.closeSidebar}
class="p-1 text-gray-400 hover:text-white transition-colors"
aria-label="Close settings"
>
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
</button>
</div>
{#if saveError}
<div class="mb-4 p-3 bg-red-500/20 border border-red-500/50 rounded-lg text-red-400 text-sm">
{saveError}
</div>
{/if}
<!-- Agent Settings Section -->
<section class="mb-6">
<h3 class="text-sm font-medium text-[var(--accent-primary)] uppercase tracking-wider mb-3">
Agent Settings
</h3>
<!-- Model Selection -->
<div class="mb-4">
<label for="model" class="block text-sm text-gray-400 mb-1">Model</label>
<select
id="model"
bind:value={config.model}
class="w-full px-3 py-2 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent-primary)]"
>
{#each availableModels as model (model.value)}
<option value={model.value}>{model.label}</option>
{/each}
</select>
</div>
<!-- API Key -->
<div class="mb-4">
<label for="api-key" class="block text-sm text-gray-400 mb-1">
API Key <span class="text-gray-600">(optional override)</span>
</label>
<div class="relative">
<input
id="api-key"
type={showApiKey ? "text" : "password"}
bind:value={config.api_key}
placeholder="Falls back to ~/.claude settings"
class="w-full px-3 py-2 pr-10 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent-primary)]"
/>
<button
type="button"
onclick={() => (showApiKey = !showApiKey)}
class="absolute right-2 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-300"
aria-label={showApiKey ? "Hide API key" : "Show API key"}
>
{#if showApiKey}
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21"
/>
</svg>
{:else}
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"
/>
</svg>
{/if}
</button>
</div>
</div>
<!-- Custom Instructions -->
<div class="mb-4">
<label for="instructions" class="block text-sm text-gray-400 mb-1"
>Custom Instructions</label
>
<textarea
id="instructions"
bind:value={config.custom_instructions}
rows="4"
placeholder="Additional instructions for the agent..."
class="w-full px-3 py-2 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent-primary)] resize-none"
></textarea>
</div>
</section>
<!-- Greeting Section -->
<section class="mb-6">
<h3 class="text-sm font-medium text-[var(--accent-primary)] uppercase tracking-wider mb-3">
Greeting
</h3>
<!-- Enable/Disable Toggle -->
<div class="mb-4">
<label class="flex items-center gap-3 cursor-pointer">
<input
type="checkbox"
bind:checked={config.greeting_enabled}
class="w-4 h-4 rounded border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--accent-primary)] focus:ring-[var(--accent-primary)]"
/>
<span class="text-sm text-gray-300">Send greeting on connect</span>
</label>
<p class="text-xs text-gray-500 mt-1 ml-7">
Automatically greet you when a session starts with time-based messages
</p>
</div>
<!-- Custom Greeting Prompt -->
{#if config.greeting_enabled}
<div class="mb-4">
<label for="greeting-prompt" class="block text-sm text-gray-400 mb-1">
Custom Greeting Prompt <span class="text-gray-600">(optional)</span>
</label>
<textarea
id="greeting-prompt"
bind:value={config.greeting_custom_prompt}
rows="3"
placeholder="Leave empty for time-based greetings, or customize how you'd like to be greeted..."
class="w-full px-3 py-2 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent-primary)] resize-none"
></textarea>
</div>
{/if}
</section>
<!-- MCP Servers Section -->
<section class="mb-6">
<h3 class="text-sm font-medium text-[var(--accent-primary)] uppercase tracking-wider mb-3">
MCP Servers
</h3>
<div class="mb-2">
<label for="mcp-config" class="block text-sm text-gray-400 mb-1">
Server Configuration <span class="text-gray-600">(JSON)</span>
</label>
<textarea
id="mcp-config"
bind:value={config.mcp_servers_json}
rows="6"
placeholder={`{\n "servers": {\n "example": {\n "command": "npx",\n "args": ["-y", "@example/mcp-server"]\n }\n }\n}`}
class="w-full px-3 py-2 bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] font-mono text-sm focus:outline-none focus:border-[var(--accent-primary)] resize-none"
></textarea>
</div>
</section>
<!-- Auto-Granted Tools Section -->
<section class="mb-6">
<h3 class="text-sm font-medium text-[var(--accent-primary)] uppercase tracking-wider mb-3">
Auto-Granted Tools
</h3>
<p class="text-xs text-gray-500 mb-3">
These tools will be pre-approved for every session (no permission prompts).
</p>
<!-- Common tools checkboxes -->
<div class="grid grid-cols-2 gap-2 mb-3">
{#each commonTools as tool (tool)}
<label class="flex items-center gap-2 text-sm text-gray-300 cursor-pointer">
<input
type="checkbox"
checked={config.auto_granted_tools.includes(tool)}
onchange={() => toggleTool(tool)}
class="w-4 h-4 rounded border-[var(--border-color)] bg-[var(--bg-primary)] text-[var(--accent-primary)] focus:ring-[var(--accent-primary)]"
/>
{tool}
</label>
{/each}
</div>
<!-- Currently granted tools (with import) -->
{#if grantedTools.length > 0}
<div class="mb-3">
<div class="flex items-center justify-between mb-2">
<span class="text-xs text-gray-500">Session-granted tools:</span>
<button
onclick={importFromSession}
class="text-xs text-[var(--accent-primary)] hover:text-[var(--accent-secondary)] transition-colors"
>
Import all
</button>
</div>
<div class="flex flex-wrap gap-1">
{#each grantedTools as tool (tool)}
<span
class="px-2 py-0.5 text-xs bg-[var(--accent-primary)]/20 text-[var(--accent-primary)] rounded"
>
{tool}
</span>
{/each}
</div>
</div>
{/if}
<!-- Custom tools list -->
{#if config.auto_granted_tools.filter((t) => !commonTools.includes(t)).length > 0}
<div class="mb-3">
<span class="text-xs text-gray-500 block mb-2">Custom tools:</span>
<div class="flex flex-wrap gap-1">
{#each config.auto_granted_tools.filter((t) => !commonTools.includes(t)) as tool (tool)}
<span
class="px-2 py-0.5 text-xs bg-[var(--bg-primary)] border border-[var(--border-color)] rounded flex items-center gap-1"
>
{tool}
<button
onclick={() => removeTool(tool)}
class="text-gray-500 hover:text-red-400"
aria-label="Remove {tool}"
>
×
</button>
</span>
{/each}
</div>
</div>
{/if}
<!-- Add custom tool -->
<div class="flex gap-2">
<input
type="text"
bind:value={newToolName}
placeholder="Add custom tool..."
onkeydown={(e) => e.key === "Enter" && addCustomTool()}
class="flex-1 px-3 py-1.5 text-sm bg-[var(--bg-primary)] border border-[var(--border-color)] rounded-lg text-[var(--text-primary)] focus:outline-none focus:border-[var(--accent-primary)]"
/>
<button
onclick={addCustomTool}
disabled={!newToolName.trim()}
class="px-3 py-1.5 text-sm bg-[var(--accent-primary)] hover:bg-[var(--accent-secondary)] text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
Add
</button>
</div>
</section>
<!-- Appearance Section -->
<section class="mb-6">
<h3 class="text-sm font-medium text-[var(--accent-primary)] uppercase tracking-wider mb-3">
Appearance
</h3>
<div class="flex gap-2">
<button
onclick={() => handleThemeChange("dark")}
class="flex-1 px-4 py-2 rounded-lg border transition-colors {config.theme === 'dark'
? 'bg-[var(--accent-primary)] border-[var(--accent-primary)] text-white'
: 'bg-[var(--bg-primary)] border-[var(--border-color)] text-gray-400 hover:border-[var(--accent-primary)]'}"
>
Dark
</button>
<button
onclick={() => handleThemeChange("light")}
class="flex-1 px-4 py-2 rounded-lg border transition-colors {config.theme === 'light'
? 'bg-[var(--accent-primary)] border-[var(--accent-primary)] text-white'
: 'bg-[var(--bg-primary)] border-[var(--border-color)] text-gray-400 hover:border-[var(--accent-primary)]'}"
>
Light
</button>
</div>
</section>
<!-- Save Button -->
<div class="sticky bottom-0 pt-4 pb-2 bg-[var(--bg-secondary)]">
<button
onclick={handleSave}
disabled={isSaving}
class="w-full py-3 bg-[var(--accent-primary)] hover:bg-[var(--accent-secondary)] text-white font-medium rounded-lg transition-colors disabled:opacity-50"
>
{isSaving ? "Saving..." : "Save Settings"}
</button>
</div>
</div>
</aside>
+20 -6
View File
@@ -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}
+56 -6
View File
@@ -4,6 +4,7 @@
import { open } from "@tauri-apps/plugin-dialog";
import { openUrl } from "@tauri-apps/plugin-opener";
import { claudeStore } from "$lib/stores/claude";
import { configStore, type HikariConfig } from "$lib/stores/config";
import type { ConnectionStatus } from "$lib/types/messages";
import { onMount } from "svelte";
@@ -15,6 +16,16 @@
let isConnecting = $state(false);
let grantedToolsList: string[] = $state([]);
let appVersion = $state("");
let currentConfig: HikariConfig = $state({
model: null,
api_key: null,
custom_instructions: null,
mcp_servers_json: null,
auto_granted_tools: [],
theme: "dark",
greeting_enabled: true,
greeting_custom_prompt: null,
});
onMount(async () => {
appVersion = await getVersion();
@@ -33,6 +44,10 @@
grantedToolsList = Array.from(tools);
});
configStore.config.subscribe((config) => {
currentConfig = config;
});
async function handleBrowse() {
try {
const selected = await open({
@@ -54,11 +69,21 @@
const targetDir = selectedDirectory || "/home/naomi";
// Combine session-granted tools with config auto-granted tools
const allAllowedTools = [
...new Set([...grantedToolsList, ...currentConfig.auto_granted_tools]),
];
try {
// Pass granted tools to Claude so they're pre-approved
await invoke("start_claude", {
workingDir: targetDir,
allowedTools: grantedToolsList.length > 0 ? grantedToolsList : null,
options: {
working_dir: targetDir,
model: currentConfig.model || null,
api_key: currentConfig.api_key || null,
custom_instructions: currentConfig.custom_instructions || null,
mcp_servers_json: currentConfig.mcp_servers_json || null,
allowed_tools: allAllowedTools,
},
});
} catch (error) {
console.error("Failed to start Claude:", error);
@@ -101,7 +126,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 +138,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}
@@ -137,13 +165,35 @@
</div>
<div class="flex items-center gap-3">
<button
onclick={configStore.openSidebar}
class="p-1 text-gray-500 hover:text-[var(--accent-primary)] transition-colors"
title="Settings"
>
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
/>
</svg>
</button>
<button
onclick={() => openUrl(DISCORD_URL)}
class="p-1 text-gray-500 hover:text-[var(--accent-primary)] transition-colors"
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}
+5 -5
View File
@@ -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)}">
+1 -1
View File
@@ -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 -5
View File
@@ -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;
+118
View File
@@ -0,0 +1,118 @@
import { writable, derived } from "svelte/store";
import { invoke } from "@tauri-apps/api/core";
export type Theme = "dark" | "light";
export interface HikariConfig {
model: string | null;
api_key: string | null;
custom_instructions: string | null;
mcp_servers_json: string | null;
auto_granted_tools: string[];
theme: Theme;
greeting_enabled: boolean;
greeting_custom_prompt: string | null;
}
const defaultConfig: HikariConfig = {
model: null,
api_key: null,
custom_instructions: null,
mcp_servers_json: null,
auto_granted_tools: [],
theme: "dark",
greeting_enabled: true,
greeting_custom_prompt: null,
};
function createConfigStore() {
const config = writable<HikariConfig>(defaultConfig);
const isLoading = writable<boolean>(true);
const isSidebarOpen = writable<boolean>(false);
const saveError = writable<string | null>(null);
async function loadConfig() {
isLoading.set(true);
try {
const savedConfig = await invoke<HikariConfig>("get_config");
config.set(savedConfig);
} catch (error) {
console.error("Failed to load config:", error);
config.set(defaultConfig);
} finally {
isLoading.set(false);
}
}
async function saveConfig(newConfig: HikariConfig) {
saveError.set(null);
try {
await invoke("save_config", { config: newConfig });
config.set(newConfig);
} catch (error) {
const errorMessage = error instanceof Error ? error.message : String(error);
saveError.set(errorMessage);
console.error("Failed to save config:", error);
throw error;
}
}
async function updateConfig(updates: Partial<HikariConfig>) {
let currentConfig: HikariConfig = defaultConfig;
config.subscribe((c) => (currentConfig = c))();
const newConfig = { ...currentConfig, ...updates };
await saveConfig(newConfig);
}
return {
config: { subscribe: config.subscribe },
isLoading: { subscribe: isLoading.subscribe },
isSidebarOpen: { subscribe: isSidebarOpen.subscribe },
saveError: { subscribe: saveError.subscribe },
loadConfig,
saveConfig,
updateConfig,
openSidebar: () => isSidebarOpen.set(true),
closeSidebar: () => isSidebarOpen.set(false),
toggleSidebar: () => isSidebarOpen.update((open) => !open),
setTheme: async (theme: Theme) => {
await updateConfig({ theme });
applyTheme(theme);
},
addAutoGrantedTool: async (tool: string) => {
let currentConfig: HikariConfig = defaultConfig;
config.subscribe((c) => (currentConfig = c))();
if (!currentConfig.auto_granted_tools.includes(tool)) {
const newTools = [...currentConfig.auto_granted_tools, tool];
await updateConfig({ auto_granted_tools: newTools });
}
},
removeAutoGrantedTool: async (tool: string) => {
let currentConfig: HikariConfig = defaultConfig;
config.subscribe((c) => (currentConfig = c))();
const newTools = currentConfig.auto_granted_tools.filter((t) => t !== tool);
await updateConfig({ auto_granted_tools: newTools });
},
getConfig: (): HikariConfig => {
let currentConfig: HikariConfig = defaultConfig;
config.subscribe((c) => (currentConfig = c))();
return currentConfig;
},
};
}
export function applyTheme(theme: Theme) {
if (typeof document !== "undefined") {
document.documentElement.setAttribute("data-theme", theme);
}
}
export const configStore = createConfigStore();
export const isDarkTheme = derived(configStore.config, ($config) => $config.theme === "dark");
+46 -2
View File
@@ -1,6 +1,8 @@
import { listen } from "@tauri-apps/api/event";
import { invoke } from "@tauri-apps/api/core";
import { claudeStore } from "$lib/stores/claude";
import { characterState } from "$lib/stores/character";
import { configStore } from "$lib/stores/config";
import type { ConnectionStatus, PermissionPromptEvent } from "$lib/types/messages";
import type { CharacterState } from "$lib/types/states";
@@ -9,6 +11,46 @@ interface StateChangePayload {
tool_name: string | null;
}
function getTimeOfDay(): string {
const hour = new Date().getHours();
if (hour >= 5 && hour < 12) {
return "morning";
} else if (hour >= 12 && hour < 17) {
return "afternoon";
} else if (hour >= 17 && hour < 21) {
return "evening";
} else {
return "late night";
}
}
function generateGreetingPrompt(): string {
const timeOfDay = getTimeOfDay();
return `[System: A new session has started. It's currently ${timeOfDay}. Please greet the user warmly and briefly. Keep it short - just 1-2 sentences.]`;
}
async function sendGreeting() {
const config = configStore.getConfig();
if (!config.greeting_enabled) {
return;
}
const greetingPrompt = config.greeting_custom_prompt?.trim() || generateGreetingPrompt();
// Don't show the system prompt in the UI - just trigger Claude to respond
characterState.setState("thinking");
try {
await invoke("send_prompt", { message: greetingPrompt });
} catch (error) {
console.error("Failed to send greeting:", error);
claudeStore.addLine("error", `Failed to send greeting: ${error}`);
characterState.setTemporaryState("error", 3000);
}
}
interface OutputPayload {
line_type: string;
content: string;
@@ -16,13 +58,15 @@ interface OutputPayload {
}
export async function initializeTauriListeners() {
await listen<string>("claude:connection", (event) => {
await listen<string>("claude:connection", async (event) => {
const status = event.payload as ConnectionStatus;
claudeStore.setConnectionStatus(status);
if (status === "connected") {
claudeStore.addLine("system", "Connected to Claude Code");
characterState.setState("idle");
// Send greeting when connection is established
await sendGreeting();
} else if (status === "disconnected") {
claudeStore.addLine("system", "Disconnected from Claude Code");
characterState.setState("idle");
@@ -65,7 +109,7 @@ export async function initializeTauriListeners() {
);
});
await listen<string>("claude:stream", (event) => {
await listen<string>("claude:stream", () => {
// no-op
});
+240
View File
@@ -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([]);
});
});
});
+19 -7
View File
@@ -1,14 +1,21 @@
<script lang="ts">
import { onMount } from "svelte";
import { initializeTauriListeners } from "$lib/tauri";
import { configStore, applyTheme } from "$lib/stores/config";
import Terminal from "$lib/components/Terminal.svelte";
import InputBar from "$lib/components/InputBar.svelte";
import StatusBar from "$lib/components/StatusBar.svelte";
import AnimeGirl from "$lib/components/AnimeGirl.svelte";
import PermissionModal from "$lib/components/PermissionModal.svelte";
import ConfigSidebar from "$lib/components/ConfigSidebar.svelte";
onMount(async () => {
await initializeTauriListeners();
await configStore.loadConfig();
// Apply saved theme on startup
const config = configStore.getConfig();
applyTheme(config.theme);
});
</script>
@@ -17,7 +24,9 @@
<main class="flex-1 flex overflow-hidden">
<!-- Left panel: Character display -->
<div class="character-panel w-1/3 flex flex-col items-center justify-center border-r border-[var(--border-color)] bg-[var(--bg-secondary)]/50">
<div
class="character-panel w-1/3 flex flex-col items-center justify-center border-r border-[var(--border-color)] bg-[var(--bg-secondary)]/50"
>
<AnimeGirl />
</div>
@@ -29,19 +38,22 @@
</main>
<PermissionModal />
<ConfigSidebar />
</div>
<style>
.app-container {
font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-family:
"Inter",
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Roboto,
sans-serif;
}
.character-panel {
min-width: 320px;
background: linear-gradient(
180deg,
var(--bg-secondary) 0%,
var(--bg-primary) 100%
);
background: linear-gradient(180deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);
}
</style>
+2 -1
View File
@@ -5,7 +5,7 @@ Place your anime girl sprites here! Each state needs a PNG image.
## Required Files
| Filename | State | Description |
|----------|-------|-------------|
| ---------------- | ---------- | --------------------------------------- |
| `idle.png` | Idle | Relaxed, waiting pose |
| `thinking.png` | Thinking | Hand on chin, contemplative |
| `typing.png` | Typing | Hands on keyboard, focused |
@@ -26,6 +26,7 @@ Place your anime girl sprites here! Each state needs a PNG image.
## Bonus: Animation Frames
For animated states, you can add numbered frames:
- `typing_1.png`, `typing_2.png`, `typing_3.png`
- `thinking_1.png`, `thinking_2.png`
- etc.
+12
View File
@@ -0,0 +1,12 @@
import { defineConfig } from "vitest/config";
import { sveltekit } from "@sveltejs/kit/vite";
export default defineConfig({
plugins: [sveltekit()],
test: {
include: ["src/**/*.{test,spec}.{js,ts}"],
environment: "jsdom",
setupFiles: ["./vitest.setup.ts"],
globals: true,
},
});
+1
View File
@@ -0,0 +1 @@
import "@testing-library/jest-dom/vitest";