Skip to content

fix(frontend): align lucide-react with Cloud UI (^1.8.0) to unbreak Console MF mount#2388

Merged
c-julin merged 1 commit intomasterfrom
jc/align-lucide-react-with-cloud-ui
Apr 17, 2026
Merged

fix(frontend): align lucide-react with Cloud UI (^1.8.0) to unbreak Console MF mount#2388
c-julin merged 1 commit intomasterfrom
jc/align-lucide-react-with-cloud-ui

Conversation

@c-julin
Copy link
Copy Markdown
Contributor

@c-julin c-julin commented Apr 17, 2026

Summary

Cloud UI bumped lucide-react to ^1.8.0 in cloudv2 cfb8f9ff62 ("align ADP sidebar icons with ADP UI and upgrade lucide-react"). Because both Cloud UI and Console declare lucide-react as singleton: true in their Module Federation config, MF must resolve to a single instance shared between host and remote. Cloud UI's ^1.8.0 and Console's ^0.563.0 are disjoint ranges, so the host's 1.8.0 wins and Console receives it at runtime.

The breaking change: Linkedin was removed from lucide-react v1 (trademark). Console's components/layout/footer.tsx still imported Linkedin as LinkedInIcon, so on every Console-embedded route in Cloud UI we were rendering an undefined component. React raised "Element type is invalid… Check the render method of v", the ConsoleLoader error boundary caught it, and the whole cluster view collapsed to the "Failed to load Console" fallback.

Federation runtime warning observed in the browser confirming the mismatch:

[ Federation Runtime ] Version 1.8.0 from cloud_ui of shared singleton module lucide-react does not satisfy the requirement of rp_console which needs ^0.563.0

Changes

  • frontend/package.json: lucide-react ^0.563.0 → ^1.8.0 (matches Cloud UI)
  • frontend/bun.lock: regenerated by bun install
  • frontend/src/components/icons/index.tsx: remove the Linkedin as LinkedInIcon re-export (no replacement exists in lucide v1)
  • frontend/src/components/layout/footer.tsx: drop the LinkedIn social link + its import

Why this repo, not Cloud UI

Cloud UI's upgrade commit explicitly removed its own LinkedInIcon usage (described as "unused"). That was only true inside Cloud UI — Console was still consuming it via the shared singleton. Aligning Console is the right direction, since Cloud UI is the host and all MF consumers (current and future) need to track its lucide-react major.

Test plan

  • bun install in frontend/
  • bun run type:check — clean
  • Built Console locally (via Cloudv2 Tilt Build & deploy local Console) and loaded it embedded in Cloud UI at /clusters/:id/*: sidebar, tabs, and footer render without the React element-type error
  • Verified served mf-manifest.json now declares lucide-react { requiredVersion: \"^1.8.0\", singleton: true } matching Cloud UI
  • CI: unit + integration + e2e

cc @malinskibeniamin — flagging you since cfb8f9ff62 in cloudv2 motivated this. No action needed on your side; posting so the singleton bump story is complete on both sides.

Cloud UI recently upgraded lucide-react to ^1.8.0. Because both apps
declare lucide-react as a `singleton` in their Module Federation config,
the Cloud UI host provides a single instance for the Console remote to
consume. With Console pinned at ^0.563.0, the constraints are disjoint
and MF resolves to Cloud UI's 1.8.0 — where `Linkedin` no longer exists
(removed upstream for trademark reasons) — so Console's footer rendered
`undefined` and the entire Console MF mount errored on every cluster
route in Cloud UI.

Align Console with Cloud UI and drop the now-unexported LinkedIn icon:
- package.json: lucide-react ^0.563.0 -> ^1.8.0
- components/icons/index.tsx: remove the `Linkedin as LinkedInIcon` re-export
- components/layout/footer.tsx: drop the LinkedIn link and its import
@c-julin c-julin merged commit 2158310 into master Apr 17, 2026
16 checks passed
@c-julin c-julin deleted the jc/align-lucide-react-with-cloud-ui branch April 17, 2026 13:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants