feat: Implement collapsible sidebar and refined status bar UI (#45)
* chore: mark peer dependencies in package-lock.json * docs: add comprehensive developer guide for antigravity-manager * build: add @radix-ui/react-tooltip dependency The tooltip component is needed for future UI enhancements to provide better user guidance and information display. * feat(StatusBar): add collapsed view with toggle button - Introduce `isCollapsed` prop to support both expanded and compact layouts - Collapsed view shows a single icon button with status tooltip - Enhanced visual styling with shadows, borders, and improved spacing - Use Tooltip component to display status in collapsed mode * feat(ui): add Radix UI tooltip component wrapper Create a reusable tooltip component using Radix UI primitives. The wrapper provides styled content with animations and integrates with the project's class name utility for consistent theming. * feat(layout): add collapsible sidebar with persistent state - Add toggle button to collapse/expand sidebar with smooth animations - Persist sidebar state in localStorage to maintain user preference - Show tooltips for navigation items when sidebar is collapsed - Adjust StatusBar component to support collapsed state * chore: remove "peer": true flags from package-lock.json * build: mark peer dependencies in package-lock.json * build: add yaml v2.8.2 dependency and update package-lock * docs(project_overview): update skill documentation formatting * docs: remove extra blank line in AGENTS.md * docs: update changelog formatting to use hyphens * docs: improve readability of OpenSpec workflow files * chore: standardize YAML string quotes in GitHub configs * style(StatusBar): reformat JSX for consistency and readability - Simplify className expres * style(ui): standardize quotes and class order in tooltip component - Use single quotes consistently across imports and strings - Reorder Tailwind CSS classes to follow recommended conventions * style(ipc): remove unnecessary parentheses in debug log statement * style(MainLayout): improve code formatting and consistency - Reformat multi-line import for better readability - Normalize Tailwind CSS class ordering - Remove unnecessary whitespace and ensure consistent quotes - Maintain all functionality while improving code style * style(i18n): format long translation strings for better readability * style: remove unnecessary line break in logger.info call The logger.info call had an unnecessary line break that made the code less readable. The line has been consolidated to improve code style consistency. * chore: disable several ESLint rules for development flexibility Disable TypeScript ESLint rules and other linting rules that are too restrictive during active development. This allows faster iteration without constant linting errors for common patterns like `any` types, unused variables, and inline comments. * refactor: use const for immutable variables in request mapper - Change `let` to `const` for variables that are not reassigned - Improves code clarity and prevents accidental reassignment * refactor: replace direct hasOwnProperty calls with safe variant Use Object.prototype.hasOwnProperty.call to avoid issues when objects have overridden hasOwnProperty method. This ensures consistent behavior across all object types. * fix: disable eslint for intentional assignment in useEffect The eslint warning was triggered by directly using setProxyConfig with config.proxy inside useEffect without including it in the dependency array. This assignment is intentional and only needs to run when config changes, not when setProxyConfig changes. Adding the eslint-disable comment prevents the warning while maintaining correct behavior. * chore: disable react-hooks/exhaustive-deps rule This rule was already disabled; the change only adds a trailing comma to the ESLint configuration for consistency. * fix(eslint): re-enable lint rules for hooks and case-declarations --------- Co-authored-by: Draculabo <[email protected]>
This commit is contained in:
Sujit BiswasandDraculabo authored and GitHub committed
1 parent
9ca0ad0396
commit
1265d044f6
21 files changed
+531
-96
No files matched your search
@@ -0,0 +1,88 @@
|
||||
---
|
||||
name: antigravity-manager
|
||||
description: Comprehensive guide to Antigravity Manager architecture, workflows, and development. Use this to understand how to work on the project.
|
||||
---
|
||||
|
||||
# Antigravity Manager Developer Guide
|
||||
|
||||
## 🏗️ Architecture Overview
|
||||
|
||||
Antigravity Manager is a hybrid Desktop Application built with Electron, React, and NestJS. It follows a modular architecture where the frontend (Renderer) communicates with the backend (Main) via type-safe IPC (ORPC).
|
||||
|
||||
```mermaid
|
||||
graph TD
|
||||
User[User Interface] -->|React/Vite| Renderer[Renderer Process]
|
||||
Renderer -->|ORPC Client| IPC[IPC Layer]
|
||||
IPC -->|ORPC Router| Main[Main Process]
|
||||
Main -->|Bootstraps| Server[NestJS Server]
|
||||
Main -->|Calls| Services[Service Layer]
|
||||
Services -->|Read/Write| DB[(SQLite Database)]
|
||||
Services -->|HTTP| Cloud[Cloud APIs (Google/Anthropic)]
|
||||
```
|
||||
|
||||
### Key Technologies
|
||||
|
||||
- **Frontend**: React 19, TailwindCSS v4, TanStack Router, TanStack Query.
|
||||
- **Backend**: Electron (Main), NestJS (Core Logic), Better-SQLite3 (Data).
|
||||
- **Communication**: ORPC (Type-safe IPC wrapper around Electron IPC).
|
||||
- **Build**: Electron Forge + Vite.
|
||||
|
||||
## 📂 Directory Structure
|
||||
|
||||
- `src/main.ts`: Electron Main Process entry point.
|
||||
- `src/preload.ts`: Bridge between Main and Renderer.
|
||||
- `src/renderer.tsx`: React App entry point.
|
||||
- `src/components/`: Reusable React UI components (Radix UI based).
|
||||
- `src/ipc/`: IPC Routers and Handlers (Domain logic).
|
||||
- `router.ts`: Main ORPC router definition.
|
||||
- `account/`, `cloud/`, `database/`: Domain-specific handlers.
|
||||
- `src/server/`: NestJS application modules (proxies/gateways).
|
||||
- `src/services/`: Core business logic (framework agnostic).
|
||||
- `GoogleAPIService.ts`: Gemini/Cloud interactions.
|
||||
- `AutoSwitchService.ts`: Account rotation logic.
|
||||
- `src/routes/`: Frontend routing definitions (File-based).
|
||||
|
||||
## 🚀 Development Workflow
|
||||
|
||||
### Prerequisites
|
||||
|
||||
- Node.js 18+
|
||||
- npm (Project uses `package-lock.json`)
|
||||
|
||||
### Common Commands
|
||||
|
||||
- **Start Dev Server**: `npm start`
|
||||
- **Lint Code**: `npm run lint`
|
||||
- **Unit Test**: `npm run test:unit`
|
||||
- **E2E Test**: `npm run test:e2e`
|
||||
- **Build Production**: `npm run make`
|
||||
|
||||
## 🧠 Core Concepts
|
||||
|
||||
### IPC Communication (ORPC)
|
||||
|
||||
The project uses `orpc` for type-safe communication.
|
||||
|
||||
- **Define**: Create a router in `src/ipc/router.ts` with Zod schemas.
|
||||
- **Implement**: Add logic in handlers (e.g., `src/ipc/account/handler.ts`).
|
||||
- **Call**: Use the generated client in React components.
|
||||
|
||||
### Database Access
|
||||
|
||||
Data is stored in a local SQLite file (`test.db` in dev, user data in prod).
|
||||
|
||||
- Use `Better-SQLite3` for direct access.
|
||||
- Logic should be encapsulated in `src/services` or `src/ipc`.
|
||||
|
||||
### Account Management
|
||||
|
||||
- Accounts are added via OAuth (Google/Claude).
|
||||
- `GoogleAPIService` handles token exchange and refreshing.
|
||||
- `AutoSwitchService` monitors usage and switches active accounts automatically.
|
||||
|
||||
## ⚠️ Critical Rules
|
||||
|
||||
1. **Type Safety**: strict TypeScript usage; Zod for runtime validation.
|
||||
2. **Components**: Use `src/components/ui` (Radix primitives) for consistency.
|
||||
3. **Async**: Handle all IPC/DB calls asynchronously with try/catch.
|
||||
4. **Security**: Never commit secrets. API keys are user-provided or encrypted locally.
|
||||
@@ -1,14 +1,18 @@
|
||||
---
|
||||
description: Implement an approved OpenSpec change and keep tasks in sync.
|
||||
---
|
||||
|
||||
<!-- OPENSPEC:START -->
|
||||
|
||||
**Guardrails**
|
||||
|
||||
- Favor straightforward, minimal implementations first and add complexity only when it is requested or clearly required.
|
||||
- Keep changes tightly scoped to the requested outcome.
|
||||
- Refer to `openspec/AGENTS.md` (located inside the `openspec/` directory—run `ls openspec` or `openspec update` if you don't see it) if you need additional OpenSpec conventions or clarifications.
|
||||
|
||||
**Steps**
|
||||
Track these steps as TODOs and complete them one by one.
|
||||
|
||||
1. Read `changes/<id>/proposal.md`, `design.md` (if present), and `tasks.md` to confirm scope and acceptance criteria.
|
||||
2. Work through tasks sequentially, keeping edits minimal and focused on the requested change.
|
||||
3. Confirm completion before updating statuses—make sure every item in `tasks.md` is finished.
|
||||
@@ -16,5 +20,6 @@ Track these steps as TODOs and complete them one by one.
|
||||
5. Reference `openspec list` or `openspec show <item>` when additional context is required.
|
||||
|
||||
**Reference**
|
||||
|
||||
- Use `openspec show <id> --json --deltas-only` if you need additional context from the proposal while implementing.
|
||||
<!-- OPENSPEC:END -->
|
||||
@@ -1,13 +1,17 @@
|
||||
---
|
||||
description: Archive a deployed OpenSpec change and update specs.
|
||||
---
|
||||
|
||||
<!-- OPENSPEC:START -->
|
||||
|
||||
**Guardrails**
|
||||
|
||||
- Favor straightforward, minimal implementations first and add complexity only when it is requested or clearly required.
|
||||
- Keep changes tightly scoped to the requested outcome.
|
||||
- Refer to `openspec/AGENTS.md` (located inside the `openspec/` directory—run `ls openspec` or `openspec update` if you don't see it) if you need additional OpenSpec conventions or clarifications.
|
||||
|
||||
**Steps**
|
||||
|
||||
1. Determine the change ID to archive:
|
||||
- If this prompt already includes a specific change ID (for example inside a `<ChangeId>` block populated by slash-command arguments), use that value after trimming whitespace.
|
||||
- If the conversation references a change loosely (for example by title or summary), run `openspec list` to surface likely IDs, share the relevant candidates, and confirm which one the user intends.
|
||||
@@ -19,6 +23,7 @@ description: Archive a deployed OpenSpec change and update specs.
|
||||
5. Validate with `openspec validate --strict` and inspect with `openspec show <id>` if anything looks off.
|
||||
|
||||
**Reference**
|
||||
|
||||
- Use `openspec list` to confirm change IDs before archiving.
|
||||
- Inspect refreshed specs with `openspec list --specs` and address any validation issues before handing off.
|
||||
<!-- OPENSPEC:END -->
|
||||
@@ -1,8 +1,11 @@
|
||||
---
|
||||
description: Scaffold a new OpenSpec change and validate strictly.
|
||||
---
|
||||
|
||||
<!-- OPENSPEC:START -->
|
||||
|
||||
**Guardrails**
|
||||
|
||||
- Favor straightforward, minimal implementations first and add complexity only when it is requested or clearly required.
|
||||
- Keep changes tightly scoped to the requested outcome.
|
||||
- Refer to `openspec/AGENTS.md` (located inside the `openspec/` directory—run `ls openspec` or `openspec update` if you don't see it) if you need additional OpenSpec conventions or clarifications.
|
||||
@@ -10,6 +13,7 @@ description: Scaffold a new OpenSpec change and validate strictly.
|
||||
- Do not write any code during the proposal stage. Only create design documents (proposal.md, tasks.md, design.md, and spec deltas). Implementation happens in the apply stage after approval.
|
||||
|
||||
**Steps**
|
||||
|
||||
1. Review `openspec/project.md`, run `openspec list` and `openspec list --specs`, and inspect related code or docs (e.g., via `rg`/`ls`) to ground the proposal in current behaviour; note any gaps that require clarification.
|
||||
2. Choose a unique verb-led `change-id` and scaffold `proposal.md`, `tasks.md`, and `design.md` (when needed) under `openspec/changes/<id>/`.
|
||||
3. Map the change into concrete capabilities or requirements, breaking multi-scope efforts into distinct spec deltas with clear relationships and sequencing.
|
||||
@@ -19,6 +23,7 @@ description: Scaffold a new OpenSpec change and validate strictly.
|
||||
7. Validate with `openspec validate <id> --strict` and resolve every issue before sharing the proposal.
|
||||
|
||||
**Reference**
|
||||
|
||||
- Use `openspec show <id> --json --deltas-only` or `openspec show <spec> --type spec` to inspect details when validation fails.
|
||||
- Search existing requirements with `rg -n "Requirement:|Scenario:" openspec/specs` before writing new ones.
|
||||
- Explore the codebase with `rg <keyword>`, `ls`, or direct file reads so proposals align with current implementation realities.
|
||||
|
||||
Reference in new issue
Block a user