Google Workspace settings: page description instead of instructions card (#48651)

## Summary

Settings-page adjustments to the Google Workspace integration (per
[product
feedback](https://github.com/fleetdm/fleet/issues/42915#issuecomment-4867743312)):

1. Removed the wrapper card (`InfoBanner`) around the instructions —
replaced it with `PageDescription` (`variant="right-panel"`), so the
text styling matches the "Connect Fleet to your IdP…" description in the
sibling IdP section.
2. Updated the copy to:
> Configure these settings to populate IdP host vitals from Google
Workspace. When Google Workspace is connected, Fleet ignores SCIM
provisioning from other IdPs (e.g Okta, Entra ID).

Also updated a stale SCSS comment that referenced the removed
`InfoBanner` (the `box-sizing: border-box` fix on the form card stays —
it's needed regardless of the banner).

**Related issue:** #42915

## Testing

- [x] Added/updated automated tests
- [x] QA'd all new/changed functionality manually


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Refactor**
* Updated the Google Workspace settings page to show connection and
configuration guidance in a cleaner description block.
* Preserved all existing form fields, validation, and submission
behavior.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Lucas Manuel Rodriguez
2026-07-03 11:33:12 -03:00
committed by GitHub
parent 34af79e98a
commit bf346d5212
2 changed files with 14 additions and 10 deletions
@@ -10,7 +10,7 @@ import { notify } from "components/ToastNotification";
import InputField from "components/forms/fields/InputField";
import Button from "components/buttons/Button";
import Card from "components/Card";
import InfoBanner from "components/InfoBanner";
import PageDescription from "components/PageDescription";
import GitOpsModeTooltipWrapper from "components/GitOpsModeTooltipWrapper";
import SettingsSection from "pages/admin/components/SettingsSection";
@@ -185,11 +185,16 @@ const GoogleWorkspaceSection = ({
return (
<SettingsSection title="Google Workspace" className={baseClass}>
<InfoBanner>
Connecting Google Workspace populates IdP host vitals directly from your
directory. While Google Workspace is connected, SCIM provisioning (Okta,
Entra ID, etc.) is ignored configure one or the other, not both.
</InfoBanner>
<PageDescription
content={
<>
Configure these settings to populate IdP host vitals from Google
Workspace. When Google Workspace is connected, Fleet ignores SCIM
provisioning from other IdPs (e.g Okta, Entra ID).
</>
}
variant="right-panel"
/>
<form onSubmit={onFormSubmit} autoComplete="off">
<Card>
<InputField
@@ -3,10 +3,9 @@
form {
.card {
// The generic `.card` is content-box (only `.info-banner` gets the global
// border-box override), so its `width: 100%` plus padding/border renders
// ~50px wider than the section, overflowing past the InfoBanner above.
// border-box makes its total width equal the section width, like the banner.
// The generic `.card` is content-box, so its `width: 100%` plus
// padding/border renders ~50px wider than the section and overflows.
// border-box makes its total width equal the section width.
box-sizing: border-box;
// Stack the fields with consistent vertical spacing so each field's help