Skip to content

DX-1128: localise presentational components (Badge/Button/LinkButton/FeaturedLink/Status)#3412

Draft
jamiehenson wants to merge 1 commit into
dx-1128/docs-local-iconfrom
dx-1128/docs-components-presentational
Draft

DX-1128: localise presentational components (Badge/Button/LinkButton/FeaturedLink/Status)#3412
jamiehenson wants to merge 1 commit into
dx-1128/docs-local-iconfrom
dx-1128/docs-components-presentational

Conversation

@jamiehenson

@jamiehenson jamiehenson commented Jun 17, 2026

Copy link
Copy Markdown
Member

Part of DX-1128. Localises the presentational components docs uses from @ably/ui.

What

Vendored into src/components/ui/ (rewired to local Icon/cn/colors): Badge, Button, LinkButton, FeaturedLink, Status, plus colors.ts and the Ably logo SVG. swr promoted to a direct dep.

Behaviour

No visual change intended — vendored from the @ably/ui source, rewired to local primitives.

Stack (DX-1128)

PR Role
#3409 Design foundation — vendor @ably/ui tokens + reset/core CSS
#3410 Local cn + heights utils
#3411 Docs-native Icon component
#3412 Presentational components (Badge, Button, LinkButton, FeaturedLink, Status)
#3413 Interactive components (SegmentedControl, TabMenu)
#3414 ProductTile + product data (leaf)
#3415 syntax-highlighter util + registry
#3416 Code + CodeSnippet — completes the lift; prunes dead CSS + drops @ably/ui Tailwind scan
#3417 Combined view of #3409#3416 — review/demo only (based on main)

#3409#3416 are a linear stack (each builds on the previous); #3417 is the combined view. ▶ = this PR.

Testing

  • Load the review app.
  • Check a sufficient sample of pages load with no visual regressions.

🤖 Generated with Claude Code

@coderabbitai

coderabbitai Bot commented Jun 17, 2026

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: cdd2ec6d-7d9e-4e14-a94c-7dc6cd04a2d4

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch dx-1128/docs-components-presentational

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@jamiehenson jamiehenson force-pushed the dx-1128/docs-local-icon branch from 4c74691 to 8b2ecc6 Compare June 18, 2026 13:18
@jamiehenson jamiehenson force-pushed the dx-1128/docs-components-presentational branch from ef72e03 to 02d982a Compare June 18, 2026 13:18
@jamiehenson jamiehenson marked this pull request as ready for review June 18, 2026 13:36
@jamiehenson jamiehenson force-pushed the dx-1128/docs-local-icon branch from 8b2ecc6 to 5d78500 Compare June 18, 2026 14:34
@jamiehenson jamiehenson force-pushed the dx-1128/docs-components-presentational branch from 02d982a to a74f1b6 Compare June 18, 2026 14:34
@jamiehenson jamiehenson added the review-app Create a Heroku review app label Jun 18, 2026
@ably-ci ably-ci temporarily deployed to ably-docs-dx-1128-docs--wewelg June 18, 2026 14:54 Inactive
@jamiehenson jamiehenson force-pushed the dx-1128/docs-local-icon branch from 5d78500 to 7e2f701 Compare June 18, 2026 14:56
@jamiehenson jamiehenson force-pushed the dx-1128/docs-components-presentational branch from a74f1b6 to e801746 Compare June 18, 2026 14:57
@ably-ci ably-ci temporarily deployed to ably-docs-dx-1128-docs--wewelg June 18, 2026 14:57 Inactive
Vendor Badge, Button, LinkButton, FeaturedLink and Status into
src/components/ui/, owned locally and adapted to the local cn / Icon (DX-1128).
Adds:
- src/components/ui/colors.ts — local copy of @ably/ui's colour types + data
  (ColorClass / ColorThemeSet / ColorClassColorGroups), shared by these
  components (and the rest of the lift).
- IconSize to the local Icon types.
- src/images/ably-logo.svg (used as a URL by the header).
- swr as a direct dependency (Status fetches system status; was transitive).

All @ably/ui imports in the vendored components are repointed to local paths;
~12 consumer import sites codemodded off @ably/ui/core/*. eslint clean.

Refs: DX-1128
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

review-app Create a Heroku review app

Development

Successfully merging this pull request may close these issues.

2 participants