upcoming: [M3-8847] - Update Region Select for LKE-Enterprise (#11348)

## Description 📝
LKE-Enterprise will not be available in all regions. It will be available in limited DCs initially, then expanded to all core DCs. We want to clearly communicate to users why they cannot select the same DCs for LKE-E as we offer for LKE. 

## Changes  🔄
- Filter region select by the `Kubernetes Enterprise` capability if LKE-E is selected & show tooltip

## How to test 🧪

### Prerequisites

(How to setup test environment)

- Ensure you have the LKE-E customer tag on your account (see Project Tracker)
- Point to the development environment

### Verification steps

(How to verify changes)

- [ ] Go to http://localhost:3000/kubernetes/create
- [ ] When LKE standard cluster type is selected, all regions with the Kubernetes capability are displayed.
- [ ] When the LKE enterprise cluster type is selected, regions are filtered display only those with the Kubernetes Enterprise capability.
  - [ ] A tooltip is displayed next to the region select that explains the reason for the limited list.
- [ ] When the lkeEnterprise feature is disabled, no region tooltip is visible.
- [ ] Confirm test coverage passes

```
yarn cy:run -s "cypress/e2e/core/kubernetes/lke-create.spec.ts"
```

packages/api-v4/src/regions/types.ts

@@ -11,6 +11,7 @@ export type Capabilities =
   | 'Distributed Plans'
   | 'GPU Linodes'
   | 'Kubernetes'
+  | 'Kubernetes Enterprise'
   | 'Linodes'
   | 'Managed Databases'
   | 'Metadata'

packages/manager/.changeset/pr-11348-upcoming-features-1733174894693.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+Update Region Select for LKE-Enterprise ([#11348](https://github.com/linode/manager/pull/11348))

packages/manager/cypress/e2e/core/kubernetes/lke-create.spec.ts

@@ -870,6 +870,18 @@ describe('LKE Cluster Creation with LKE-E', () => {
           capabilities: ['Kubernetes Enterprise'],
         })
       ).as('getAccount');
+      mockGetRegions([
+        regionFactory.build({
+          capabilities: ['Linodes', 'Kubernetes'],
+          id: 'us-east',
+          label: 'Newark, US',
+        }),
+        regionFactory.build({
+          capabilities: ['Linodes', 'Kubernetes', 'Kubernetes Enterprise'],
+          id: 'us-iad',
+          label: 'Washington, DC',
+        }),
+      ]).as('getRegions');
 
       cy.visitWithLogin('/kubernetes/clusters');
 
@@ -904,6 +916,24 @@ describe('LKE Cluster Creation with LKE-E', () => {
       // Confirm HA section is hidden since LKE-E includes HA by default
       cy.findByText('HA Control Plane').should('not.exist');
 
+      cy.wait(['@getRegions']);
+
+      // Confirm unsupported regions are not displayed
+      ui.regionSelect.find().click().type('Newark, NJ');
+      ui.autocompletePopper.find().within(() => {
+        cy.findByText('Newark, NJ (us-east)').should('not.exist');
+      });
+
+      // Select a supported region
+      ui.regionSelect.find().clear().type('Washington, DC{enter}');
+
+      // Confirm that there is a tooltip explanation for the region dropdown options
+      ui.tooltip
+        .findByText(
+          'Only regions that support Kubernetes Enterprise are listed.'
+        )
+        .should('be.visible');
+
       // TODO: finish the rest of this test in subsequent PRs
     });
 

packages/manager/src/components/RegionSelect/RegionSelect.tsx

@@ -121,7 +121,7 @@ export const RegionSelect = <
         }}
         sx={(theme) => ({
           [theme.breakpoints.up('md')]: {
-            width: '416px',
+            maxWidth: tooltipText ? '458px' : '416px',
           },
         })}
         textFieldProps={{

packages/manager/src/features/Kubernetes/CreateCluster/CreateCluster.tsx

@@ -331,11 +331,22 @@ export const CreateCluster = () => {
           <StyledFieldWithDocsStack>
             <Stack>
               <RegionSelect
+                currentCapability={
+                  isLkeEnterpriseLAFeatureEnabled &&
+                  selectedTier === 'enterprise'
+                    ? 'Kubernetes Enterprise'
+                    : 'Kubernetes'
+                }
                 textFieldProps={{
                   helperText: <RegionHelperText mb={2} />,
                   helperTextPosition: 'top',
                 }}
-                currentCapability="Kubernetes"
+                tooltipText={
+                  isLkeEnterpriseLAFeatureEnabled &&
+                  selectedTier === 'enterprise'
+                    ? 'Only regions that support Kubernetes Enterprise are listed.'
+                    : undefined
+                }
                 disableClearable
                 errorText={errorMap.region}
                 onChange={(e, region) => setSelectedRegionId(region.id)}

packages/manager/src/features/Linodes/LinodeCreate/resolvers.ts

@@ -43,7 +43,6 @@ export const getLinodeCreateResolver = (
     }
 
     const regions = await queryClient.ensureQueryData(regionQueries.regions);
-
     const selectedRegion = regions.find((r) => r.id === values.region);
 
     const hasSelectedAnEURegion = isEURegion(

packages/ui/src/components/TextField/TextField.tsx

@@ -313,8 +313,7 @@ export const TextField = (props: TextFieldProps) => {
       {helperText && helperTextPosition === 'top' && (
         <FormHelperText
           sx={{
-            marginBottom: theme.spacing(),
-            marginTop: theme.spacing(),
+            marginTop: 0,
           }}
           data-qa-textfield-helper-text
         >
@@ -371,7 +370,7 @@ export const TextField = (props: TextFieldProps) => {
           sx={{
             marginTop: 0,
             ...(Boolean(tooltipText) && {
-              width: '415px',
+              width: '416px',
             }),
             ...props.sx,
           }}

packages/ui/src/foundations/themes/light.ts

@@ -755,7 +755,7 @@ export const lightTheme: ThemeOptions = {
           },
           fontSize: '0.875rem',
           lineHeight: 1.25,
-          maxWidth: 415,
+          maxWidth: 416,
         },
       },
     },