compose-state-authoring

Reviews Jetpack Compose code for correct local state authoring and @ReadOnlyComposable usage.

Updated Jul 1, 2026
One-click install
npx skills add https://github.com/w0lzard/Wolzard-s-Marketplace --skill compose-state-authoring-w0lzard
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: compose-state-authoring
Source: https://github.com/w0lzard/Wolzard-s-Marketplace/tree/main/plugins/personal-skills/skills/compose-state-authoring
Command: npx skills add https://github.com/w0lzard/Wolzard-s-Marketplace --skill compose-state-authoring-w0lzard

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Jetpack Compose code often contains subtle state bugs: bare local vars that silently reset on recomposition, list mutations that never trigger UI updates, and misused @ReadOnlyComposable annotations that break the composition contract. This Skill provides the rules and diagnostics to write and review local Compose state correctly. ## Core Features & Use Cases - State-backed local variables: Detects bare var declarations inside @Composable functions and content lambdas, and rewrites them as remember { mutableStateOf(...) } so values survive and trigger recomposition. - Observable collections: Explains why mutableStateOf(list).add(x) never recomposes and when to use mutableStateListOf / mutableStateMapOf or value replacement instead. - Back-writing prevention: Flags snapshot state mutations during composition (e.g., clear() + putAll() in the composable body) and replaces them with remember(keys) { derivedSnapshot }. - @ReadOnlyComposable contract: Decides when to add or remove the annotation based on whether the body only reads composition locals versus calling layout, effects, or remember. - Use Case: While reviewing a pull request, you spot var count = 0 inside a Column { } content lambda and a @ReadOnlyComposable function that calls Box {}. This Skill gives you the exact diagnosis and fix for both. ## Quick Start Review this @Composable function for state authoring mistakes and fix any bare local vars or incorrect @ReadOnlyComposable annotations.

Frequently Asked Questions about compose-state-authoring

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix a var that resets on recomposition in Jetpack Compose?

Replace the bare local var with `var x by remember { mutableStateOf(initial) }`. The remember call survives recomposition, and mutableStateOf triggers recomposition when the value changes. This applies inside composable content lambdas like Column { } too.

Why does adding to a remembered list not update my Compose UI?

A `remember { mutableStateOf(list) }` does not observe internal mutations, so calling `.add()` bypasses the State setter and never triggers recomposition. Use `mutableStateListOf` or `mutableStateMapOf`, or replace the whole value with `state = state + x`.

When should I use @ReadOnlyComposable in Compose?

Add @ReadOnlyComposable when the function body only reads composition locals like LocalDensity.current or calls other read-only composables, with no layout calls, remember, or side effects. Never add it if the body calls Box, Text, LaunchedEffect, or any non-read-only composable.

Can I add @ReadOnlyComposable to an override function?

No. The annotation is part of the base declaration's contract, so an override cannot add or remove it independently. If the base function is not @ReadOnlyComposable, refactor the base declaration or accept the group-creation cost in the override.

What is back-writing state during composition in Compose?

Back-writing means mutating observable snapshot state, such as calling clear() and putAll() on a mutableStateMapOf, directly in the composable body. This invalidates the current composition pass and schedules another. Instead compute an immutable derived snapshot with remember(keys).