project-overview_skill

Overview

This skill provides a complete project architecture and structure guide for the LobeHub codebase. It helps you quickly understand repo layout, key packages, and where to find UI, server, and database code. Use it to orient new contributors, plan changes, or trace feature implementations across layers.

How this skill works

The skill inspects the monorepo layout and maps responsibilities to folders and packages. It highlights core technologies (Next.js, TypeScript, TRPC, Neon/Postgres, Drizzle) and shows data flow from React UI through zustand stores to TRPC lambdas and the database. It also points to location-specific artifacts like DB schemas, server routers, builtin tools, and cloud-only logic.

When to use it

• Exploring the codebase for the first time or onboarding a new teammate
• Locating where UI components, stores, or services live
• Tracing a request from browser to database (data flow)
• Planning architecture changes or adding a new feature
• Determining which packages are cloud-only versus client-capable

Best practices

• Follow the layer map: UI → store → client service → trpc → server services → DB
• Keep client-only logic in src/app and packages that are not cloud-only
• Place database schemas, models, and repositories in packages/database for shared access
• Use packages/builtin-tool-* for tool implementations and src/tools for app-level wiring
• Respect the monorepo namespace (@lobechat/) and reuse shared utils in packages/utils

Example use cases

• Find where to add a new UI widget: check src/components, src/features, and src/layout providers
• Add a new API endpoint: implement a TRPC router under src/server/routers and a server service in src/server/services
• Inspect database models: open packages/database/src/models and schemas for table definitions
• Build an agent runtime feature: modify packages/agent-runtime or packages/model-runtime providers
• Enable analytics or auth integrations: extend src/libs (analytics, oidc) or better-auth in libs