3 Commits

Author	SHA1	Message	Date
Haile	374e9de719	feat: add opencode support (#762) ... * feat: add opencode support * fix: stabilize opencode session startup * fix: /models * fix: improveUI for commands * fix: format commands.js * feat: load models through provider adapters Provider model selection had outgrown a single hardcoded service. The old service mixed shared caching with provider catalogs and CLI lookup details. That made stale model lists more likely as providers changed on separate schedules. Move model discovery behind each provider so lookup lives next to the integration. The shared service now focuses on provider resolution, caching, persistence, and dedupe. Return cache metadata and add bypassCache because model availability changes outside the app. The UI and /models command can show freshness and let users force a provider refresh. Surface model descriptions while keeping fallback catalogs for unavailable CLIs or SDKs. * feat(models): resolve active session models through provider adapters The model inventory command was showing a mix of catalog defaults and composer-local state instead of the model that is actually active for a real provider session. That made /models, /cost, and /status misleading once a session had already started, especially for providers whose effective runtime model can differ from the optimistic model value held in the UI. Introduce an explicit getCurrentActiveModel() contract on IProviderModels so model resolution lives next to each provider's catalog logic and uses the provider-native source of truth: - Claude reads the init event from a resumed stream-json run - Codex reads model from ~/.codex/config.toml - Cursor reads lastUsedModel from the chat store.db - OpenCode reads the persisted session model from opencode.db - Gemini intentionally returns its default because the CLI does not provide a reliable active-session lookup Keep the returned shape intentionally minimal ({ model }). The goal is to expose only what downstream command consumers need and avoid leaking provider-specific metadata into a shared transport shape that would create extra UI coupling and future cleanup cost. Also make command behavior session-aware: when there is no concrete session id, do not spawn provider processes or inspect provider session storage just to answer /models, /cost, or /status. In a new-session view the correct answer is simply the provider default, and doing more work there adds latency and unnecessary side effects for no user value. As part of this, centralize two supporting concerns: - add a shared helper for building the default current-model result from a provider catalog so fallbacks stay aligned with DEFAULT - move leaf-directory validation into shared utils so Cursor session readers and model lookup code enforce the same path-safety rule Tests were expanded to cover both the new service delegation path and the sessionless command behavior, while keeping cache-sensitive tests isolated from persisted host cache state. Why this change: - command output should reflect the model actually driving a session - new-session views should stay fast and side-effect free - provider-specific active-model lookup should not be scattered across routes or UI code - fallback behavior should be explicit, consistent, and limited to the provider default when no true active model can be resolved * feat: support session-scoped model overrides Model selection was acting like a provider-level preference. That made resumed sessions drift back to a default or request-time model. Users expect /models changes made inside a conversation to affect that session. Store explicit session choices in app-owned ~/.cloudcli state. This avoids editing provider transcripts or native provider config. Resolve the effective model before launching each provider runtime. Claude, Cursor, Codex, Gemini, and OpenCode now honor stored resume choices. Expose a backend active-model change endpoint for existing sessions. The models modal can now distinguish default changes from session overrides. It also shows when a selected model will apply on the next response. For Claude, stop probing active model state by resuming with a dummy prompt. Read the indexed JSONL transcript from the end instead. This preserves provider history while honoring /model stdout or model fields. Add service tests for adapter delegation and resume-model precedence. The tests keep cache state, override state, and requested fallback separate. * feat: make command modal more compact * fix: preserve opencode session creation events OpenCode emits the real session id asynchronously on its first JSON output. The runner registered that id from a helper that could not see the spawned process because the process reference was scoped inside the model-resolution callback. That ReferenceError was swallowed by the generic JSON parse fallback, so the client never received session_created. Without that event, a new OpenCode chat stayed on / and the assistant stream was not attached to the new session view. Keep the process reference in the outer spawn scope so registration can update the active-process map and websocket writer as soon as OpenCode announces the session id. Split JSON parsing from event processing so malformed non-JSON output can still stream as raw text, while registration or adapter failures are surfaced as real errors instead of being hidden as assistant content. Add a fake opencode executable regression test to lock in the expected lifecycle ordering: session_created must be sent before live assistant messages, and the same session id must carry through stream_end and complete. * fix: clarify model refresh and onboarding providers OpenCode is now a supported chat provider, but first-run onboarding still only offered Claude, Cursor, Codex, and Gemini. That made OpenCode harder to discover and forced users to finish setup before finding the provider in settings or chat. Adding it to onboarding keeps first-run setup aligned with the providers the application already supports elsewhere. The model refresh control was also doing too much visual work. In the new chat model picker, the previous Hard Refresh label looked like the dialog heading, which made the primary task unclear. Users open that dialog to choose a model; refreshing catalogs is only a secondary maintenance action for stale cached provider model lists. Rename and reposition the refresh affordance so the model picker reads as a model picker first. The copy now explains why catalogs are cached, when a refresh is useful, and that the refresh checks every provider. The /models modal gets the same clarification so both model-selection surfaces describe the cache behavior consistently. * fix: format opencode model catalog labels OpenCode returns provider-prefixed ids directly from the CLI. Passing those ids through as labels made the model picker hard to scan: users saw values like anthropic/claude-3-5-sonnet-20241022 or lowercased, hyphen-split text instead of readable model names. Keep the exact OpenCode id as the option value because that is what the CLI expects, but derive a presentation label for the frontend. The formatter is intentionally generic rather than a catalog of known providers. It handles common identifier structure such as provider/model, hyphen-delimited words, v-prefixed versions, adjacent numeric version tokens, and 8-digit date suffixes. This keeps OpenCode usable as its model list expands across many upstream providers without requiring code changes for every new provider or model family. The description keeps the raw provider-prefixed id visible so users can still confirm the precise model being selected. * feat: add more fallback models for cursor * docs: move model catalog out of shared The model catalog is no longer a frontend/backend runtime contract. Keeping it under shared made ownership misleading. It implied the catalog was application code shared by runtime consumers, even though it now only supports README links and public API documentation. Move the catalog into public so it lives beside the docs surfaces that need it. This gives the API docs a stable, served module and gives README readers a linkable source without suggesting frontend or backend runtime dependency. Render the API docs model list from the exported provider registry instead of a hardcoded Claude/Cursor/Codex subset. That keeps Gemini and OpenCode visible and makes future provider documentation changes flow through one docs-specific file. Update README links, provider maintenance notes, and package files so published artifacts include the standalone docs page and model catalog without relying on the old shared path. * fix: simplify empty-state model selector Keep the provider empty state focused on the setup action users need there: choosing a model. The refresh control, cache timestamp, and refresh explanation made the dialog feel like a cache-management surface. That extra action is out of place in the empty state, where the goal is to start a chat with the selected provider and model. Remove the refresh-specific UI from ProviderSelectionEmptyState and drop the now-unused refresh/cache props from the ChatMessagesPane pass-through. Refresh behavior remains available in the dedicated command result flow.	2026-05-28 10:50:41 +02:00
Haile	96463df8da	Feature/backend ts support andunification of auth settings on frontend (#654) ... * fix: remove project dependency from settings controller and onboarding * fix(settings): remove onClose prop from useSettingsController args * chore: tailwind classes order * refactor: move provider auth status management to custom hook * refactor: rename SessionProvider to LLMProvider * feat(frontend): support for @ alias based imports) * fix: replace init.sql with schema.js * fix: refactor database initialization to use schema.js for SQL statements * feat(server): add a real backend TypeScript build and enforce module boundaries The backend had started to grow beyond what the frontend-only tooling setup could support safely. We were still running server code directly from /server, linting mainly the client, and relying on path assumptions such as "../.." that only worked in the source layout. That created three problems: - backend alias imports were hard to resolve consistently in the editor, ESLint, and the runtime - server code had no enforced module boundary rules, so cross-module deep imports could bypass intended public entry points - building the backend into a separate output directory would break repo-level lookups for package.json, .env, dist, and public assets because those paths were derived from source-only relative assumptions This change makes the backend tooling explicit and runtime-safe. A dedicated backend TypeScript config now lives in server/tsconfig.json, with tsconfig.server.json reduced to a compatibility shim. This gives the language service and backend tooling a canonical project rooted in /server while still preserving top-level compatibility for any existing references. The backend alias mapping now resolves relative to /server, which avoids colliding with the frontend's "@/..." -> "src/*" mapping. The package scripts were updated so development runs through tsx with the backend tsconfig, build now produces a compiled backend in dist-server, and typecheck/lint cover both client and server. A new build-server.mjs script runs TypeScript and tsc-alias and cleans dist-server first, which prevents stale compiled files from shadowing current source files after refactors. To make the compiled backend behave the same as the source backend, runtime path resolution was centralized in server/utils/runtime-paths.js. Instead of assuming fixed relative paths from each module, server entry points now resolve the actual app root and server root at runtime. That keeps package.json, .env, dist, public, and default database paths stable whether code is executed from /server or from /dist-server/server. ESLint was expanded from a frontend-only setup into a backend-aware one. The backend now uses import resolution tied to the backend tsconfig so aliased imports resolve correctly in linting, import ordering matches the frontend style, and unused/duplicate imports are surfaced consistently. Most importantly, eslint-plugin-boundaries now enforces server module boundaries. Files under server/modules can no longer import another module's internals directly. Cross-module imports must go through that module's barrel file (index.ts/index.js). boundaries/no-unknown was also enabled so alias-resolution gaps cannot silently bypass the rule. Together, these changes make the backend buildable, keep runtime path resolution stable after compilation, align server tooling with the client where appropriate, and enforce a stricter modular architecture for server code. * fix: update package.json to include dist-server in files and remove tsconfig.server.json * refactor: remove build-server.mjs and inline its logic into package.json scripts * fix: update paths in package.json and bin.js to use dist-server directory * feat(eslint): add backend shared types and enforce compile-time contract for imports * fix(eslint): update shared types pattern --------- Co-authored-by: Haileyesus <something@gmail.com>	2026-04-15 13:26:12 +02:00
Haileyesus	844de26ada	Refactor/shared and tasks components (#473) ... * refactor: remove unused TasksSettings component * refactor: migrate TodoList component to a new file with improved structure and normalization logic * refactor: Move Tooltip and DarkModeToggle to shared/ui * refactor: Move Tooltip and DarkModeToggle to shared/view/ui * refactor: move GeminiLogo to llm-logo-provider and update imports * refactor: remove unused GeminiStatus component * refactor: move components in src/components/ui to src/shared/view/ui * refactor: move ErrorBoundary component to main-content/view and update imports * refactor: move VersionUpgradeModal to its own module * refactor(wizard): rebuild project creation flow as modular TypeScript components Replace the monolithic `ProjectCreationWizard.jsx` with a feature-based TS implementation under `src/components/project-creation-wizard`, while preserving existing behavior and improving readability, maintainability, and state isolation. Why: - The previous wizard mixed API logic, flow state, folder browsing, and UI in one file. - Refactoring and testing were difficult due to tightly coupled concerns. - We needed stronger type safety and localized component state. What changed: - Deleted: - `src/components/ProjectCreationWizard.jsx` - Added new modular structure: - `src/components/project-creation-wizard/index.ts` - `src/components/project-creation-wizard/ProjectCreationWizard.tsx` - `src/components/project-creation-wizard/types.ts` - `src/components/project-creation-wizard/data/workspaceApi.ts` - `src/components/project-creation-wizard/hooks/useGithubTokens.ts` - `src/components/project-creation-wizard/utils/pathUtils.ts` - `src/components/project-creation-wizard/components/*` - `WizardProgress`, `WizardFooter`, `ErrorBanner` - `StepTypeSelection`, `StepConfiguration`, `StepReview` - `WorkspacePathField`, `GithubAuthenticationCard`, `FolderBrowserModal` - Updated import usage: - `src/components/sidebar/view/subcomponents/SidebarModals.tsx` now imports from `../../../project-creation-wizard`. Implementation details: - Migrated wizard logic to TypeScript using `type` aliases only. - Kept component prop types colocated in each component file. - Split responsibilities by feature: - container/orchestration in `ProjectCreationWizard.tsx` - API/SSE and request parsing in `data/workspaceApi.ts` - GitHub token loading/caching behavior in `useGithubTokens` - path/URL helpers in `utils/pathUtils.ts` - Localized UI-only state to child components: - folder browser modal state (current path, hidden folders, create-folder input) - path suggestion dropdown state with debounced lookup - Preserved existing UX flows: - step navigation and validation - existing/new workspace modes - optional GitHub clone + auth modes - clone progress via SSE - folder browsing + folder creation - Added focused comments for non-obvious logic (debounce, SSE auth constraint, path edge cases). * refactor(quick-settings): migrate panel to typed feature-based modules Refactor QuickSettingsPanel from a single JSX component into a modular TypeScript feature structure while preserving behavior and translations. Highlights: - Replace legacy src/components/QuickSettingsPanel.jsx with a typed entrypoint (src/components/QuickSettingsPanel.tsx). - Introduce src/components/quick-settings-panel/ with clear separation of concerns: - view/: panel shell, header, handle, section wrappers, toggle rows, and content sections. - hooks/: drag interactions and whisper mode persistence. - constants.ts and types.ts for shared config and strict local typing. - Move drag logic into useQuickSettingsDrag with explicit touch/mouse handling, drag threshold detection, click suppression after drag, position clamping, and localStorage persistence. - Keep user-visible behavior intact: - same open/close panel interactions. - same mobile/desktop drag behavior and persisted handle position. - same quick preference toggles and wiring to useUiPreferences. - same hidden whisper section behavior and localStorage/event updates. - Improve readability and maintainability by extracting repetitive setting rows and section scaffolding into reusable components. - Add focused comments around non-obvious behavior (drag click suppression, touch scroll lock, hidden whisper section intent). - Keep files small and reviewable (all new/changed files are under 300 lines). Validation: - npm run typecheck - npm run build * refactor(quick-settings-panel): restructure QuickSettingsPanel import and create index file * refactor(shared): move shared ui components to share/view/ui without subfolders * refactor(LanguageSelector): move LanguageSelector to shared UI components * refactor(prd-editor): modularize PRD editor with typed feature modules Break the legacy PRDEditor.jsx monolith into a feature-based TypeScript architecture under src/components/prd-editor while keeping behavior parity and readability. Key changes: - Replace PRDEditor.jsx with a typed orchestrator component and a compatibility export bridge at src/components/PRDEditor.tsx. - Split responsibilities into dedicated hooks: document loading/init, existing PRD registry fetching, save workflow with overwrite detection, and keyboard shortcuts. - Split UI into focused view components: header, editor/preview body, footer stats, loading state, generate-tasks modal, and overwrite-confirm modal. - Move filename concerns into utility helpers (sanitize, extension handling, default naming) and centralize template/constants. - Keep component-local state close to the UI that owns it (workspace controls/modal toggles), while shared workflow state remains in the feature container. - Reuse the existing MarkdownPreview component for safer markdown rendering instead of ad-hoc HTML conversion. - Update TaskMasterPanel integration to consume typed PRDEditor directly (remove any-cast) and pass isExisting metadata for correct overwrite behavior. - Keep all new/changed files below 300 lines and add targeted comments where behavior needs clarification. Validation: - npm run typecheck - npm run build * refactor(TaskMasterPanel): update PRDEditor import path to match new structure * refactor(TaskMaster): Remove unused TaskMasterSetupWizard and TaskMasterStatus components * refactor(TaskDetail): remove unused TaskIndicator import * refactor(task-master): migrate tasks to a typed feature module - introduce a new feature-oriented TaskMaster domain under src/components/task-master - add typed TaskMaster context/provider with explicit project, task, MCP, and loading state handling - split task UI into focused components (panel, board, toolbar, content, card, detail modal, setup/help modals, banner) - move task board filtering/sorting/kanban derivation into dedicated hooks and utilities - relocate CreateTaskModal into the feature module and keep task views modular/readable - remove legacy monolithic TaskList/TaskDetail/TaskCard files and route main task panel to the new feature panel - replace contexts/TaskMasterContext.jsx with a typed contexts/TaskMasterContext.ts re-export to the feature context - update MainContent project sync logic to compare by project name to avoid state churn - validation: npm run typecheck, npm run build * refactor(MobileNav): remove unused React import and TaskMasterContext * refactor(auth): migrate login and setup flows to typed feature module - Introduce a new feature-based auth module under src/components/auth with clear separation of concerns:\n - context/AuthContext.tsx for session lifecycle, onboarding status checks, token persistence, and auth actions\n - view/* components for loading, route guarding, form layout, input fields, and error display\n - shared auth constants, utility helpers, and type aliases (no interfaces)\n- Convert login and setup UIs to TypeScript and keep form state local to each component for readability and component-level ownership\n- Add explicit API payload typing and safe JSON parsing helpers to improve resilience when backend responses are malformed or incomplete\n- Centralize error fallback handling for auth requests to reduce repeated logic - Replace legacy auth entrypoints with the new feature module in app wiring:\n - App now imports AuthProvider and ProtectedRoute from src/components/auth\n - WebSocketContext, TaskMasterContext, and Onboarding now consume useAuth from the new typed auth context\n- Remove duplicated legacy auth screens (LoginForm.jsx, SetupForm.jsx, ProtectedRoute.jsx)\n- Keep backward compatibility by turning src/contexts/AuthContext.jsx into a thin re-export of the new provider/hook Result: auth code now follows a feature/domain structure, is fully typed, easier to navigate, and cleaner to extend without touching unrelated UI areas. * refactor(AppContent): update MobileNav import path and add MobileNav component * refactor(DiffViewer): rename different diff viewers and place them in different components * refactor(components): reorganize onboarding/provider auth/sidebar indicator into domain features - Move onboarding out of root-level components into a dedicated feature module: - add src/components/onboarding/view/Onboarding.tsx - split onboarding UI into focused subcomponents: - OnboardingStepProgress - GitConfigurationStep - AgentConnectionsStep - AgentConnectionCard - add onboarding-local types and utils for provider status and validation helpers - Move multi-provider login modal into a dedicated provider-auth feature: - add src/components/provider-auth/view/ProviderLoginModal.tsx - add src/components/provider-auth/types.ts - keep provider-specific command/title behavior and Gemini setup guidance - preserve compatibility for both onboarding flow and settings login flow - Move TaskIndicator into the sidebar domain: - add src/components/sidebar/view/subcomponents/TaskIndicator.tsx - update SidebarProjectItem to consume local sidebar TaskIndicator - Update integration points to the new structure: - ProtectedRoute now imports onboarding from onboarding feature - Settings now imports ProviderLoginModal directly (remove legacy cast wrapper) - git panel consumers now import shared GitDiffViewer by explicit name - Rename git shared diff view to clearer domain naming: - replace shared DiffViewer with shared GitDiffViewer - update FileChangeItem and CommitHistoryItem imports accordingly - Remove superseded root-level legacy components: - delete src/components/LoginModal.jsx - delete src/components/Onboarding.jsx - delete src/components/TaskIndicator.jsx - delete old src/components/git-panel/view/shared/DiffViewer.tsx - Result: - clearer feature boundaries (auth vs onboarding vs provider-auth vs sidebar) - easier navigation and ownership by domain - preserved runtime behavior with improved readability and modularity * refactor(MainContent): remove TaskMasterPanel import and relocate to task-master component * fix: update import paths for Input component in FileTree and FileTreeNode * refactor(FileTree): make file tree context menu a typescript component and move it inside the file tree view * refactor(FileTree): remove unused ScrollArea import * feat: setup eslint with typescript and react rules, add unused imports plugin * fix: remove unused imports, functions, and types after discovering using `npm run lint` * feat: setup eslint-plugin-react, react-refresh, import-x, and tailwindcss plugins with recommended rules and configurations * chore: reformat files after running `npm run lint:fix` * chore: add omments about eslint config plugin uses * feat: add husky and lint-staged for pre-commit linting * feat: setup commitlint with conventional config * fix: i18n translations --------- Co-authored-by: Haileyesus <something@gmail.com> Co-authored-by: viper151 <simosmik@gmail.com>	2026-03-05 23:47:58 +01:00