compose-app-patterns-plus

Built on affaan-m/ECC by @affaan-m (248,528 stars, MIT). All credit for the original idea to them. This fork improves and repackages it; upstream license preserved in UPSTREAM_LICENSE.

A Claude Code skill that helps you build clear, safe, and fast Compose Multiplatform and Jetpack Compose apps.

💡 Why

Compose code can get hard to manage as an app grows.

State may live in too many places. Old search jobs may replace new results. Android-only APIs may slip into shared code. UI parts may become hard to test or preview.

This skill is for developers who build Android, iOS, desktop, or web apps with Compose. It gives Claude Code a small set of patterns for state, events, navigation, themes, speed, and platform UI.

It plugs into your current Claude Code flow. The skill is one file and has no extra packages.

⚡ Install

Replace YOUR_GITHUB_NAME with the repo owner, then run this one command:

curl --create-dirs -fsSL https://raw.githubusercontent.com/YOUR_GITHUB_NAME/compose-app-patterns-plus/main/skill/SKILL.md -o ~/.claude/skills/compose-multiplatform-patterns/SKILL.md

Claude Code will load the skill when your task fits its use.

🛠️ Usage

Ask Claude Code for a real app change:

Build a Compose Multiplatform item list screen. Use StateFlow for state.
Add search, loading, empty, and error views. Keep the shared UI free of
Android-only life cycle calls.

Expected output:

• One state object for the screen
• A read-only StateFlow
• Old search jobs cancelled before new work starts
• Coroutine cancellation kept intact
• A stateless content composable with a Modifier
• One event sink for screen actions
• Clear loading, error, empty, and list views
• Platform life cycle code placed in the right source set

The skill also reminds Claude Code to check the project’s library versions before it uses newer Compose or Navigation APIs.

🔧 What we changed vs upstream

• Translated the skill from Japanese into clear English and added explicit attribution to ECC.
• Expanded the trigger guidance with platform-specific UI and a warning to verify project library versions and API availability.
• Strengthened search state handling by cancelling stale jobs, preserving coroutine cancellation, clearing errors, and recommending debouncing.
• Clarified that collectAsStateWithLifecycle() is Android-specific and that shared KMP UI should use the project’s chosen lifecycle approach.
• Updated the UI example to use a stateless, modifier-aware content composable with a single event sink and explicit loading/error rendering.

📄 License

This repo uses the MIT License. The upstream MIT license and credit are preserved in UPSTREAM_LICENSE.