diff --git a/Cargo.toml b/Cargo.toml index 0947876..c60dcd8 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -13,7 +13,7 @@ members = [ [workspace.package] edition = "2024" version = "0.1.0" -license = "MIT" +license = "Apache-2.0" publish = false [profile.release] diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..d645695 --- /dev/null +++ b/LICENSE @@ -0,0 +1,202 @@ + + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + + 1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + + 2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + + 3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + + 4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + + 5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + + 6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + + 7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + + 8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + + 9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + + Copyright [yyyy] [name of copyright owner] + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. diff --git a/README.md b/README.md index 1251e88..a66b0e7 100644 --- a/README.md +++ b/README.md @@ -1,334 +1,135 @@
+LazyBoy + +**English** · [繁體中文](./README.zh-TW.md) + # LazyBoy -### 給 Agent 一台真的電腦 +**Give AI a computer so it can do the work.** -在瀏覽器裡指派工作，讓 AI Agent 在隔離的 Linux 桌面中開網頁、操作應用程式、整理檔案，並在你需要時把控制權交回來。 +A self-hosted AI agent workspace. Assign tasks in text or voice, watch the desktop live, and take over whenever you need to. -[![Self-hosted](https://img.shields.io/badge/deployment-self--hosted-3ec5a8?style=flat-square)](#快速開始) -[![Rust 2024](https://img.shields.io/badge/Rust-2024-000000?style=flat-square&logo=rust)](./Cargo.toml) -[![React 19](https://img.shields.io/badge/React-19-20232a?style=flat-square&logo=react)](./apps/web/package.json) -[![Docker Compose](https://img.shields.io/badge/Docker-Compose-2496ed?style=flat-square&logo=docker&logoColor=white)](./docker-compose.yml) - -[快速開始](#快速開始) · [功能](#核心能力) · [運作流程](#一個任務如何完成) · [系統架構](#系統架構) · [二次開發](#二次開發) · [安全](#安全模型) +[Quick start](#quick-start) · [Features](#features) · [Architecture](./docs/architecture.md) · [Operations](./docs/operations.md) · [Development](./docs/development.md)
-![LazyBoy 三欄工作空間：Agent、對話與即時電腦畫面](./docs/readme-hero.png) +![LazyBoy workspace: agent list, chat, and live desktop](./docs/readme-hero.png) -LazyBoy 是一套本機優先（local-first）的多 Agent 工作空間。每個 Agent 都能使用瀏覽器、終端、檔案系統與桌面應用程式；執行畫面可即時觀看、可以人工接管，也能把示範整理成技能，之後透過排程重複執行。 +LazyBoy gives each agent its own Linux desktop in Docker — browser, terminal, and files. You can run several agents, put them in a group, turn a demonstration into a skill, and schedule it to run again. -> [!IMPORTANT] -> LazyBoy 會把對話、記憶、憑證與瀏覽器設定檔持久化在自己的主機，但使用外部模型時，完成任務所需的提示詞、工具結果或畫面仍可能傳送給你設定的模型供應商。請依資料敏感度選擇供應商與部署方式。 +This is an early `0.1.0` release with desktop and phone browser UIs. You bring your own model API key. -## 為什麼是 LazyBoy？ +## Features -| 一般聊天機器人 | LazyBoy | -| --- | --- | -| 告訴你怎麼做 | 在隔離桌面中實際操作 | -| 看不到執行過程 | 即時 noVNC 畫面與步驟狀態 | -| 人與 Agent 搶控制權 | 接管／釋放租約，安全交接 | -| 每次重新說明流程 | 示範一次，儲存為可攜技能 | -| 一次性對話 | Session、長期記憶、排程與群組 | -| 固定模型與工具 | xAI、OpenCode Go、OpenAI 相容端點與 MCP | +- **A lasting workspace**: each agent has its own chats, run history, and optional long-term memory. +- **A real computer**: open pages, use the terminal, organize files, drive the GUI — and watch it live. +- **Take over any time**: sign in, pass a check, or nudge things by hand on the same desktop, then hand it back. +- **Several agents and groups**: shared Team computers or private dedicated desktops. +- **Teach by demo, then schedule**: turn a walkthrough into a skill; use cron for repeat work. +- **Your models and tools**: xAI, OpenCode Go, OpenAI-compatible endpoints, MCP, and file skills. +- **Voice calls**: after you enable a voice provider, you can talk to the agent on a call. +- **Phone-friendly**: collapse the chat sidebar; the remote desktop has keyboard, trackpad, right-click, drag, and scroll. +- **English and Traditional Chinese**: switch the UI language in the app. -## 快速開始 +## Quick start -### 需求 +You need Docker and Compose, Git, Make, Python 3, and an API key for a supported model. On macOS use Docker Desktop or OrbStack; on Linux use Docker Engine. -- macOS 或 Linux -- Docker Engine / Docker Desktop（含 Compose） -- Make、Git -- 至少 4 核 CPU、8 GB RAM；建議 8 核、16 GB RAM -- 一組支援的模型 API 金鑰 - -第一次啟動會建置 Debian、XFCE、Chromium 桌面映像，因此會比後續啟動久。 +From the repo root: ```bash -git clone -cd LazyBoy - make env -# 編輯 .env，至少填入 XAI_API_KEY、OPENCODE_GO_API_KEY -# 或 OPENAI_API_KEY 其中之一 +``` +Edit the generated `.env` and set one of `XAI_API_KEY`, `OPENCODE_GO_API_KEY`, or `OPENAI_API_KEY`. The init tool creates the login and service secrets; running it again keeps existing values. + +```bash make up make health ``` -開啟 [http://127.0.0.1:3101](http://127.0.0.1:3101)，使用 `.env` 中的 `LAZYBOY_APP_TOKEN` 登入，建立第一個 Agent，然後直接描述目標。 +Open **[http://127.0.0.1:3101](http://127.0.0.1:3101)**, sign in with `LAZYBOY_APP_TOKEN` from `.env`, create an agent, and pick a model. -```text -打開指定的訓練網站，完成還沒看完的章節，最後整理進度。 -``` +The first run builds the API and Linux desktop images from source and takes a while. The build toolchain lives in the containers, so a full Docker deploy does not need Rust or Node.js on the host. -常用指令： +Try a concrete task: -| 指令 | 用途 | -| --- | --- | -| `make up` | 建置並啟動完整堆疊 | -| `make health` | 檢查 API 健康狀態 | -| `make logs` | 持續查看服務日誌 | -| `make ps` | 查看容器狀態 | -| `make down` | 停止服務，保留 PostgreSQL 資料 | -| `make purge` | 停止服務並刪除 PostgreSQL volume | +> Open the site I name, summarize the page, and save the notes as a Markdown file in the workspace. -沒有 Make 時，可以從 `.env.example` 建立設定後執行： +Status and logs: ```bash -cp .env.example .env -# 為 LAZYBOY_APP_TOKEN、SANDBOX_SUPERVISOR_TOKEN、 -# LAZYBOY_VAULT_KEY 各自執行一次 openssl rand -hex 32 -docker compose up -d --build +make ps +make logs +make down # stop services, keep PostgreSQL data ``` -## 核心能力 +For resource limits, environment variables, HTTPS, and in-container sudo, see [Operations](./docs/operations.md). -| 能力 | 實際行為 | -| --- | --- | -| 可觀察的電腦操作 | 右側 noVNC 顯示 Agent 的 1280×800 桌面；模型觀察與人類畫面分流 | -| 瀏覽器與原生桌面控制 | 網頁透過 CDP 元素操作；原生 UI 使用 AT-SPI，必要時才退回座標 | -| 人工接管 | 登入、2FA、驗證碼或敏感步驟可暫停 Agent，由使用者接管後續跑 | -| 示範教學 | 記錄語意操作事件並整理成 playbook，不依賴固定像素重播 | -| 長期記憶 | PostgreSQL + pgvector + MiniLM；只保存明確要求記住的內容 | -| 安全登入 | 每個 Agent 的 AES-256-GCM 憑證庫；只對相符的 HTTPS 網域填入 | -| 排程 | 五欄 cron、時區支援、立即試跑；到期任務進入一般 run 佇列 | -| 多 Agent 與群組 | Team 共用電腦可分配不同 DISPLAY；私人模式使用獨立容器 | -| MCP 與檔案技能 | 支援 stdio、HTTP、SSE MCP，以及 `data/skills/*/SKILL.md` | -| 語音通話 | 前端提供可設定的即時語音工作階段 | -| 中英介面 | `zh-TW` 與 English 文案共用完整 key 契約 | +## On a phone -## 一個任務如何完成 +Desktop and phone share the same web UI. After you deploy on a host the phone can reach, open that URL in the phone browser. `127.0.0.1` is the phone itself — it will not reach another machine. -```mermaid -flowchart LR - U["你
文字・附件・語音"] --> W["React 工作空間
對話・電腦・記憶"] - W -->|HTTP / WebSocket| A["Rust API + Agent
模型・工具・技能"] - A -->|受控工具呼叫| S["Supervisor
資源與生命週期"] - S -->|啟動 / 暫停 / 恢復| C["隔離 Linux 電腦
Chromium・XFCE・檔案"] - C -->|畫面與事件| W +Tap outside the chat sidebar to collapse it. On the remote desktop you can switch between tap-to-click and trackpad, and use the toolbar for keyboard, right-click, or drag. Put the service behind HTTPS before you expose it; see [Operations](./docs/operations.md#安全模型). - Q["排程"] -. Cron .-> A - A <--> M[("PostgreSQL
Session・記憶・事件")] - V["加密憑證庫"] -. 僅相符 HTTPS 網域 .-> C +## Stack - classDef ui fill:#151517,stroke:#3ec5a8,color:#f1f1f2 - classDef core fill:#101012,stroke:#85858a,color:#f1f1f2 - classDef secure fill:#221c0e,stroke:#fcd68a,color:#f1f1f2 - class U,W ui - class A,M,Q core - class S,C,V secure -``` +- **Frontend**: React 19, TypeScript, Vite, noVNC +- **Backend**: Rust 2024, Axum, Tokio +- **Data**: PostgreSQL, pgvector, SQLx +- **Desktop**: Docker, Debian, XFCE, Chromium, Xvfb +- **Computer control**: CDP, AT-SPI, X11 +- **Extensions**: MCP, file skills, demonstration playbooks -
+Flow diagrams, handoff, component roles, and the computer lifecycle live in **[Architecture](./docs/architecture.md)**. The older **[interactive diagram](./docs/workflow.html)** is still there — download it and open it in a browser. -**[開啟可縮放、可搜尋、支援深色模式的互動流程圖 →](./docs/workflow.html)** +## Local development -
- -主流程之外還有兩個重要迴圈： - -1. **接管迴圈**：使用者接管時，進行中的 run 進入等待；釋放後從目前畫面重新排隊執行。 -2. **技能迴圈**：示範期間記錄控制項與頁面情境，模型整理成 playbook；往後仍在當下畫面重新尋找元素，不重播舊座標。 - -## 系統架構 - -LazyBoy 的公開入口只有 API。Supervisor 位於 Compose 內部 control network，不直接對主機開埠；Agent 桌面也不掛載主機 Docker socket。 - -```text -Browser - │ HTTP / WebSocket / authenticated screen proxy - ▼ -lazyboy-api (:3101) - ├── React 靜態前端 - ├── Session / Run / Memory / Schedule / Vault - ├── Model provider / MCP client - └── PostgreSQL + pgvector - │ - │ authenticated internal control API - ▼ -lazyboy-supervisor (:7091, internal only) - │ - ├── provision / pause / resume / stop - ├── CPU / memory / PID limits - └── isolated computer containers - ├── Chromium + CDP - ├── XFCE + AT-SPI - ├── Xvfb + x11vnc + websockify - └── per-computer persisted home -``` - -### 主要元件 - -| 元件 | 職責 | -| --- | --- | -| `apps/web` | Vite + React 19 三欄工作空間、noVNC、語音與雙語 UI | -| `crates/api` | 對外 Axum API、Agent run、Session、排程、記憶、MCP、保險箱 | -| `crates/harness` | 模型供應商、憑證解析與語音契約 | -| `crates/supervisor` | Docker 電腦生命週期、隔離與資源上限 | -| `crates/control` | CDP、AT-SPI、X11 與畫面觀察操作 | -| `crates/controld` | 電腦容器內部的 localhost 控制服務 | -| `crates/contracts` | 跨 crate 的 Bot、Run、Computer、Voice 資料契約 | -| `PostgreSQL` | 對話、run、記憶、排程、憑證與保留政策 | - -### 電腦生命週期 - -```mermaid -stateDiagram-v2 - [*] --> Stopped - Stopped --> Booting: 第一個需要 GUI 的工具 - Booting --> Running: ready - Running --> WaitingTakeover: 使用者接管 / 2FA - WaitingTakeover --> Running: 釋放控制權 - Running --> Suspended: 閒置 10 分鐘 - Suspended --> Running: 新任務或畫面心跳 - Suspended --> Stopped: 休眠約 6 小時 - Running --> Stopped: 手動停止 -``` - -## 安全模型 - -目前程式碼包含下列防護： - -- API session token 與 Supervisor token 分離。 -- Supervisor 只在內部 Compose network，並使用 `no-new-privileges`、唯讀 root filesystem 與 capability drop。 -- 每台電腦有 CPU、RAM、PID 上限；預設 2 CPU、2 GB、2048 PID。 -- API 預設只綁定 `127.0.0.1:3101`。 -- 憑證以獨立 `LAZYBOY_VAULT_KEY` 加密，輪替登入 token 時不應更換此 key。 -- 已保存登入只接受 HTTPS、精確或合法子網域匹配，不對相似惡意網域填入。 -- Markdown 連結限制為 HTTP(S)、`mailto:`、`tel:` 與頁內錨點。 -- 日誌有大小與檔案數上限；診斷資料有可設定的保留週期。 - -部署注意事項： - -1. 對區網或網際網路開放前，先放在 HTTPS reverse proxy 後方，並設定 `LAZYBOY_SECURE_COOKIE=true`。 -2. 不要把 Supervisor `:7091` 對外發布，也不要將 Docker socket 掛進 Agent 電腦。 -3. `LAZYBOY_APP_TOKEN`、`SANDBOX_SUPERVISOR_TOKEN`、`LAZYBOY_VAULT_KEY` 必須使用不同的高熵值。 -4. 模型仍可能看見任務所需的網頁內容與截圖；密碼、token 與高敏感資料不要放進提示詞。 -5. CAPTCHA、2FA 與不確定的敏感操作應由使用者接管。 - -## 硬體與資源 - -| 項目 | 最低可執行 | 建議 | -| --- | --- | --- | -| CPU | 4 核 | 8 核以上 | -| RAM | 8 GB，單台電腦 | 16 GB 以上 | -| 磁碟 | 約 15 GB | Docker 至少保留 30 GB | -| GPU | 不需要 | 模型預設走外部 API | -| 作業系統 | macOS / Linux | Linux 可選配 LXCFS 顯示容器內 cgroup 配額 | - -每台電腦的預設限制可由 `LAZYBOY_COMPUTER_CPUS`、`LAZYBOY_COMPUTER_MEMORY_MB`、`LAZYBOY_COMPUTER_PIDS` 調整。瀏覽器分頁的心跳會維持熱機；沒有工作且約 10 分鐘無人觀看時暫停，持續休眠約 6 小時後停止。 - -## 設定 - -`make env` 會以 `.env.example` 為基礎建立 `.env`，並保留既有金鑰。 - -| 變數 | 用途 | 預設 | -| --- | --- | --- | -| `XAI_API_KEY` | xAI 模型 | 空 | -| `OPENCODE_GO_API_KEY` | OpenCode Go 模型 | 空 | -| `OPENAI_API_KEY` | OpenAI 相容端點 | 空 | -| `LAZYBOY_APP_TOKEN` | Web 登入 token | 必填 | -| `SANDBOX_SUPERVISOR_TOKEN` | API ↔ Supervisor 驗證 | 必填 | -| `LAZYBOY_VAULT_KEY` | 憑證庫加密 key | 必填且必須保持穩定 | -| `LAZYBOY_BIND_IP` | 主機監聽位址 | `127.0.0.1` | -| `LAZYBOY_SECURE_COOKIE` | HTTPS-only cookie | `false` | -| `LAZYBOY_COMPUTER_CPUS` | 每台電腦 CPU | `2` | -| `LAZYBOY_COMPUTER_MEMORY_MB` | 每台電腦記憶體 | `2048` | -| `LAZYBOY_COMPUTER_PIDS` | 每台電腦 PID 上限 | `2048` | -| `LAZYBOY_MEMORY_ENABLED` | 長期記憶 | `true` | - -完整清單與保留政策請見 [`.env.example`](./.env.example)。 - -## 二次開發 - -### 本機開發 +Besides Docker, you need a Rust toolchain that supports the 2024 edition, plus Node.js / npm. ```bash -make dev # 準備 .env、PostgreSQL、電腦映像 -make dev-supervisor # 終端 1：Supervisor :7091 -make dev-api # 終端 2：API :3101 +make dev +make dev-supervisor # terminal 1 +make dev-api # terminal 2 ``` -前端熱更新： +Frontend hot reload in another terminal: ```bash cd apps/web npm install -npm run dev # http://127.0.0.1:5173 +npm run dev ``` -### 檢查與測試 +Open [http://127.0.0.1:5173](http://127.0.0.1:5173). Tests and the tree layout are in the [development guide](./docs/development.md). -```bash -make fmt -make clippy -make test +## Docs -cd apps/web -npm run typecheck -npm run build +The guides below are currently in Traditional Chinese. -cd ../.. -node --test tests/frontend.test.mjs -python3 tests/control.test.py -python3 tests/log-rotation.test.py +| Doc | Contents | +| --- | --- | +| [Architecture](./docs/architecture.md) | Task flow, system architecture, computer lifecycle | +| [Interactive diagram](./docs/workflow.html) | Zoomable, searchable HTML chart; download and open | +| [Operations](./docs/operations.md) | Resources, env vars, security, site checks, sudo | +| [Development](./docs/development.md) | Local dev, checks and tests, directory layout | +| [Env example](./.env.example) | Environment variables and defaults | -# 需要已啟動的 PostgreSQL Compose service -docker compose up -d postgres -python3 tests/retention.test.py -``` +## Data -### 專案結構 - -```text -LazyBoy/ -├── apps/web/ React 前端與 noVNC 頁面 -├── crates/ -│ ├── api/ 對外 API 與 Agent 執行迴圈 -│ ├── contracts/ 跨元件資料契約 -│ ├── control/ 瀏覽器與桌面控制 -│ ├── controld/ 容器內控制服務 -│ ├── harness/ 模型與語音後端 -│ ├── sandbox/ API 到 Supervisor 的抽象 -│ └── supervisor/ Docker 生命週期管理 -├── image/ API、Supervisor、電腦映像 -├── migrations/ SQLx PostgreSQL migrations -├── tests/ Rust 以外的契約與回歸測試 -├── scripts/ 環境初始化與執行工具 -├── docs/hero.html README 首頁視覺原稿 -├── docs/workflow.html 可互動產品流程圖 -├── docker-compose.yml 正式堆疊 -└── Makefile 常用開發與部署指令 -``` - -## 徽章與開源認證 - -README 頂端目前只顯示可以直接從原始碼驗證的資訊徽章，不把「尚未執行的檢查」包裝成通過。 - -若要取得可公開查驗的安全與品質徽章，建議依序完成： - -- [ ] 在公開 GitHub repository 建立正式 mirror；OpenSSF 的公開查驗以 GitHub 為主要整合目標。 -- [ ] 加入完整 `LICENSE`、`SECURITY.md`、`CONTRIBUTING.md` 與行為準則。 -- [ ] 建立 CI：Rust format / Clippy / tests、前端 typecheck / build / tests。 -- [ ] 啟用 Dependabot 或 Renovate、CodeQL、secret scanning 與 branch protection。 -- [ ] 執行並發布 [OpenSSF Scorecard](https://scorecard.dev/) 結果後，再加入 Scorecard 徽章。 -- [ ] 在 [OpenSSF Best Practices](https://www.bestpractices.dev/) 登記專案、誠實完成 Passing 問卷後，再加入認證徽章。 -- [ ] 若提供容器映像，再加入 SBOM、簽章與可重現版本發布流程。 - -> 不建議現在顯示 CI passing、coverage、OpenSSF 或 Best Practices 徽章：目前 repository 沒有對應的公開結果，徽章會失真或直接顯示 unknown。 - -## 專案狀態 - -LazyBoy 目前版本為 `0.1.0`，仍屬早期階段。建議先在本機或受信任網路中使用；對外部署前請完成威脅模型、權限檢查、備份與還原演練。 - -Cargo workspace 的授權中繼資料宣告為 MIT。若要正式公開散布，應先在 repository 根目錄補上完整 MIT `LICENSE` 文字，再把上方授權徽章改為連到該檔案。 +Chats, memory, browser profiles, and encrypted credentials stay on your host. When you use an external model, the prompts, tool results, and screenshots the task needs may still be sent to that provider. ---
-用自然語言交代工作，保留看得見、接得回來的控制權。 +**Daniel Wang** Taiwan + +[igs170911@gmail.com](mailto:igs170911@gmail.com) + +Buy Me a Coffee + +[Apache License 2.0](./LICENSE)
diff --git a/README.zh-TW.md b/README.zh-TW.md new file mode 100644 index 0000000..8f1add3 --- /dev/null +++ b/README.zh-TW.md @@ -0,0 +1,133 @@ +
+ +LazyBoy + +[English](./README.md) · **繁體中文** + +# LazyBoy + +**給 AI 一台電腦，讓它替你動手做事。** + +自架的 AI Agent 工作空間。用文字或語音交代任務，即時觀看桌面操作，隨時接回控制權。 + +[快速開始](#快速開始) · [功能](#功能) · [架構與流程圖](./docs/architecture.md) · [部署指南](./docs/operations.md) · [開發指南](./docs/development.md) + +
+ +![LazyBoy 工作空間：Agent 清單、對話與即時桌面](./docs/readme-hero.png) + +LazyBoy 讓 Agent 在 Docker 裡使用自己的 Linux 桌面，操作瀏覽器、終端與檔案。你可以建立不同的 Agent、在群組中協作，把示範整理成技能，再安排定時執行。 + +目前為早期版本 `0.1.0`，提供桌面與手機瀏覽器介面；模型金鑰由你自行設定。 + +## 功能 + +- **持續的工作空間**：每個 Agent 有自己的對話、工作紀錄與可設定的長期記憶。 +- **真的能操作電腦**：開網頁、使用終端、整理檔案、操作圖形介面，過程可即時觀看。 +- **隨時人工接管**：在同一個桌面完成登入、驗證或手動調整，再交回 Agent。 +- **多 Agent 與群組**：支援 Team 共用電腦與 Private 獨立電腦模式。 +- **示範教學與排程**：把操作示範整理成技能，使用 cron 安排重複工作。 +- **自選模型與工具**：支援 xAI、OpenCode Go、OpenAI 相容端點，以及 MCP 與檔案技能。 +- **語音通話**：設定語音服務後，可以透過通話與 Agent 互動。 +- **手機操作**：可收合聊天側欄，遠端桌面提供鍵盤、觸控板、右鍵、拖曳與捲動控制。 +- **英文與繁體中文**：可在介面切換語言。 + +## 快速開始 + +需要 Docker 與 Compose、Git、Make、Python 3，以及一組支援的模型 API 金鑰。macOS 可使用 Docker Desktop 或 OrbStack；Linux 可使用 Docker Engine。 + +取得本專案原始碼後，在專案根目錄執行： + +```bash +make env +``` + +編輯產生的 `.env`，填入 `XAI_API_KEY`、`OPENCODE_GO_API_KEY` 或 `OPENAI_API_KEY` 其中之一。初始化工具會產生登入與服務所需的金鑰，重新執行時保留既有設定。 + +```bash +make up +make health +``` + +開啟 **[http://127.0.0.1:3101](http://127.0.0.1:3101)**，用 `.env` 裡的 `LAZYBOY_APP_TOKEN` 登入，建立 Agent 並選擇模型。 + +第一次會從原始碼建置 API 與 Linux 桌面映像，所需時間較長。容器內已包含建置環境，完整 Docker 部署不需要在主機安裝 Rust 或 Node.js。 + +可以先試一個具體任務： + +> 開啟我指定的網站，整理頁面重點，將結果存成工作區裡的 Markdown 檔案。 + +服務狀態與日誌： + +```bash +make ps +make logs +make down # 停止服務，保留 PostgreSQL 資料 +``` + +資源限制、環境變數、HTTPS 與容器內 sudo 設定，請見 [部署與操作](./docs/operations.md)。 + +## 在手機上使用 + +手機與桌面使用同一個 Web 介面。將服務部署在可連線的主機後，用手機瀏覽器開啟該服務的網址即可；`127.0.0.1` 只代表手機本身，不能拿來連另一台電腦。 + +聊天側欄可點外側空白處收合。操作遠端桌面時，可切換直接點選與觸控板模式，使用工具列叫出鍵盤、按右鍵或拖曳。對外提供服務時請設定 HTTPS，詳見 [部署指南](./docs/operations.md#安全模型)。 + +## 技術組成 + +- **前端**：React 19、TypeScript、Vite、noVNC +- **後端**：Rust 2024、Axum、Tokio +- **資料**：PostgreSQL、pgvector、SQLx +- **桌面**：Docker、Debian、XFCE、Chromium、Xvfb +- **電腦控制**：CDP、AT-SPI、X11 +- **擴充**：MCP、檔案技能、示範 playbook + +流程圖、控制權交接、元件職責與電腦生命週期狀態機，集中在 **[架構與流程](./docs/architecture.md)**。原有的 **[互動流程圖](./docs/workflow.html)** 也保留；下載後用瀏覽器開啟即可操作。 + +## 本機開發 + +除了 Docker，需安裝支援 Rust 2024 edition 的 Rust 工具鏈，以及 Node.js／npm。 + +```bash +make dev +make dev-supervisor # 終端 1 +make dev-api # 終端 2 +``` + +前端熱更新使用另一個終端： + +```bash +cd apps/web +npm install +npm run dev +``` + +開啟 [http://127.0.0.1:5173](http://127.0.0.1:5173)。測試指令與專案目錄說明請見 [開發指南](./docs/development.md)。 + +## 文件 + +| 文件 | 內容 | +| --- | --- | +| [架構與流程](./docs/architecture.md) | 任務流程圖、系統架構、電腦生命週期狀態機 | +| [互動流程圖](./docs/workflow.html) | 可縮放、搜尋的 HTML 圖表；下載後開啟 | +| [部署與操作](./docs/operations.md) | 資源、環境變數、安全設定、網站驗證、sudo | +| [開發指南](./docs/development.md) | 本機開發、檢查與測試、目錄結構 | +| [設定範例](./.env.example) | 環境變數與預設值 | + +## 資料 + +對話、記憶、瀏覽器設定檔與加密憑證保存在自架主機。使用外部模型時，任務所需的提示詞、工具結果與截圖仍可能傳送給該模型供應商。 + +--- + +
+ +**danielwang** Taiwan + +[igs170911@gmail.com](mailto:igs170911@gmail.com) + +請我喝杯咖啡 + +[Apache License 2.0](./LICENSE) + +
diff --git a/apps/web/index.html b/apps/web/index.html index 1f6d4be..0d4211b 100644 --- a/apps/web/index.html +++ b/apps/web/index.html @@ -1 +1 @@ -LazyBoy
+LazyBoy
diff --git a/apps/web/public/apple-touch-icon.png b/apps/web/public/apple-touch-icon.png index fd048a4..9a31f2e 100644 Binary files a/apps/web/public/apple-touch-icon.png and b/apps/web/public/apple-touch-icon.png differ diff --git a/apps/web/public/favicon.png b/apps/web/public/favicon.png index 98a242f..15f05ef 100644 Binary files a/apps/web/public/favicon.png and b/apps/web/public/favicon.png differ diff --git a/apps/web/public/lazyboy-icon.png b/apps/web/public/lazyboy-icon.png new file mode 100644 index 0000000..210c384 Binary files /dev/null and b/apps/web/public/lazyboy-icon.png differ diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx index fda053b..7cf2c66 100644 --- a/apps/web/src/App.tsx +++ b/apps/web/src/App.tsx @@ -115,6 +115,12 @@ export function App(){ const [rightCollapsed,setRightCollapsed]=useState(paneStart.collapsed); const [rightPart,setRightPart]=useState(paneStart.part); const [sessionMenuOpen,setSessionMenuOpen]=useState(false); const [clearOpen,setClearOpen]=useState(false); const [sessionToDelete,setSessionToDelete]=useState(null); const [remembered,setRemembered]=useState>({}); const [mobileNav,setMobileNav]=useState(false); const [error,setError]=useState(null); const [busy,setBusy]=useState(false); + useEffect(()=>{ + if(!mobileNav)return; + const dismiss=(event:KeyboardEvent)=>{if(event.key==="Escape")setMobileNav(false)}; + window.addEventListener("keydown",dismiss); + return()=>window.removeEventListener("keydown",dismiss); + },[mobileNav]); const [desktopClipboard,setDesktopClipboard]=useState(""); const active=bots.find(b=>b.id===activeId)||null; const activeRoom=rooms.find(room=>room.id===activeRoomId)||null; const [clipboardOpen,setClipboardOpen]=useState(false); @@ -196,7 +202,7 @@ export function App(){ useEffect(()=>{if(!plusOpen)setSkillQuery("")},[plusOpen]); useEffect(()=>{messageEndRef.current?.scrollIntoView({block:"end",behavior:"smooth"})},[activeSessionId,lastMessageId,workingMembers.length,pausedForUser]); useEffect(()=>{if(!activeSessionId||(!activeId&&!activeRoomId)){refreshSeqRef.current+=1;setMessages([]);setScreenUrl(null);if(!activeId&&!activeRoomId)setComputer(blankComputer);return}setScreenUrl(null);refresh().catch(e=>setError(localizeError(e.message)));const timer=setInterval(()=>{refresh().catch(()=>{});const beat=roomsRef.current.find(room=>room.id===activeRoomId)?.members[0]?.id||activeId;if(beat)api(`/api/computer/${beat}/heartbeat`,{method:"POST",body:"{}"}).catch(()=>{})},2000);return()=>{clearInterval(timer);refreshSeqRef.current+=1}},[activeId,activeRoomId,activeSessionId,refresh]); - useEffect(()=>{const listener=(event:MessageEvent)=>{if(event.origin!==location.origin||event.source!==desktopFrameRef.current?.contentWindow||!event.data)return;if(event.data.type==="lazyboy-desktop-clipboard"){const text=String(event.data.text||"");setDesktopClipboard(text);navigator.clipboard?.writeText(text).then(()=>setClipboardStatus(t("clipboardSynced"))).catch(()=>setClipboardStatus(t("clipboardSyncBlocked")))}if(event.data.type==="lazyboy-copy-request"&&computer.controlHolder==="user")void copySelection();if(event.data.type==="lazyboy-paste-text"&&typeof event.data.text==="string")pasteText(event.data.text);if(event.data.type==="lazyboy-paste-request"&&computer.controlHolder==="user")setClipboardOpen(true);if(event.data.type==="lazyboy-desktop-ready")setDesktopReady(true);if(event.data.type==="lazyboy-desktop-lost")setDesktopReady(false)};window.addEventListener("message",listener);return()=>window.removeEventListener("message",listener)}); + useEffect(()=>{const listener=(event:MessageEvent)=>{if(event.origin!==location.origin||event.source!==desktopFrameRef.current?.contentWindow||!event.data)return;if(event.data.type==="lazyboy-desktop-clipboard"){const text=String(event.data.text||"");setDesktopClipboard(text);navigator.clipboard?.writeText(text).then(()=>setClipboardStatus(t("clipboardSynced"))).catch(()=>setClipboardStatus(t("clipboardSyncBlocked")))}if(event.data.type==="lazyboy-copy-request"&&computer.controlHolder==="user")void copySelection();if(event.data.type==="lazyboy-paste-text"&&typeof event.data.text==="string")pasteText(event.data.text);if(event.data.type==="lazyboy-mobile-key"&&typeof event.data.key==="string"&&["Return","BackSpace","Tab","Escape","Left","Right","Up","Down"].includes(event.data.key))queueDesktopInput({kind:"key",key:event.data.key});if(event.data.type==="lazyboy-paste-request"&&computer.controlHolder==="user")setClipboardOpen(true);if(event.data.type==="lazyboy-desktop-ready")setDesktopReady(true);if(event.data.type==="lazyboy-desktop-lost")setDesktopReady(false)};window.addEventListener("message",listener);return()=>window.removeEventListener("message",listener)}); useEffect(()=>{setDesktopReady(false)},[screenUrl,paneBotId]); useEffect(()=>{if(skipHandoffRef.current){skipHandoffRef.current=false;holderRef.current=computer.controlHolder;paneBotRef.current=paneBotId;return}if((holderRef.current!==computer.controlHolder||paneBotRef.current!==paneBotId)&&computer.state==="running")setHandingOff(true);holderRef.current=computer.controlHolder;paneBotRef.current=paneBotId},[computer.controlHolder,paneBotId,computer.state]); useEffect(()=>{if(!handingOff)return;const timer=setTimeout(()=>setHandingOff(false),1600);return()=>clearTimeout(timer)},[handingOff]); @@ -210,7 +216,7 @@ export function App(){ useEffect(()=>{localStorage.setItem(PANE_STORE,JSON.stringify({collapsed:rightCollapsed,part:rightPart}))},[rightCollapsed,rightPart]); useEffect(()=>{if(!paneBotId){setSchedules([]);return}api(`/api/bots/${paneBotId}/schedules`).then(setSchedules).catch(()=>setSchedules([]))},[paneBotId]); useEffect(()=>{if(computer.takeoverRequested){setRightPart("computer");setRightCollapsed(false)}},[computer.takeoverRequested]); - function openPane(part:RightPart){setRightPart(part);setRightCollapsed(false)} + function openPane(part:RightPart){setMobileNav(false);setRightPart(part);setRightCollapsed(false)} async function openLoginScreen(){ const id=paneBot?.id||active?.id;if(!id)return; setRightPart("computer");setRightCollapsed(false);setComputerOpen(true); @@ -258,13 +264,14 @@ export function App(){ async function clearSession(){if(!activeSessionId)return;setClearOpen(false);setSessionMenuOpen(false);await action(async()=>{await api(`/api/sessions/${activeSessionId}/messages`,{method:"DELETE"});setMessages([]);await loadSessions()})} async function deleteSession(id:string){if(!sessionsPath||!sessionStoreKey)return;setSessionMenuOpen(false);setBusy(true);setError(null);try{await api(`/api/sessions/${id}`,{method:"DELETE"});const next=await api(sessionsPath);setSessions(next);const pick=id===activeSessionId||!next.some(session=>session.id===activeSessionId)?next[0]?.id||null:activeSessionId;setActiveSessionId(pick);if(pick)writeSessionStore(sessionStoreKey,pick)}catch(e){setError(e instanceof Error?localizeError(e.message):t("operationFailed"))}finally{setBusy(false)}} async function rememberMessage(message:Message){const botId=message.speakerBotId||active?.id||activeRoom?.members[0]?.id;if(!botId||!message.body.trim())return;try{await api(`/api/bots/${botId}/memories`,{method:"POST",body:JSON.stringify({content:message.body,sessionId:activeSessionId})});setRemembered(current=>({...current,[message.id]:true}))}catch(e){setError(e instanceof Error?localizeError(e.message):t("rememberFailed"))}} - function pasteText(text:string){ + function pasteText(text:string){queueDesktopInput({kind:"clipboard",text})} + function queueDesktopInput(input:{kind:"clipboard";text:string}|{kind:"key";key:string}){ const botId=paneBotId; if(!botId||computer.controlHolder!=="user")return; pasteQueueRef.current=pasteQueueRef.current.catch(()=>{}).then(async()=>{ if(currentPaneRef.current!==botId)return; - await api(`/api/computer/${botId}/input`,{method:"POST",body:JSON.stringify({kind:"clipboard",text})}); - if(currentPaneRef.current===botId)setClipboardStatus(t("clipboardPasted")); + await api(`/api/computer/${botId}/input`,{method:"POST",body:JSON.stringify(input)}); + if(input.kind==="clipboard"&¤tPaneRef.current===botId)setClipboardStatus(t("clipboardPasted")); }).catch(()=>setClipboardStatus(t("clipboardPasteFailed"))); } async function copySelection(){ @@ -313,8 +320,9 @@ export function App(){ if(authRequired)return {setAuthRequired(false);setError(null);try{await loadBots()}catch(e){if(e instanceof ApiError&&e.status===401)setAuthRequired(true);else setError(e instanceof Error?localizeError(e.message):t("loginFailed"))}}}/>; return
-
{filteredRooms.length>0&&
{t("groups")}
{filteredRooms.map(room=>)}
} @@ -347,7 +355,7 @@ export function App(){
-
{activeRoom?<>member.id)}/>{activeRoom.name}{setSessionMenuOpen(false);setSessionToDelete(id)}} onClear={()=>{setSessionMenuOpen(false);setClearOpen(true)}}/>{topTools}:active?<>{active.name}{setSessionMenuOpen(false);setSessionToDelete(id)}} onClear={()=>{setSessionMenuOpen(false);setClearOpen(true)}}/>{topTools}:<>{t("chooseBot")}{topTools}}
+
{activeRoom?<>member.id)}/>{activeRoom.name}{setSessionMenuOpen(false);setSessionToDelete(id)}} onClear={()=>{setSessionMenuOpen(false);setClearOpen(true)}}/>{topTools}:active?<>{active.name}{setSessionMenuOpen(false);setSessionToDelete(id)}} onClear={()=>{setSessionMenuOpen(false);setClearOpen(true)}}/>{topTools}:<>{t("chooseBot")}{topTools}}
{callOpen&&voiceSettings?.enabled&&active&&activeSessionId&&!activeRoomId?setCallOpen(false)} onTakeOver={()=>{setRightPart("computer");setRightCollapsed(false);if(active)void action(()=>api(`/api/computer/${active.id}/takeover`,{method:"POST",body:"{}"}))}}/>:null}
{(activeRoom||active)&&messages.length===0?
{activeRoom?:}

{activeRoom?t("startRoomDiscussion",{name:activeRoom.name}):t("startBotWork",{name:active!.name})}

{activeRoom?t("roomWillReply",{names:listJoin(activeRoom.members.map(member=>member.name))}):active!.description||t("botWelcome")}

:messages.map(message=>{const spoken=message.role!=="user"&&Boolean(activeRoom);const speakerName=message.speakerName||(spoken?paneBot?.name:undefined);const speakerShape=(message.speakerShape||paneBot?.avatarShape||"blob") as AvatarShape;const files=messageFiles(message.blocks);const chips=chipBlocks(message.blocks);const hideBody=isAutoAttachCaption(message.body,files)||isAutoScheduleCaption(message.body,chips);return
{spoken&&}{spoken&&{speakerName}}{files.length>0&&
{files.map(file=>)}
}{chips.map((chip,index)=>chip.kind==="login"?
{t("loginNeedsYou")}
{chip.site||message.body}
{chip.why?
{t("loginWhy",{why:chip.why})}
:null}
:chip.kind==="schedule"?
{t("scheduleChip")}
{chip.name}{scheduleWhen(chip.cron,chip.human)}
:
{t("scheduleRunChip")}
{chip.name}{scheduleWhen(chip.cron,chip.human)}
)}{!hideBody&&(message.role==="assistant"?
{message.body}
{message.body.trim()?:null}
:{message.body})}{!hideBody&&message.body.trim()&&}
})}{pausedForUser&&paneBot&&
{computer.controlHolder==="user"?t("pausedUserControl",{name:paneBot.name}):t("pausedNeedsUser",{name:paneBot.name})}{(computer.queuedRuns||0)>0&&<> {t("queuedMessages",{count:computer.queuedRuns||0})}}{computer.controlHolder==="user"?:}
}{teaching&&active&&
{t("teachingLive",{goal:teaching.goal})}{t("teachingHint")}{teaching.eventCount>0&&<> · {t("teachingCaptured",{count:teaching.eventCount})}}
}{drafting&&
{t("distilling",{goal:drafting.goal})}
}{skillDraft&&active&&void saveSkill(skillDraft,name,playbook)} onTest={(name,playbook)=>void testSkill(skillDraft,name,playbook)} onDiscard={()=>void discardSkill(skillDraft)} onEdit={()=>setEditingSkillId(skillDraft.id)} onExport={(name,playbook)=>downloadSkill(name,skillDraft.goal,playbook)}/>} {error&&
{error}
} @@ -818,7 +826,7 @@ function AboutDialog({close}:{close:()=>void}){ const[health,setHealth]=useState<"ok"|"bad"|"…">("…"); useEffect(()=>{fetch("/api/health").then(r=>r.ok?setHealth("ok"):setHealth("bad")).catch(()=>setHealth("bad"))},[]); return

{t("about")}

-
LazyBoy0.1.0
+
LazyBoy0.1.0

{t("aboutDescription")}

{t("apiStatus",{status:health==="ok"?t("statusNormal"):health==="bad"?t("statusUnavailable"):t("statusChecking")})}

diff --git a/apps/web/src/responsive.css b/apps/web/src/responsive.css index f8716e6..eb816c0 100644 --- a/apps/web/src/responsive.css +++ b/apps/web/src/responsive.css @@ -26,3 +26,32 @@ .computer-part .preview{max-height:none} } @media(prefers-reduced-motion:reduce){.computer-signal,.computer-signal::before,.computer-signal-face i,.avatar.blobatar.thinking,.avatar-stack .stack-item .avatar.thinking{animation:none!important}} + +/* Mobile conversation drawer and two-row chat header. */ +.mobile-nav-backdrop,.mobile-nav-close{display:none} +.brand-icon{width:30px;height:30px;flex:none;border-radius:9px;margin-right:9px} +@media(max-width:700px){ + .mobile-nav-backdrop{display:block;position:fixed;inset:0;z-index:39;border:0;border-radius:0; + padding:0;background:#0008;backdrop-filter:blur(3px);touch-action:manipulation} + .sidebar{visibility:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)} + .sidebar.open{visibility:visible} + .mobile-nav-close{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px; + margin-left:auto;font-size:26px;line-height:1} + .brand .create-menu-wrap{margin-left:4px} + .topbar{display:grid;grid-template-columns:44px 32px minmax(0,1fr) minmax(0,104px); + grid-template-rows:44px auto;gap:8px;height:auto;flex:0 0 auto; + padding:calc(8px + env(safe-area-inset-top)) 12px 8px;align-items:center} + .topbar>.mobile-menu{grid-column:1;grid-row:1;width:44px;height:44px;justify-content:center} + .topbar>.avatar,.topbar>.avatar-stack{grid-column:2;grid-row:1;margin:0} + .topbar>strong{grid-column:3;grid-row:1;font-size:15px;line-height:1.3} + .topbar>.session-picker{grid-column:4;grid-row:1;margin:0;min-width:0} + .topbar .session-current{max-width:100%;min-height:44px;width:100%} + .topbar>.grow{display:none} + .topbar>.top-tools{grid-column:1 / -1;grid-row:2;display:flex;width:100%;min-width:0; + margin:0;padding:0;border:0;border-radius:0;gap:4px;background:transparent;box-shadow:none} + .topbar .top-tool-button,.topbar .call-entry{flex:1;min-width:0;width:auto} + .topbar .top-tool-button{height:44px;min-height:44px;border-radius:10px;background:var(--surface)} + .topbar .call-entry{display:flex} + .topbar .call-entry>.top-tool-button{width:100%} + .topbar .session-menu{right:0;left:auto;max-width:calc(100vw - 24px)} +} diff --git a/apps/web/vite.config.ts b/apps/web/vite.config.ts index 50d1579..cdec0b1 100644 --- a/apps/web/vite.config.ts +++ b/apps/web/vite.config.ts @@ -1,3 +1,4 @@ +import { readFileSync } from "node:fs"; import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; -export default defineConfig({plugins:[react()],build:{outDir:"dist",emptyOutDir:true},server:{port:5173,proxy:{"/api":{target:"http://127.0.0.1:3101",ws:true},"/view":{target:"http://127.0.0.1:3101",ws:true}}}}); +export default defineConfig({plugins:[react(),{name:"desktop-viewer",generateBundle(){this.emitFile({type:"asset",fileName:"vnc.html",source:readFileSync(new URL("./vnc.html",import.meta.url),"utf8")})}}],build:{outDir:"dist",emptyOutDir:true},server:{port:5173,proxy:{"/api":{target:"http://127.0.0.1:3101",ws:true},"/view":{target:"http://127.0.0.1:3101",ws:true}}}}); diff --git a/apps/web/vnc.html b/apps/web/vnc.html index 40ab22d..9dd3fe2 100644 --- a/apps/web/vnc.html +++ b/apps/web/vnc.html @@ -2,6 +2,7 @@ + LazyBoy desktop