## Summary - Add combined `Enable and Load` and `Disable and Unload` controls to Plugin Host Debug. - Keep enablement persistence and runtime lifecycle changes in one sequential store action. - Add tests for ordering, busy state, and failure handling. - Localize the new controls and fallback error messages in English and Simplified Chinese. ## Verification - `pnpm exec vitest run --config packages/stage-ui/vitest.config.ts --project node src/stores/devtools/plugin-host-debug.test.ts` - `pnpm -F @proj-airi/i18n test` - `pnpm -F @proj-airi/i18n build` - `pnpm run build:packages` - `pnpm typecheck` - `pnpm lint` - Manually tested the bundled `devtools-sample-plugin` in the Electron Plugin Host Debug page. Both combined actions updated the persisted registry and runtime session state without restarting the app. ## Visual changes | Before | After | |---|---| |  |  | | Plugin Host Debug | Plugin Host Debug with combined lifecycle controls |
Stage UI
Shared core for stage
Button analytics
Register the shared plugin once in each Vue application:
import { trackButtonPlugin } from '@proj-airi/stage-ui/directives/track-button'
createApp(App)
.use(trackButtonPlugin)
.mount('#app')
Buttons that represent a product-analysis click intent can then declare a typed event without wrapping their business handler:
<Button
v-track-button="{ name: 'update_check_clicked', channel: selectedChannel }"
@click="checkForUpdates()"
/>
Keep async outcomes, confirmed state changes, impressions, and lifecycle events in their owning business flows instead of attaching them to the initial click.
Histoire (UI storyboard)
pnpm -F @proj-airi/stage-ui run story:dev
Project structure
- If a story is bound to a specific component, it can be placed beside the component in the
srcfolder. e.g.,MyComponent.story.vue - If a story is not bound to a specific component, then it should be placed in the
storiesfolder. e.g.,MyStory.story.vue