feat: migrate BadgeIcon to ADR-0004 shared types (DSYS-479)#1010
Merged
georgewrmarshall merged 4 commits intomainfrom Apr 28, 2026
Merged
feat: migrate BadgeIcon to ADR-0004 shared types (DSYS-479)#1010georgewrmarshall merged 4 commits intomainfrom
georgewrmarshall merged 4 commits intomainfrom
Conversation
Contributor
📖 Storybook Preview |
7 tasks
georgewrmarshall
added a commit
that referenced
this pull request
Apr 7, 2026
…ignment (#994) ## **Description** ### Why Cursor Automations are configured in the Cursor product UI and are **not** version-controlled in git. We need an in-repo **canonical spec** for the DSYS-468 / ADR-0003–0004 internal migration workflow (Jira pickup, which rules to follow, verification, PR expectations) so it can be reviewed in PRs and linked or copy-pasted into **Private** or **Team Visible** automations. ### What changed - **Added** `.cursor/automations/enum-shared-type-migration.md` — JQL (interactive vs scheduled unassigned backlog), Jira pickup steps, Cursor Cloud Automation notes (billing/identity, tools), implementation pointers to `CLAUDE.md` and Layer 2 rules (`component-enum-union-migration`, etc.), verification (`yarn build`, `yarn test`, `yarn lint`), and a **paste-ready** cloud prompt. - **Updated** `docs/ai-agents.md` — **Cursor Cloud Automations** subsection aligned with repo agent principles (*reference over duplication*, checklists, context efficiency, verification) and explicit note that **`.cursor/automations/`** is the VCS source of truth because the Automations UI has no native version control. - **Removed** unrelated migration tracking artifacts from this branch: `.cursor/rules/component-migration-tracking.md`, `.cursor/rules/enum-shared-type-migration.mdc`, and docs `component-migration-project.md`, `extension-migration-tracker.md`, `jira-ticket-creation.md`, `mobile-migration-tracker.md`. Automation is invoked via `@.cursor/automations/enum-shared-type-migration.md` only (no companion `.mdc` rule). - **Chore** — Prettier on touched markdown where required by hooks. ### Linking specs from Cursor Automations (for reviewers) There is **no official Cursor documentation** that guarantees a cloud agent will **fetch and follow** an arbitrary GitHub blob URL. **Recommended:** configure the automation with a **repository + branch** that contains this file, and instruct the agent to read **`.cursor/automations/enum-shared-type-migration.md` in the workspace**. A **GitHub link** (especially `raw.githubusercontent.com` or a **pinned commit**) is still useful for humans, pinning a frozen spec, or external tooling—but treat it as **supplementary** to the checked-out file. ## **Related issues** Fixes: (none — contributor workflow / tooling only) ## **Manual testing steps** 1. On this branch, open `.cursor/automations/enum-shared-type-migration.md` and confirm structure, JQL blocks, and links render as expected. 2. In Cursor Chat, `@`-mention `.cursor/automations/enum-shared-type-migration.md` and confirm the agent is directed to `docs/ai-agents.md` and the listed `@.cursor/rules/*.md` files for implementation (not `component-migration.md` for this epic). 3. Confirm no remaining references to deleted paths (e.g. `component-migration-tracking`, removed tracker docs) via repo search. 4. (Optional) Create or edit a **Private** test automation: paste the **cloud prompt** snippet from the automation doc and run against a branch that includes this file; confirm the agent can see `.cursor/automations/enum-shared-type-migration.md` on disk. ## **Example PRs** PRs that have been successfully created with this automation - #996 - #1009 - #1010 - #1015 ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable (N/A — docs only) - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable (N/A) - [ ] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk: documentation-only changes that add guidance for Cursor Automations and do not affect runtime code paths. > > **Overview** > Adds a version-controlled Cursor Automation spec at `.cursor/automations/enum-shared-type-migration.md` that defines the DSYS-468 Jira pickup workflow (JQL for interactive vs scheduled runs), required tools/identity notes, which `.cursor/rules/` to follow for the migration, and a paste-ready automation prompt (plus post-merge Jira-closing guidance). > > Updates `docs/ai-agents.md` to explicitly document how Cursor Cloud Automations should follow the repo’s agent principles (*reference over duplication*, checklists, verification) and to treat `.cursor/automations/` as the canonical, reviewable source of truth for automation prompts. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 2594fa9. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: cursor[bot] <206951365+cursor[bot]@users.noreply.github.com>
georgewrmarshall
force-pushed
the
cursor/enum-shared-type-migration-5ff7
branch
from
628c733 to
c060291
Compare
| } from './types/AvatarToken'; | ||
|
|
||
| // BadgeIcon types (ADR-0004) | ||
| export { type BadgeIconPropsShared } from './types/BadgeIcon'; |
Contributor
There was a problem hiding this comment.
Why is only a type exported here with no const objects?
BadgeIcon has no variants, sizes, or other enum-like props — the only shared prop is iconName. Unlike BadgeStatus or BannerAlert, there are no ADR-0003 const objects to centralise. A type-only export is correct for this component.
Contributor
📖 Storybook Preview |
- Create BadgeIconPropsShared in packages/design-system-shared - Export from shared package index - Update React package BadgeIcon.types.ts to extend shared props - Update React Native package BadgeIcon.types.ts to extend shared props Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com>
georgewrmarshall
force-pushed
the
cursor/enum-shared-type-migration-5ff7
branch
from
c060291 to
d5890a9
Compare
Contributor
📖 Storybook Preview |
| /** | ||
| * Optional prop to pass additional properties to the icon | ||
| */ | ||
| iconProps?: Omit<IconProps, 'name'>; |
Contributor
There was a problem hiding this comment.
iconProps stays platform-local on purpose even after extracting iconName. The rendered Icon still has platform-specific props in each package, so this keeps only the shared API centralized and avoids pulling React-specific Icon props into the shared layer.
| * Required prop to specify an icon to show. | ||
| * Uses shared IconName because the shared package owns icon names. | ||
| */ | ||
| iconName: IconName; |
Contributor
There was a problem hiding this comment.
iconName is the only prop moved into shared because it is part of the design-system API surface rather than platform behavior. IconName now lives in design-system-shared after #1042, so BadgeIcon should consume that shared source of truth directly.
| } from './types/AvatarToken'; | ||
|
|
||
| // BadgeIcon types (ADR-0004) | ||
| export { type BadgeIconPropsShared } from './types/BadgeIcon'; |
Contributor
There was a problem hiding this comment.
This root export is what allows both platform packages to extend BadgeIconPropsShared from the shared package entrypoint instead of reaching into internal paths. It matches the ADR-0004 public export pattern already used by the other migrated shared component types.
Contributor
📖 Storybook Preview |
georgewrmarshall
added a commit
that referenced
this pull request
Apr 27, 2026
…ignment (#994) ## **Description** ### Why Cursor Automations are configured in the Cursor product UI and are **not** version-controlled in git. We need an in-repo **canonical spec** for the DSYS-468 / ADR-0003–0004 internal migration workflow (Jira pickup, which rules to follow, verification, PR expectations) so it can be reviewed in PRs and linked or copy-pasted into **Private** or **Team Visible** automations. ### What changed - **Added** `.cursor/automations/enum-shared-type-migration.md` — JQL (interactive vs scheduled unassigned backlog), Jira pickup steps, Cursor Cloud Automation notes (billing/identity, tools), implementation pointers to `CLAUDE.md` and Layer 2 rules (`component-enum-union-migration`, etc.), verification (`yarn build`, `yarn test`, `yarn lint`), and a **paste-ready** cloud prompt. - **Updated** `docs/ai-agents.md` — **Cursor Cloud Automations** subsection aligned with repo agent principles (*reference over duplication*, checklists, context efficiency, verification) and explicit note that **`.cursor/automations/`** is the VCS source of truth because the Automations UI has no native version control. - **Removed** unrelated migration tracking artifacts from this branch: `.cursor/rules/component-migration-tracking.md`, `.cursor/rules/enum-shared-type-migration.mdc`, and docs `component-migration-project.md`, `extension-migration-tracker.md`, `jira-ticket-creation.md`, `mobile-migration-tracker.md`. Automation is invoked via `@.cursor/automations/enum-shared-type-migration.md` only (no companion `.mdc` rule). - **Chore** — Prettier on touched markdown where required by hooks. ### Linking specs from Cursor Automations (for reviewers) There is **no official Cursor documentation** that guarantees a cloud agent will **fetch and follow** an arbitrary GitHub blob URL. **Recommended:** configure the automation with a **repository + branch** that contains this file, and instruct the agent to read **`.cursor/automations/enum-shared-type-migration.md` in the workspace**. A **GitHub link** (especially `raw.githubusercontent.com` or a **pinned commit**) is still useful for humans, pinning a frozen spec, or external tooling—but treat it as **supplementary** to the checked-out file. ## **Related issues** Fixes: (none — contributor workflow / tooling only) ## **Manual testing steps** 1. On this branch, open `.cursor/automations/enum-shared-type-migration.md` and confirm structure, JQL blocks, and links render as expected. 2. In Cursor Chat, `@`-mention `.cursor/automations/enum-shared-type-migration.md` and confirm the agent is directed to `docs/ai-agents.md` and the listed `@.cursor/rules/*.md` files for implementation (not `component-migration.md` for this epic). 3. Confirm no remaining references to deleted paths (e.g. `component-migration-tracking`, removed tracker docs) via repo search. 4. (Optional) Create or edit a **Private** test automation: paste the **cloud prompt** snippet from the automation doc and run against a branch that includes this file; confirm the agent can see `.cursor/automations/enum-shared-type-migration.md` on disk. ## **Example PRs** PRs that have been successfully created with this automation - #996 - #1009 - #1010 - #1015 ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable (N/A — docs only) - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable (N/A) - [ ] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk: documentation-only changes that add guidance for Cursor Automations and do not affect runtime code paths. > > **Overview** > Adds a version-controlled Cursor Automation spec at `.cursor/automations/enum-shared-type-migration.md` that defines the DSYS-468 Jira pickup workflow (JQL for interactive vs scheduled runs), required tools/identity notes, which `.cursor/rules/` to follow for the migration, and a paste-ready automation prompt (plus post-merge Jira-closing guidance). > > Updates `docs/ai-agents.md` to explicitly document how Cursor Cloud Automations should follow the repo’s agent principles (*reference over duplication*, checklists, verification) and to treat `.cursor/automations/` as the canonical, reviewable source of truth for automation prompts. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 2594fa9. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: cursor[bot] <206951365+cursor[bot]@users.noreply.github.com>
brianacnguyen
approved these changes
Apr 27, 2026
Contributor
📖 Storybook Preview |
georgewrmarshall
added a commit
that referenced
this pull request
Apr 28, 2026
## Release 36.0.0 This release makes the generated changelogs consumer-facing, adds the Telegram icon across the published packages, and keeps the type-level breaking change notes focused on the enum-to-const-object and string-union migration for `AvatarIcon`. ### 📦 Package Versions - `@metamask/design-system-shared`: **0.14.0** - `@metamask/design-system-react`: **0.19.0** - `@metamask/design-system-react-native`: **0.21.0** ### 🔄 Shared Package Updates (0.14.0) #### Type and icon updates ([#996](#996), [#1010](#1010), [#1122](#1122)) **What Changed:** - Added shared `AvatarIcon` contracts, including `AvatarIconPropsShared`, `AvatarIconSize`, and `AvatarIconSeverity` - Added shared `BadgeIconPropsShared` - Added `Telegram` to the shared icon exports ### 🌐 React Web Updates (0.19.0) #### Added - Added `Telegram` to the `IconName` set for React consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react` as before ### 📱 React Native Updates (0.21.0) #### Added - Added `Telegram` to the `IconName` set for React Native consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react-native` as before ###⚠️ Breaking Changes #### AvatarIcon type migration (Both Platforms) **What Changed:** - `AvatarIcon` now follows the const-object + string-union pattern already used by similar type migrations in this repo - Public imports and runtime usage remain unchanged **Impact:** - This is a type-level breaking change, but normal component usage should continue to work unchanged - Consumers should only expect updates if they relied on enum-specific typing assumptions ### ✅ Checklist - [x] Changelogs updated with human-readable descriptions - [x] Changelog validation passed (`yarn changelog:validate`) - [x] Version bumps follow semantic versioning - [x] design-system-shared: minor (`0.13.0` → `0.14.0`) - shared AvatarIcon and BadgeIcon type additions plus Telegram icon support - [x] design-system-react: minor (`0.18.0` → `0.19.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] design-system-react-native: minor (`0.20.0` → `0.21.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] Breaking changes documented proportionally to severity - [x] PR references included in changelog entries ## **Pre-merge author checklist** - [ ] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've reviewed the [Release Workflow](./.cursor/rules/release-workflow.md) cursor rule - [ ] All tests pass (`yarn build && yarn test && yarn lint`) - [x] Changelog validation passes (`yarn changelog:validate`) ## **Pre-merge reviewer checklist** - [ ] I've reviewed the [Reviewing Release PRs](./docs/reviewing-release-prs.md) guide - [ ] Package versions follow semantic versioning - [ ] Changelog entries are consumer-facing (not commit message regurgitation) - [ ] Breaking changes are documented proportionally to severity - [ ] All unreleased changes are accounted for in changelogs <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk release bookkeeping: only version bumps and changelog updates; no runtime code changes are included in this diff. > > **Overview** > Bumps the monorepo version to `36.0.0` and publishes new package versions for `@metamask/design-system-shared` (`0.14.0`), `@metamask/design-system-react` (`0.19.0`), and `@metamask/design-system-react-native` (`0.21.0`). > > Updates package changelogs to document the newly released consumer-facing changes, including adding the `Telegram` icon and *type-level breaking* alignment of `AvatarIcon` (and shared contracts in `design-system-shared`) to shared const-object + string-union exports. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit fa4ad9f. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY -->
georgewrmarshall
added a commit
that referenced
this pull request
Apr 28, 2026
## **Description** This PR migrates the `BadgeIcon` component to follow [ADR-0004 (Centralized Types Architecture)](https://github.com/MetaMask/decisions/blob/main/decisions/design-system/0004-centralized-types-architecture.md) by creating a shared `BadgeIconPropsShared` type in `@metamask/design-system-shared` and updating both React and React Native platform packages to extend it. **What changed:** - Created `packages/design-system-shared/src/types/BadgeIcon/BadgeIcon.types.ts` with `BadgeIconPropsShared` (platform-independent `iconName: string` prop) - Added `packages/design-system-shared/src/types/BadgeIcon/index.ts` and exported from shared package index - Updated `packages/design-system-react/src/components/BadgeIcon/BadgeIcon.types.ts` to import and extend `BadgeIconPropsShared`, narrowing `iconName` to the platform-specific `IconName` enum - Updated `packages/design-system-react-native/src/components/BadgeIcon/BadgeIcon.types.ts` to import and extend `BadgeIconPropsShared`, narrowing `iconName` to the platform-specific `IconName` enum This is a non-breaking internal refactor — the component APIs remain identical to consumers. ## **Related issues** Fixes: [DSYS-479](https://consensyssoftware.atlassian.net/browse/DSYS-479) ## **Manual testing steps** 1. Run `yarn build` — should complete without errors 2. Run `yarn test` — all tests should pass with 100% coverage 3. Run `yarn lint` — should pass with no issues ## **Screenshots/Recordings** N/A — internal type refactor with no visual changes. ### **Before** No visual changes ### **After** No visual changes https://github.com/user-attachments/assets/d41c097f-3d43-4cf2-b777-fbe32dade5cc ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [ ] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. <div><a href="https://cursor.com/agents/bc-e4fc9245-9ba4-4390-bd59-bbbf5547c05a"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/open-in-web-dark.png"><source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/open-in-web-light.png"><img alt="Open in Web" width="114" height="28" src="https://cursor.com/assets/images/open-in-web-dark.png"></picture></a> <a href="https://cursor.com/automations/864f6729-e11f-445a-9607-65e9539d53c1"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/view-automation-dark.png"><source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/view-automation-light.png"><img alt="View Automation" width="141" height="28" src="https://cursor.com/assets/images/view-automation-dark.png"></picture></a> </div> <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk type-only refactor that centralizes `BadgeIcon` prop typing; behavior should be unchanged aside from potential TypeScript build/export issues if downstream imports relied on the old `IconName`/`IconSize` sources. > > **Overview** > Migrates `BadgeIcon` to ADR-0004 centralized typing by adding `BadgeIconPropsShared` to `@metamask/design-system-shared` and exporting it from the shared index. > > Updates both React and React Native `BadgeIcon` props to extend the shared type, and switches stories/tests/Figma Code Connect files (and component imports for `IconColor`/`IconSize`/`IconName`) to reference `@metamask/design-system-shared` instead of platform `Icon` modules. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit 2c38fba. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com> Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
![https://cursor.com/assets/images/open-in-web-dark.png"><source](https://cursor.com/assets/images/open-in-web-dark.png"><source){kind=link}
![https://cursor.com/assets/images/open-in-web-light.png"><img](https://cursor.com/assets/images/open-in-web-light.png"><img){kind=link}
![https://cursor.com/assets/images/open-in-web-dark.png"></picture></a> <a](https://cursor.com/assets/images/open-in-web-dark.png"></picture></a> <a){kind=link}
![https://cursor.com/assets/images/view-automation-dark.png"><source](https://cursor.com/assets/images/view-automation-dark.png"><source){kind=link}
![https://cursor.com/assets/images/view-automation-light.png"><img](https://cursor.com/assets/images/view-automation-light.png"><img){kind=link}
![https://cursor.com/assets/images/view-automation-dark.png"></picture></a> </div](https://cursor.com/assets/images/view-automation-dark.png"></picture></a> </div){kind=link}
georgewrmarshall
added a commit
that referenced
this pull request
Apr 28, 2026
## Release 36.0.0 This release makes the generated changelogs consumer-facing, adds the Telegram icon across the published packages, and keeps the type-level breaking change notes focused on the enum-to-const-object and string-union migration for `AvatarIcon`. ### 📦 Package Versions - `@metamask/design-system-shared`: **0.14.0** - `@metamask/design-system-react`: **0.19.0** - `@metamask/design-system-react-native`: **0.21.0** ### 🔄 Shared Package Updates (0.14.0) #### Type and icon updates ([#996](#996), [#1010](#1010), [#1122](#1122)) **What Changed:** - Added shared `AvatarIcon` contracts, including `AvatarIconPropsShared`, `AvatarIconSize`, and `AvatarIconSeverity` - Added shared `BadgeIconPropsShared` - Added `Telegram` to the shared icon exports ### 🌐 React Web Updates (0.19.0) #### Added - Added `Telegram` to the `IconName` set for React consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react` as before ### 📱 React Native Updates (0.21.0) #### Added - Added `Telegram` to the `IconName` set for React Native consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react-native` as before ###⚠️ Breaking Changes #### AvatarIcon type migration (Both Platforms) **What Changed:** - `AvatarIcon` now follows the const-object + string-union pattern already used by similar type migrations in this repo - Public imports and runtime usage remain unchanged **Impact:** - This is a type-level breaking change, but normal component usage should continue to work unchanged - Consumers should only expect updates if they relied on enum-specific typing assumptions ### ✅ Checklist - [x] Changelogs updated with human-readable descriptions - [x] Changelog validation passed (`yarn changelog:validate`) - [x] Version bumps follow semantic versioning - [x] design-system-shared: minor (`0.13.0` → `0.14.0`) - shared AvatarIcon and BadgeIcon type additions plus Telegram icon support - [x] design-system-react: minor (`0.18.0` → `0.19.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] design-system-react-native: minor (`0.20.0` → `0.21.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] Breaking changes documented proportionally to severity - [x] PR references included in changelog entries ## **Pre-merge author checklist** - [ ] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've reviewed the [Release Workflow](./.cursor/rules/release-workflow.md) cursor rule - [ ] All tests pass (`yarn build && yarn test && yarn lint`) - [x] Changelog validation passes (`yarn changelog:validate`) ## **Pre-merge reviewer checklist** - [ ] I've reviewed the [Reviewing Release PRs](./docs/reviewing-release-prs.md) guide - [ ] Package versions follow semantic versioning - [ ] Changelog entries are consumer-facing (not commit message regurgitation) - [ ] Breaking changes are documented proportionally to severity - [ ] All unreleased changes are accounted for in changelogs <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk release bookkeeping: only version bumps and changelog updates; no runtime code changes are included in this diff. > > **Overview** > Bumps the monorepo version to `36.0.0` and publishes new package versions for `@metamask/design-system-shared` (`0.14.0`), `@metamask/design-system-react` (`0.19.0`), and `@metamask/design-system-react-native` (`0.21.0`). > > Updates package changelogs to document the newly released consumer-facing changes, including adding the `Telegram` icon and *type-level breaking* alignment of `AvatarIcon` (and shared contracts in `design-system-shared`) to shared const-object + string-union exports. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit fa4ad9f. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY -->
cursor Bot
added a commit
that referenced
this pull request
Apr 28, 2026
…ignment (#994) ## **Description** ### Why Cursor Automations are configured in the Cursor product UI and are **not** version-controlled in git. We need an in-repo **canonical spec** for the DSYS-468 / ADR-0003–0004 internal migration workflow (Jira pickup, which rules to follow, verification, PR expectations) so it can be reviewed in PRs and linked or copy-pasted into **Private** or **Team Visible** automations. ### What changed - **Added** `.cursor/automations/enum-shared-type-migration.md` — JQL (interactive vs scheduled unassigned backlog), Jira pickup steps, Cursor Cloud Automation notes (billing/identity, tools), implementation pointers to `CLAUDE.md` and Layer 2 rules (`component-enum-union-migration`, etc.), verification (`yarn build`, `yarn test`, `yarn lint`), and a **paste-ready** cloud prompt. - **Updated** `docs/ai-agents.md` — **Cursor Cloud Automations** subsection aligned with repo agent principles (*reference over duplication*, checklists, context efficiency, verification) and explicit note that **`.cursor/automations/`** is the VCS source of truth because the Automations UI has no native version control. - **Removed** unrelated migration tracking artifacts from this branch: `.cursor/rules/component-migration-tracking.md`, `.cursor/rules/enum-shared-type-migration.mdc`, and docs `component-migration-project.md`, `extension-migration-tracker.md`, `jira-ticket-creation.md`, `mobile-migration-tracker.md`. Automation is invoked via `@.cursor/automations/enum-shared-type-migration.md` only (no companion `.mdc` rule). - **Chore** — Prettier on touched markdown where required by hooks. ### Linking specs from Cursor Automations (for reviewers) There is **no official Cursor documentation** that guarantees a cloud agent will **fetch and follow** an arbitrary GitHub blob URL. **Recommended:** configure the automation with a **repository + branch** that contains this file, and instruct the agent to read **`.cursor/automations/enum-shared-type-migration.md` in the workspace**. A **GitHub link** (especially `raw.githubusercontent.com` or a **pinned commit**) is still useful for humans, pinning a frozen spec, or external tooling—but treat it as **supplementary** to the checked-out file. ## **Related issues** Fixes: (none — contributor workflow / tooling only) ## **Manual testing steps** 1. On this branch, open `.cursor/automations/enum-shared-type-migration.md` and confirm structure, JQL blocks, and links render as expected. 2. In Cursor Chat, `@`-mention `.cursor/automations/enum-shared-type-migration.md` and confirm the agent is directed to `docs/ai-agents.md` and the listed `@.cursor/rules/*.md` files for implementation (not `component-migration.md` for this epic). 3. Confirm no remaining references to deleted paths (e.g. `component-migration-tracking`, removed tracker docs) via repo search. 4. (Optional) Create or edit a **Private** test automation: paste the **cloud prompt** snippet from the automation doc and run against a branch that includes this file; confirm the agent can see `.cursor/automations/enum-shared-type-migration.md` on disk. ## **Example PRs** PRs that have been successfully created with this automation - #996 - #1009 - #1010 - #1015 ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable (N/A — docs only) - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable (N/A) - [ ] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk: documentation-only changes that add guidance for Cursor Automations and do not affect runtime code paths. > > **Overview** > Adds a version-controlled Cursor Automation spec at `.cursor/automations/enum-shared-type-migration.md` that defines the DSYS-468 Jira pickup workflow (JQL for interactive vs scheduled runs), required tools/identity notes, which `.cursor/rules/` to follow for the migration, and a paste-ready automation prompt (plus post-merge Jira-closing guidance). > > Updates `docs/ai-agents.md` to explicitly document how Cursor Cloud Automations should follow the repo’s agent principles (*reference over duplication*, checklists, verification) and to treat `.cursor/automations/` as the canonical, reviewable source of truth for automation prompts. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 2594fa9. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: cursor[bot] <206951365+cursor[bot]@users.noreply.github.com>
cursor Bot
added a commit
that referenced
this pull request
Apr 28, 2026
## **Description** This PR migrates the `BadgeIcon` component to follow [ADR-0004 (Centralized Types Architecture)](https://github.com/MetaMask/decisions/blob/main/decisions/design-system/0004-centralized-types-architecture.md) by creating a shared `BadgeIconPropsShared` type in `@metamask/design-system-shared` and updating both React and React Native platform packages to extend it. **What changed:** - Created `packages/design-system-shared/src/types/BadgeIcon/BadgeIcon.types.ts` with `BadgeIconPropsShared` (platform-independent `iconName: string` prop) - Added `packages/design-system-shared/src/types/BadgeIcon/index.ts` and exported from shared package index - Updated `packages/design-system-react/src/components/BadgeIcon/BadgeIcon.types.ts` to import and extend `BadgeIconPropsShared`, narrowing `iconName` to the platform-specific `IconName` enum - Updated `packages/design-system-react-native/src/components/BadgeIcon/BadgeIcon.types.ts` to import and extend `BadgeIconPropsShared`, narrowing `iconName` to the platform-specific `IconName` enum This is a non-breaking internal refactor — the component APIs remain identical to consumers. ## **Related issues** Fixes: [DSYS-479](https://consensyssoftware.atlassian.net/browse/DSYS-479) ## **Manual testing steps** 1. Run `yarn build` — should complete without errors 2. Run `yarn test` — all tests should pass with 100% coverage 3. Run `yarn lint` — should pass with no issues ## **Screenshots/Recordings** N/A — internal type refactor with no visual changes. ### **Before** No visual changes ### **After** No visual changes https://github.com/user-attachments/assets/d41c097f-3d43-4cf2-b777-fbe32dade5cc ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [ ] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-extension/blob/develop/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots. <div><a href="https://cursor.com/agents/bc-e4fc9245-9ba4-4390-bd59-bbbf5547c05a"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/open-in-web-dark.png"><source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/open-in-web-light.png"><img alt="Open in Web" width="114" height="28" src="https://cursor.com/assets/images/open-in-web-dark.png"></picture></a> <a href="https://cursor.com/automations/864f6729-e11f-445a-9607-65e9539d53c1"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/assets/images/view-automation-dark.png"><source media="(prefers-color-scheme: light)" srcset="https://cursor.com/assets/images/view-automation-light.png"><img alt="View Automation" width="141" height="28" src="https://cursor.com/assets/images/view-automation-dark.png"></picture></a> </div> <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk type-only refactor that centralizes `BadgeIcon` prop typing; behavior should be unchanged aside from potential TypeScript build/export issues if downstream imports relied on the old `IconName`/`IconSize` sources. > > **Overview** > Migrates `BadgeIcon` to ADR-0004 centralized typing by adding `BadgeIconPropsShared` to `@metamask/design-system-shared` and exporting it from the shared index. > > Updates both React and React Native `BadgeIcon` props to extend the shared type, and switches stories/tests/Figma Code Connect files (and component imports for `IconColor`/`IconSize`/`IconName`) to reference `@metamask/design-system-shared` instead of platform `Icon` modules. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit 2c38fba. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com> Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
cursor Bot
pushed a commit
that referenced
this pull request
Apr 28, 2026
## Release 36.0.0 This release makes the generated changelogs consumer-facing, adds the Telegram icon across the published packages, and keeps the type-level breaking change notes focused on the enum-to-const-object and string-union migration for `AvatarIcon`. ### 📦 Package Versions - `@metamask/design-system-shared`: **0.14.0** - `@metamask/design-system-react`: **0.19.0** - `@metamask/design-system-react-native`: **0.21.0** ### 🔄 Shared Package Updates (0.14.0) #### Type and icon updates ([#996](#996), [#1010](#1010), [#1122](#1122)) **What Changed:** - Added shared `AvatarIcon` contracts, including `AvatarIconPropsShared`, `AvatarIconSize`, and `AvatarIconSeverity` - Added shared `BadgeIconPropsShared` - Added `Telegram` to the shared icon exports ### 🌐 React Web Updates (0.19.0) #### Added - Added `Telegram` to the `IconName` set for React consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react` as before ### 📱 React Native Updates (0.21.0) #### Added - Added `Telegram` to the `IconName` set for React Native consumers ([#1122](#1122)) #### Changed - **BREAKING:** Updated `AvatarIcon` exports to use const-object + string-union types rather than local enum-based definitions ([#996](#996)) - No migration required for typical usage; continue importing from `@metamask/design-system-react-native` as before ###⚠️ Breaking Changes #### AvatarIcon type migration (Both Platforms) **What Changed:** - `AvatarIcon` now follows the const-object + string-union pattern already used by similar type migrations in this repo - Public imports and runtime usage remain unchanged **Impact:** - This is a type-level breaking change, but normal component usage should continue to work unchanged - Consumers should only expect updates if they relied on enum-specific typing assumptions ### ✅ Checklist - [x] Changelogs updated with human-readable descriptions - [x] Changelog validation passed (`yarn changelog:validate`) - [x] Version bumps follow semantic versioning - [x] design-system-shared: minor (`0.13.0` → `0.14.0`) - shared AvatarIcon and BadgeIcon type additions plus Telegram icon support - [x] design-system-react: minor (`0.18.0` → `0.19.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] design-system-react-native: minor (`0.20.0` → `0.21.0`) - Telegram icon plus pre-1.0 `AvatarIcon` type migration - [x] Breaking changes documented proportionally to severity - [x] PR references included in changelog entries ## **Pre-merge author checklist** - [ ] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) - [x] I've reviewed the [Release Workflow](./.cursor/rules/release-workflow.md) cursor rule - [ ] All tests pass (`yarn build && yarn test && yarn lint`) - [x] Changelog validation passes (`yarn changelog:validate`) ## **Pre-merge reviewer checklist** - [ ] I've reviewed the [Reviewing Release PRs](./docs/reviewing-release-prs.md) guide - [ ] Package versions follow semantic versioning - [ ] Changelog entries are consumer-facing (not commit message regurgitation) - [ ] Breaking changes are documented proportionally to severity - [ ] All unreleased changes are accounted for in changelogs <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk release bookkeeping: only version bumps and changelog updates; no runtime code changes are included in this diff. > > **Overview** > Bumps the monorepo version to `36.0.0` and publishes new package versions for `@metamask/design-system-shared` (`0.14.0`), `@metamask/design-system-react` (`0.19.0`), and `@metamask/design-system-react-native` (`0.21.0`). > > Updates package changelogs to document the newly released consumer-facing changes, including adding the `Telegram` icon and *type-level breaking* alignment of `AvatarIcon` (and shared contracts in `design-system-shared`) to shared const-object + string-union exports. > > <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit fa4ad9f. Bugbot is set up for automated code reviews on this repo. Configure [here](https://www.cursor.com/dashboard/bugbot).</sup> <!-- /CURSOR_SUMMARY -->
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR migrates the
BadgeIconcomponent to follow ADR-0004 (Centralized Types Architecture) by creating a sharedBadgeIconPropsSharedtype in@metamask/design-system-sharedand updating both React and React Native platform packages to extend it.What changed:
packages/design-system-shared/src/types/BadgeIcon/BadgeIcon.types.tswithBadgeIconPropsShared(platform-independenticonName: stringprop)packages/design-system-shared/src/types/BadgeIcon/index.tsand exported from shared package indexpackages/design-system-react/src/components/BadgeIcon/BadgeIcon.types.tsto import and extendBadgeIconPropsShared, narrowingiconNameto the platform-specificIconNameenumpackages/design-system-react-native/src/components/BadgeIcon/BadgeIcon.types.tsto import and extendBadgeIconPropsShared, narrowingiconNameto the platform-specificIconNameenumThis is a non-breaking internal refactor — the component APIs remain identical to consumers.
Related issues
Fixes: DSYS-479
Manual testing steps
yarn build— should complete without errorsyarn test— all tests should pass with 100% coverageyarn lint— should pass with no issuesScreenshots/Recordings
N/A — internal type refactor with no visual changes.
Before
No visual changes
After
No visual changes
badgeicon.after.720.mov
Pre-merge author checklist
Pre-merge reviewer checklist
Note
Low Risk
Low risk type-only refactor that centralizes
BadgeIconprop typing; runtime behavior is unchanged aside from import source adjustments for icon enums/sizes.Overview
Migrates
BadgeIconto ADR-0004 centralized typing by introducing sharedBadgeIconPropsSharedin@metamask/design-system-sharedand exporting it from the shared index.Updates both React and React Native
BadgeIconto extend the shared props, and switches stories/tests/Figma Code Connect plus component imports to use sharedIconName/IconSize/IconColorinstead of platform-local exports.Reviewed by Cursor Bugbot for commit 2263e67. Bugbot is set up for automated code reviews on this repo. Configure here.