Chore: `UserProfileEditPage` - Replace `VerticalGroup` with `Stack` (#86619)

.betterer.results

@@ -4141,9 +4141,6 @@ exports[`better eslint`] = {
       [0, 0, 0, "Do not use any type assertions.", "2"],
       [0, 0, 0, "Do not use any type assertions.", "3"]
     ],
-    "public/app/features/profile/UserProfileEditPage.tsx:5381": [
-      [0, 0, 0, "\'VerticalGroup\' import from \'@grafana/ui\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
-    ],
     "public/app/features/query/components/QueryEditorRow.tsx:5381": [
       [0, 0, 0, "Do not use any type assertions.", "0"],
       [0, 0, 0, "Do not use any type assertions.", "1"],

public/app/features/profile/UserProfileEditPage.tsx

@@ -5,7 +5,7 @@ import { useMount } from 'react-use';
 import { PluginExtensionComponent, PluginExtensionPoints } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
 import { getPluginComponentExtensions } from '@grafana/runtime';
-import { Tab, TabsBar, TabContent, VerticalGroup, Stack } from '@grafana/ui';
+import { Tab, TabsBar, TabContent, Stack } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';
 import SharedPreferences from 'app/core/components/SharedPreferences/SharedPreferences';
 import { useQueryParams } from 'app/core/hooks/useQueryParams';
@@ -112,7 +112,7 @@ export function UserProfileEditPage({
   ];
 
   const UserProfile = () => (
-    <VerticalGroup spacing="md">
+    <Stack direction="column" gap={2}>
       <UserProfileEditForm updateProfile={updateUserProfile} isSavingUser={isUpdating} user={user} />
       <SharedPreferences resourceUri="user" preferenceType="user" />
       <Stack direction="column" gap={6}>
@@ -120,7 +120,7 @@ export function UserProfileEditPage({
         <UserOrganizations isLoading={orgsAreLoading} setUserOrg={changeUserOrg} orgs={orgs} user={user} />
         <UserSessions isLoading={sessionsAreLoading} revokeUserSession={revokeUserSession} sessions={sessions} />
       </Stack>
-    </VerticalGroup>
+    </Stack>
   );
 
   const UserProfileWithTabs = () => (