Software failed to install modal not scrolled, requires scrolling whole page

[jmwatts]

Fleet version: 4.65.0

Web browser and operating system: Chrome 134.0.6998.166 running on macOS

---

💥  Actual behavior

🧑‍💻  Steps to reproduce

1. On a failed install for software (ex: Cloudflare WARP) open the details modal for the activity item

🕯️ Expected

Modal should have a scroll so that modal isn't huge and failed install results don't require scrolling the whole page

🛠️ To fix

• Set content container to max 300px height.

• Set font to SourceCodePro to match script content in script details modal which is accessed via an online host hosts/:id > Actions > Run script > click on a script

• Design: @eugkuo

QA Plan

1a. After installing an app store app, the request payload and the response from the host will use text area variant with a maximum height of 300px and code font both on the host details page > past activity modal and dashboard > activity modal 1b. After installing a package, the preinstall condition, software install output, or post-install script output will use text area variant with a maximum height of 300px and code font both on the host details page > past activity activity modal and dashboard > activity modal 1c. After having a script on a online host, go to the host details page > Action > Run script and click on the script to ensure it has the same styling as 1a and 1b.

[jmwatts]

Filed per @RachelElysia 's guidance on expected behavior

[eugkuo]

@RachelElysia Do we have an existing max height on these scrolling content containers? If not let's talk about establishing one and documenting it in the design system/storybook.

[mostlikelee]

Hey team! Please add your planning poker estimate with Zenhub @iansltx @jahzielv @ksykulev @alexmitchelliii

[iansltx]

Erm, this is FE. Revising Planning Poker to match.

[iansltx]

Please add your planning poker estimate with Zenhub @RachelElysia

[RachelElysia]

Moving on my 4.67 board per m0ar capacity cc: @mostlikelee

[RachelElysia]

@eugkuo Just realized these aren't even the right font!!! Used in 3 different modals, I'm building a <ScriptTextarea> component now so this is a non issue going forward!

[RachelElysia]

@eugkuo <Textarea/> storybook coming with a variant="code"

[jmwatts]

QA Notes

• [x] After installing an app store app, the request payload and the response from the host will use text area variant with a maximum height of 300px and code font both on the host details page > past activity modal and dashboard > activity modal (See note below)
• [x] After installing a package, the preinstall condition, software install output, or post-install script output will use text area variant with a maximum height of 300px and code font both on the host details page > past activity activity modal and dashboard > activity modal
• [x] After having a script on a online host, go to the host details page > Action > Run script and click on the script to ensure it has the same styling as 1a and 1b.

Filing a new bug for:

After installing an app store app, the request payload and the response from the host will use text area variant with a maximum height of 300px and code font both on the host details page > past activity modal and dashboard > activity modal #28136

And

After having a script on a online host, go to the host details page > Action > Run script and click on the script to ensure it has the same styling as 1a and 1b. #28134

[fleet-release]

Scrolling limited, like Clouds over glass city heights, Ease for user's sight.