Organizing conversations code
SkillFiles & storageFile layout for the conversations product. Use when adding, moving, renaming, or reviewing files under products/conversations/ — especially frontend components, scenes, helpers, and tests. Conversations React components live in their own folder under products/conversations/frontend/components/, never as loose files in components/ or at the frontend root. Expand this skill as more conversations layout rules land.
Available today. Use it from your connected AI after setup.
No other account needed.
Connect ahel once, and every AI you use reads what you have installed.
Then ask your AI: use the Organizing conversations code skill
What this skill tells your AI
The instructions your AI receives, as published by posthog/posthog-foss in products/conversations/skills/organizing-conversations-code/SKILL.md and read by ahel’s review.
Conversations-specific layout. Repo-wide UI rules still apply — read writing-ui-components for one-component-per-file, no barrels, and import sweeps. This skill owns where in conversations a file goes.
Use this skill when
- Creating, moving, or renaming a file under
products/conversations/ - Adding a React component, helper, or test to conversations frontend
- Reviewing a conversations diff that adds files
Components
Every React component lives in its own folder under products/conversations/frontend/components/.
The file is named after the export.
products/conversations/frontend/components/<Name>/<Name>.tsx
products/conversations/frontend/components/<Name>/<Name>.test.tsx # colocated
Import the file, not the folder:
import { SlaDisplay } from '../../components/SlaDisplay/SlaDisplay'
import { SlaDisplay } from 'products/conversations/frontend/components/SlaDisplay/SlaDisplay'
Do not:
- Drop a component as a loose file in
frontend/components/ - Put a component at
products/conversations/frontend/(the product frontend root) - Add an
index.tsbarrel so callers can import the folder
A helper that returns props or data — not markup — is not a component. Keep it next to the
feature or at products/conversations/frontend/<name>.ts(x) (see clearFilterButtonProps.tsx).
When you move a component, git mv, point every consumer at the new path, and delete the old
one. No re-export shim.
Signals
- GitHub stars
- 715
- Forks
- 118
- Last commit
- Sep 2026
ahel recommends instead
Advanced
- Catalog kind
- skill
- Gateway key
organizing-conversations-code-posthog- Source
- github.com/posthog/posthog-foss