website: Use Docusaurus Frontmatter for badges (#12893)

website/docs: Reduce redundant usage of badges. Move badge logic to components. - Fix JSX class name warning. - Remove duplicate titles. - Flesh out `support_level` frontmatter.
2026-04-27 18:07:15 +02:00 · 2025-02-19 19:03:05 +01:00
parent df2e3878d5
commit a714c781a6
214 changed files with 930 additions and 748 deletions
--- a/website/docs/users-sources/sources/directory-sync/active-directory/index.md
+++ b/website/docs/users-sources/sources/directory-sync/active-directory/index.md
@@ -1,9 +1,8 @@
 ---
 title: Active Directory
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 ## Preparation

 The following placeholders are used in this guide:
--- a/website/docs/users-sources/sources/directory-sync/freeipa/index.md
+++ b/website/docs/users-sources/sources/directory-sync/freeipa/index.md
@@ -1,9 +1,8 @@
 ---
 title: FreeIPA
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 ## Preparation

 The following placeholders are used in this guide:
--- a/website/docs/users-sources/sources/index.md
+++ b/website/docs/users-sources/sources/index.md
@@ -8,7 +8,7 @@ Sources allow you to connect authentik to an external user directory. Sources ca

 Sources are in the following general categories:

- **Protocols** ([Kerberos](./protocols/kerberos/index.md), [LDAP](./protocols/ldap/index.md), [OAuth](./protocols/oauth/index.md), [SAML](./protocols/saml/index.md), and [SCIM](./protocols/scim/index.md))
+- **Protocols** ([Kerberos](./protocols/kerberos/index.md), [LDAP](./protocols/ldap/index.md), [OAuth](./protocols/oauth/index.mdx), [SAML](./protocols/saml/index.md), and [SCIM](./protocols/scim/index.md))
 - [**Property mappings**](./property-mappings/index.md) or how to import data from a source
 - **Directory synchronization** (Active Directory, FreeIPA)
 - **Social logins** (Apple, Discord, Twitch, Twitter, and many others)
--- a/website/docs/users-sources/sources/property-mappings/expressions.md
+++ b/website/docs/users-sources/sources/property-mappings/expressions.md
@@ -16,6 +16,6 @@ import Objects from "../../../expressions/\_objects.md";

 ## Available Functions

-import Functions from "../../../expressions/\_functions.md";
+import Functions from "../../../expressions/\_functions.mdx";

 <Functions />
--- a/website/docs/users-sources/sources/property-mappings/index.md
+++ b/website/docs/users-sources/sources/property-mappings/index.md
@@ -8,7 +8,7 @@ This page is an overview of how property mappings work. For information about sp

 - [Kerberos](../protocols/kerberos/#kerberos-source-property-mappings)
 - [LDAP](../protocols/ldap/index.md#ldap-source-property-mappings)
- [OAuth](../protocols/oauth/index.md#oauth-source-property-mappings)
+- [OAuth](../protocols/oauth/index.mdx#oauth-source-property-mappings)
 - [SAML](../protocols/saml/index.md#saml-source-property-mappings)
 - [SCIM](../protocols/scim/index.md#scim-source-property-mappings)

@@ -36,7 +36,7 @@ return {
 }
 ```

-You can see that the expression returns a Python dictionary. The dictionary keys must match [User properties](../../user/user_ref.md#object-properties) or [Group properties](../../groups/group_ref.md#object-properties). Note that for users, `ak_groups` and `group_attributes` cannot be set.
+You can see that the expression returns a Python dictionary. The dictionary keys must match [User properties](../../user/user_ref.mdx#object-properties) or [Group properties](../../groups/group_ref.md#object-properties). Note that for users, `ak_groups` and `group_attributes` cannot be set.

 See each source documentation for a reference of the available data. See the authentik [expressions documentation](./expressions.md) for available data and functions.

--- a/website/docs/users-sources/sources/protocols/kerberos/index.md
+++ b/website/docs/users-sources/sources/protocols/kerberos/index.md
@@ -1,10 +1,7 @@
 ---
 title: Kerberos
---
-
-<span class="badge badge--preview">Preview</span>
-<span class="badge badge--version">authentik 2024.10+</span>
-
+authentik_preview: true
+authentik_version: "2024.10"
 ---

 This source allows users to enroll themselves with an existing Kerberos identity.
--- a/website/docs/users-sources/sources/protocols/oauth/index.mdx
+++ b/website/docs/users-sources/sources/protocols/oauth/index.mdx
@@ -14,7 +14,7 @@ This source allows users to enroll themselves with an external OAuth-based Ident

    Starting with authentik 2022.10, the default scopes can be replaced by prefix the value for scopes with `*`.

-### OpenID Connect <span class="badge badge--version">authentik 2022.6+</span>
+### OpenID Connect

 #### Well-known

--- a/website/docs/users-sources/sources/social-logins/apple/index.md
+++ b/website/docs/users-sources/sources/social-logins/apple/index.md
@@ -1,9 +1,8 @@
 ---
 title: Apple
+support_level: authentik
 ---

-<span class="badge badge--primary">Support level: authentik</span>
-
 Allows users to authenticate using their Apple ID.

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/azure-ad/index.mdx
+++ b/website/docs/users-sources/sources/social-logins/azure-ad/index.mdx
@@ -1,9 +1,8 @@
 ---
 title: Azure AD
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 ## Preparation

 The following placeholders are used in this guide:
@@ -112,9 +111,9 @@ return True

 Try to login with a **_new_** user. You should see no prompts and the user should have the correct information.

-### Machine-to-machine authentication <span class="badge badge--version">authentik 2024.12+</span>
+### Machine-to-machine authentication:ak-version[2024.12]

-If using [Machine-to-Machine](../../../../add-secure-apps/providers/oauth2/client_credentials.md#jwt-authentication) authentication, some specific steps need to be considered.
+If using [Machine-to-Machine](../../../../add-secure-apps/providers/oauth2/client_credentials.mdx#jwt-authentication) authentication, some specific steps need to be considered.

 When getting the JWT token from Azure AD, set the scope to the Application ID URI, and _not_ the Graph URL; otherwise the JWT will be in an invalid format.

--- a/website/docs/users-sources/sources/social-logins/discord/index.md
+++ b/website/docs/users-sources/sources/social-logins/discord/index.md
@@ -1,9 +1,8 @@
 ---
 title: Discord
+support_level: authentik
 ---

-<span class="badge badge--primary">Support level: authentik</span>
-
 Allows users to authenticate using their Discord credentials

 ## Preparation
@@ -162,13 +161,13 @@ Ensure that the Discord OAuth source in **Federation & Social login** has the ad
 :::

 :::info
-Any authentik role that you want to sync with a Discord role needs to have the **attribute** `discord_role_id` with a value of the Discord role's ID set.  
-This setting can be found under `Authentik > Admin Interface > Directory > Groups > YOUR_GROUP > Attributes`  
+Any authentik role that you want to sync with a Discord role needs to have the **attribute** `discord_role_id` with a value of the Discord role's ID set.
+This setting can be found under `Authentik > Admin Interface > Directory > Groups > YOUR_GROUP > Attributes`
 Example: `discord_role_id: "<ROLE ID>"`
 :::

-The following two policies allow you to synchronize roles in a Discord guild with roles in authentik.  
-Whenever a user enrolls or signs in to authentik via a Discord source, these policies will check the user's Discord roles and apply the user's authentik roles accordingly.  
+The following two policies allow you to synchronize roles in a Discord guild with roles in authentik.
+Whenever a user enrolls or signs in to authentik via a Discord source, these policies will check the user's Discord roles and apply the user's authentik roles accordingly.
 All roles with the attribute `discord_role_id` defined will be added or removed depending on whether the user is a member of the defined Discord role.

 Create a new **Expression Policy** with the content below, adjusting the variables where required.
--- a/website/docs/users-sources/sources/social-logins/facebook/index.md
+++ b/website/docs/users-sources/sources/social-logins/facebook/index.md
@@ -1,9 +1,8 @@
 ---
 title: Facebook
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 Adding Facebook as a source allows users to authenticate through authentik using their Facebook credentials.

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/github/index.mdx
+++ b/website/docs/users-sources/sources/social-logins/github/index.mdx
@@ -1,9 +1,8 @@
 ---
 title: Github
+support_level: authentik
 ---

-<span class="badge badge--primary">Support level: authentik</span>
-
 Allows users to authenticate using their Github credentials

 ## Preparation
@@ -50,7 +49,7 @@ Save, and you now have Github as a source.
 For more details on how-to have the new source display on the Login Page see [here](../../index.md#add-sources-to-default-login-page).
 :::

-### Checking for membership of a GitHub Organisation <span class="badge badge--version">authentik 2021.12.5.+</span>
+### Checking for membership of a GitHub Organisation

 To check if the user is member of an organisation, you can use the following policy on your flows:

--- a/website/docs/users-sources/sources/social-logins/google/cloud/index.md
+++ b/website/docs/users-sources/sources/social-logins/google/cloud/index.md
@@ -2,10 +2,9 @@
 title: Google Cloud (with OAuth)
 sidebar_label: Google Cloud (OAuth)
 tags: [integration, oauth, google]
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 Allows users to authenticate using their Google credentials

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/google/workspace/index.md
+++ b/website/docs/users-sources/sources/social-logins/google/workspace/index.md
@@ -2,10 +2,9 @@
 title: Google Workspace (with SAML)
 sidebar_label: Google Workspace (SAML)
 tags: [integration, saml, google]
+support_level: authentik
 ---

-<span className="badge badge--primary">Support level: authentik</span>
-
 This topic covers configuring authentik to authenticate users with their Google Workspace credentials.

 ## What is Google Workspace?
--- a/website/docs/users-sources/sources/social-logins/mailcow/index.md
+++ b/website/docs/users-sources/sources/social-logins/mailcow/index.md
@@ -1,9 +1,8 @@
 ---
 title: Mailcow
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 Allows users to authenticate using their Mailcow credentials

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/plex/index.md
+++ b/website/docs/users-sources/sources/social-logins/plex/index.md
@@ -1,9 +1,8 @@
 ---
 title: Plex
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 Allows users to authenticate using their Plex credentials

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/twitch/index.md
+++ b/website/docs/users-sources/sources/social-logins/twitch/index.md
@@ -1,9 +1,8 @@
 ---
 title: Twitch
+support_level: community
 ---

-<span class="badge badge--secondary">Support level: Community</span>
-
 Allows users to authenticate using their Twitch credentials

 ## Preparation
--- a/website/docs/users-sources/sources/social-logins/twitter/index.md
+++ b/website/docs/users-sources/sources/social-logins/twitter/index.md
@@ -1,9 +1,8 @@
 ---
 title: Twitter
+support_level: authentik
 ---

-<span class="badge badge--primary">Support level: authentik</span>
-
 Allows users to authenticate using their twitter credentials

 ## Preparation