Skip to content

fix: [M3-10435] - ImageSelect, UserData Bug Fixes#12638

Merged
jaalah-akamai merged 10 commits intolinode:developfrom
jaalah-akamai:M3-10435
Aug 20, 2025
Merged

fix: [M3-10435] - ImageSelect, UserData Bug Fixes#12638
jaalah-akamai merged 10 commits intolinode:developfrom
jaalah-akamai:M3-10435

Conversation

@jaalah-akamai
Copy link
Copy Markdown
Contributor

Description 📝

This PR addresses a critical React anti-pattern where the ImageSelect component was calling onChange during the render phase, causing the error "Cannot update a component (UserData) while rendering a different component (ImageSelect)".
Screenshot 2025-08-05 at 9 50 38 AM

The fix moves the auto-selection logic to a useEffect hook to ensure state updates happen after rendering is complete.

Changes 🔄

  • Fix setState during render in ImageSelect: Moved the auto-selection logic from render phase to useEffect hook to prevent React warnings about updating components during render
  • Added hasBorder to omitted props for StyledFlag
  • Removed User Data icon/tooltip responsible for invalid HTML: Button within Button

Scope 🚢

Upon production release, changes in this PR will be visible to:

  • All customers
  • Some customers (e.g. in Beta or Limited Availability)
  • No customers / Not applicable

Target release date 🗓️

N/A

Before After
Screenshot 2025-08-05 at 10 13 19 AM
user-data.mov
Screenshot 2025-08-05 at 9 52 59 AM Fixed

How to test 🧪

Verification steps

  • Go to /linodes/create/marketplace
  • Select a region and observe hasBorder error no longer occurs
  • If the chosen app has User Data, observe the new layout where the description is exposed. Tooltip has been removed
  • When selecting images, observe the render issue is no longer displayed in console.
Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support


  • I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

  • All tests and CI checks are passing
  • TypeScript compilation succeeded without errors
  • Code passes all linting rules

@jaalah-akamai jaalah-akamai requested a review from a team as a code owner August 5, 2025 15:01
@jaalah-akamai jaalah-akamai requested review from bnussman-akamai and hasyed-akamai and removed request for a team August 5, 2025 15:01
@jaalah-akamai jaalah-akamai marked this pull request as draft August 5, 2025 15:01
@jaalah-akamai jaalah-akamai self-assigned this Aug 5, 2025
@jaalah-akamai jaalah-akamai added the Bug Fixes for regressions or bugs label Aug 5, 2025
@jaalah-akamai
Copy link
Copy Markdown
Contributor Author

jaalah-akamai commented Aug 5, 2025

Waiting for UX response before proceeding

Good to go!

@jaalah-akamai jaalah-akamai marked this pull request as ready for review August 5, 2025 15:29
@jaalah-akamai jaalah-akamai added the Add'tl Approval Needed Waiting on another approval! label Aug 12, 2025
@jaalah-akamai jaalah-akamai requested a review from mjac0bs August 13, 2025 14:05
…erDataHeading.tsx

Co-authored-by: Mariah Jacobs <114685994+mjac0bs@users.noreply.github.com>
@jaalah-akamai jaalah-akamai requested a review from mjac0bs August 19, 2025 19:00
@linode-gh-bot
Copy link
Copy Markdown
Collaborator

Cloud Manager UI test results

🎉 730 passing tests on test run #8 ↗︎

❌ Failing✅ Passing↪️ Skipped🕐 Duration
0 Failing730 Passing4 Skipped131m 56s

@github-project-automation github-project-automation bot moved this from Review to Approved in Cloud Manager Aug 19, 2025
@mjac0bs mjac0bs removed the Add'tl Approval Needed Waiting on another approval! label Aug 19, 2025
@mjac0bs mjac0bs added the Approved Multiple approvals and ready to merge! label Aug 19, 2025
@jaalah-akamai jaalah-akamai merged commit 0d05f27 into linode:develop Aug 20, 2025
35 checks passed
@github-project-automation github-project-automation bot moved this from Approved to Merged in Cloud Manager Aug 20, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Approved Multiple approvals and ready to merge! Bug Fixes for regressions or bugs

Projects

Archived in project

Development

Successfully merging this pull request may close these issues.

5 participants