refactor: [M3-8143] - Improve PowerActionsDialog

[carrillo-erik]

Description 📝

This PR helps improve the janky loading state of the PowerActionsDialog by removing the flash of content when a dialog or drawer is rendered. The user is now shown helper text in the Reboot Linode dialog above the config select component.

Changes 🔄

List any change relevant to the reviewer.

• Remove redundant uses of useLinodeQuery.
• Pass the linodeLabel prop to child component to eliminate the flash of content.
• Replace default exports with named exports.
• Introduce helper text for the config select component in Reboot Linode dialog.

Target release date 🗓️

07/22/2024

Preview 📷

Before	After
PowerActionsDialog-before.mov	PowerActionsDialog-after.mov

How to test 🧪

Prerequisites

(How to setup test environment)

• Either:
  • Have at least two linode instances with several configurations saved.
  • Turn on the MSW.

Verification steps

(How to verify changes)

• Start with visiting the Linodes landing page.
• Click on the LinodeActionMenu and select any of the options.
• Observe that the flash of content has been resolved.
• Verify that the helper text is rendered below the config select in the Reboot Linode dialog.
• Verify that no regressions were introduced with these changes.

As an Author I have considered 🤔

Check all that apply

• 👀 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

[github-actions]

Coverage Report: ✅
Base Coverage: 82.48%
Current Coverage: 82.48%

[abailly-akamai]

Looks good and other changes are safe. Left a comment for a fix in the reboot modal that will improve the UX

[abailly-akamai]

This components needs its form state reset on either close or open - especially since the Config Select clearable prop does not seem to any effect. Ex: select a config and close the modal, open it back up and the previously selected config will be selected and unclearable.

[carrillo-erik]

@abailly-akamai This issue was also occurring with onSubmit(), both cases for the state reset have been addressed. Also, the isClearable prop now works as expected.

[abailly-akamai]

Thanks for addressing the changes - confirmed the modal select is not clearable and reset properly. ✅