Zammad Agent Onboarding
This skill provides AI agents with a fast, reliable mental model of the Zammad repository to ship changes with minimal trial-and-error.
What This Skill Does
Gives you comprehensive context about Zammad's architecture, tech stack, project structure, and development standards. Zammad is an open-source Ruby on Rails helpdesk/customer support platform with Vue 3 frontends.
Instructions
1. Understand the Architecture
Zammad consists of three frontend applications:
**desktop-app (legacy)**: Located in `app/assets/`, uses CoffeeScript, Spine.js MVC framework, Sprockets, and REST API**desktop-view (modern)**: Located in `app/frontend/apps/desktop/`, uses Vue 3 + GraphQL**mobile (modern)**: Located in `app/frontend/apps/mobile/`, uses Vue 3 + GraphQL**Backend**: Ruby on Rails with PostgreSQL, Redis, ActionCable, Delayed Job, and GraphQL
2. Reference Authoritative Documentation
Before making changes, always consult:
`doc/developer_manual/` (index: `doc/developer_manual/index.md`) — setup, testing, standardsConfig files: `package.json`, `Gemfile`, `config/database.yml`, `Procfile.dev`, `vite.config.mjs`, `tsconfig.base.json`, `eslint.config.ts`, `.oxlintrc.json`3. Navigate the Project Structure
**Frontend:**
`app/assets/` — legacy desktop-app (CoffeeScript/Sprockets)`app/frontend/apps/desktop/` — modern desktop Vue app`app/frontend/apps/mobile/` — mobile Vue app`app/frontend/shared/` — shared components, utils, stores, GraphQL, i18n`app/frontend/tests/` — Vitest setup and helpers**Backend (Rails standard):**
`app/controllers/`, `app/models/`, `app/views/`, `app/jobs/`, `app/mailers/`, `app/helpers/`, `app/channels/`, `app/policies/``app/services/` — business logic modules`app/graphql/` — GraphQL API definitions and resolvers**lib/ directory:**
Core extensions, helpers, integrations (GitHub, GitLab, Microsoft Graph, Facebook, Telegram, WhatsApp)Business logic modules: `calendar_subscriptions/`, `escalation/`, `knowledge_base/`, `password_policy/`, `secure_mailing/`, `stats/`Background services: `background_services/`, `sequencer/`, `transaction_dispatcher.rb`Helpers: `email_helper.rb`, `migration_helper.rb`, `sql_helper.rb`, `image_helper.rb`, etc.**Other:**
`bin/`, `config/`, `db/`, `doc/`, `script/`, `spec/`, `test/`4. Tech Stack Reference
**Legacy desktop-app:**
CoffeeScript, Spine.js, Sprockets, REST APIConfig: `coffeelint.json`Tests: QUnit in `test/`**Modern Vue apps (desktop-view, mobile):**
Vue 3, TypeScript, Pinia (state), Apollo Client (GraphQL), Tailwind CSS, VueUseTesting: Vitest, Testing Library, CypressBuild: pnpm, vite-plugin-ruby, vite-plugin-pwaLinting: ESLint, Stylelint, PrettierConfig: `package.json`, `vite.config.mjs`, `tsconfig.base.json`, `eslint.config.ts`**Backend:**
Ruby on Rails, PostgreSQL, Redis, ActionCable, Delayed Job, GraphQLConfig: `Gemfile`, `config/`5. Follow Coding Standards
**Vue apps:**
Use path aliases from `tsconfig.base.json`DO NOT cross-import between desktop/mobile apps (ESLint enforces boundaries)Use Vitest + Testing Library for unit/component testsUse Tailwind CSS utilities for stylingWrap user-facing strings for i18n (see `eslint.config.ts` for rules)Lint with ESLint, Stylelint, and Prettier**Legacy desktop-app:**
Located in `app/assets/javascripts/` and `app/assets/stylesheets/`Uses Spine.js for MVC structureUses REST API endpoints (check Rails controllers for routes)Lint with `coffeelint.json`Test with QUnit in `test/`**Prefer new work in desktop-view/mobile; keep legacy changes minimal****General:**
All runtime/environment constraints are in config filesConsult Developer Manual for setup, troubleshooting, testing standardsKeep PRs focusedInclude tests for new code6. When in Doubt
1. Check the Developer Manual (`doc/developer_manual/`)
2. Reference config files rather than guessing
3. For tool versions, scripts, environment variables: see `package.json`, `Gemfile`, and other configs
4. For path aliases: see `tsconfig.base.json`
5. For copyright/i18n rules: see `eslint.config.ts`
Constraints
Prefer working in modern Vue apps (desktop-view/mobile) over legacy desktop-appDo not cross-import between desktop and mobile appsAlways include tests for new codeFollow linting and formatting rules enforced by ESLint, Stylelint, PrettierConsult Developer Manual for authoritative setup and standardsExample Usage
When asked to add a feature:
1. Determine if it's for legacy desktop-app, desktop-view, or mobile
2. Check relevant config files and Developer Manual
3. Locate appropriate directory structure (controllers, models, components, etc.)
4. Implement following tech stack conventions (Vue 3 + TypeScript + GraphQL for modern apps)
5. Add tests using appropriate framework (Vitest for Vue, RSpec/QUnit for backend/legacy)
6. Lint and format code