Skip to content

Showcase-app(frontend): dependency upgrades and related fixes - #456

Open
Ratheeshrajan wants to merge 10 commits into
ibm-messaging:masterfrom
Ratheeshrajan:carbon-react-upgrade
Open

Showcase-app(frontend): dependency upgrades and related fixes#456
Ratheeshrajan wants to merge 10 commits into
ibm-messaging:masterfrom
Ratheeshrajan:carbon-react-upgrade

Conversation

@Ratheeshrajan

@Ratheeshrajan Ratheeshrajan commented Aug 10, 2026

Copy link
Copy Markdown

Dependencies

  • Upgraded react and react-dom 18.3 → 19.2.8
  • Upgraded @carbon/react 1.53.0 → 1.113.0
  • Upgraded @carbon/charts / @carbon/charts-react 1.15.3 → 1.27.18
  • Upgraded react-toastify 9.0.8 → 11.1.0 (React 19 compatible)
  • Upgraded react-router-dom 6.x → 7.18.2
  • Removed unused dom-to-image-more dependency
  • Zustand v3 → v5
  • Upgraded react-flow-renderer → @xyflow/react v12 (changed components to reflect new API spec)

Carbon import fixes

  • Replaced all @carbon/react/lib/ deep-path default imports with named imports from @carbon/react across 7 node files (FormLabel, TextInput, ProgressBar), deep paths removed in @carbon/react@1.113.0

@xyflow/react fixes

  • Replaced with
    inside all blocks in both edge files — fixes React 19 hydration error
  • Removed invalid connectionLineType and type props from SVG elements in both edge files
  • Fixed stale defaultZoom → defaultViewport in PubSub/map.jsx and RequestResponse/map.jsx
  • API renames: onEdgeUpdate → onReconnect, updateEdge → reconnectEdge, project() → screenToFlowPosition(), defaultPosition+defaultZoom → defaultViewport

Carbon Charts fix

  • Added empty-data guard (if (!props.data?.length) return null) to all 3 chart components, prevents NaN SVG crash on initial render before data arrives

Accessibility / form IDs

  • Added unique id props (scoped to node's id) to all 12 TextInput instances across 7 node files
  • Added missing labelText where absent
  • Replaced hardcoded duplicate id="tj-input" on 3 NumberInput elements with unique node-scoped IDs

Common

  • Replaced Switch with Routes
  • Added **/dist/, **/build/, **/.vite/ to root .gitignore
  • Updated copyright year to 2022, 2026 on all 14 modified source files

BREAKING CHANGE: none - MQ messaging behaviour and API contracts unchanged.

@CLAassistant

CLAassistant commented Aug 10, 2026

Copy link
Copy Markdown

CLA assistant check
All committers have signed the CLA.

@Ratheeshrajan Ratheeshrajan changed the title Carbon react upgrade Showcase app: dependency upgrades and related fixes Aug 10, 2026
@Ratheeshrajan Ratheeshrajan changed the title Showcase app: dependency upgrades and related fixes Showcase-app(fornend): dependency upgrades and related fixes Aug 10, 2026
@Ratheeshrajan Ratheeshrajan changed the title Showcase-app(fornend): dependency upgrades and related fixes Showcase-app(forntend): dependency upgrades and related fixes Aug 10, 2026
@Ratheeshrajan
Ratheeshrajan marked this pull request as ready for review August 10, 2026 13:44
@Ratheeshrajan Ratheeshrajan changed the title Showcase-app(forntend): dependency upgrades and related fixes Showcase-app(frontend): dependency upgrades and related fixes Aug 11, 2026
@ibmmqmet

Copy link
Copy Markdown
Collaborator

I tried running this locally, without AWS, and hit several problems with the docker-compose operations:

  • Images should not be taken from Dockerhub (docker.io). That's banned within IBM.
    • Use alternative locations - quay.io where possible, public.ecr.aws is acceptable
  • Node 20.9 as a base image is too old. Looks like 20.19 is minimum for current levels of packages
  • Warnings
    • => WARN: FromAsCasing: 'as' and 'FROM' keywords' casing do not match (line 22)
    • => WARN: StageNameCasing: Stage name 'backendImage' should be lowercase (line 81)
    • => WARN: FromAsCasing: 'as' and 'FROM' keywords' casing do not match (line 81)
    • => WARN: FromPlatformFlagConstDisallowed: FROM --platform flag should not use constant value "linux/amd64" (line 22)
    • => WARN: FromPlatformFlagConstDisallowed: FROM --platform flag should not use constant value "linux/amd64" (line 81)
  • The ibmmq dependency is very out of date
  • Lots of node packages that are showing as deprecated
    • I ran docker-compose --file docker-compose.yaml build --no-cache to make sure it was building from scratch and errors could be seen
  • frontend has a package-lock.json; should backend?

The actual code changes look reasonable, though I don't know React well-enough

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.

4 participants