help text in the identity provider form? in this economy?

Author: david-crespo

app/forms/idp/create.tsx

@@ -20,8 +20,10 @@ import { HL } from '~/components/HL'
 import { useSiloSelector } from '~/hooks/use-params'
 import { addToast } from '~/stores/toast'
 import { FormDivider } from '~/ui/lib/Divider'
+import { Message } from '~/ui/lib/Message'
 import { SideModal } from '~/ui/lib/SideModal'
 import { readBlobAsBase64 } from '~/util/file'
+import { links } from '~/util/links'
 import { pb } from '~/util/path-builder'
 
 import { MetadataSourceField, type IdpCreateFormValues } from './shared'
@@ -120,7 +122,32 @@ export function CreateIdpSideModalForm() {
       submitError={createIdp.error}
       submitLabel="Create provider"
     >
-      <NameField name="name" control={form.control} />
+      <Message
+        content={
+          <>
+            Read the{' '}
+            <a
+              href={links.identityProvidersDocs}
+              className="underline"
+              target="_blank"
+              rel="noreferrer"
+            >
+              Rack Configuration
+            </a>{' '}
+            guide to learn more about setting up an identity provider.
+          </>
+        }
+      />
+      <NameField
+        name="name"
+        control={form.control}
+        description={
+          <>
+            A short name for the provider in our system. Users will see it in the path to
+            the login page: <code>/login/{silo}/saml/idp-name</code>.
+          </>
+        }
+      />
       <DescriptionField name="description" control={form.control} required />
       <TextField
         name="technicalContactEmail"

app/ui/lib/Message.tsx

@@ -71,7 +71,7 @@ export const Message = ({
   // TODO: convert content to a children prop
   content,
   className,
-  variant = 'success',
+  variant = 'info',
   cta,
   icon,
 }: MessageProps) => {