Add the SSO badge for the new, paid add-on (#2341)

* Fix enterprise badge color

* Add SSO badge

docusaurus/docs/dev-docs/configurations.md

@@ -45,7 +45,7 @@ Some specific features require additional configuration:
 | [Lifecycle functions](/dev-docs/configurations/functions) | In the `/src/index` file | Optionally used to perform various actions that happen during the server lifecycle. Includes the `register`, `bootstrap`, and `destroy` functions. |
 | [Cron jobs](/dev-docs/configurations/cron) | <ul><li>In the `/config/server` file to enable the feature</li><li>In a dedicated, optional `cron-tasks` file that can be used to declare the jobs</li></ul> | Required to setup CRON jobs for the server. |
 | [Environment variables](/dev-docs/configurations/environment) | In dedicated files and folders for the environment (e.g., `config/env/production/server`) | Optionally used to define different environments and their variables. |
-| [Single Sign-On (SSO)](/dev-docs/configurations/sso) <EnterpriseBadge /> | In the `config/admin` file | Required to use the Entreprise-only SSO feature if enabled on your project. |
+| [Single Sign-On (SSO)](/dev-docs/configurations/sso) <EnterpriseBadge /> <SsoBadge /> | In the `config/admin` file | Required to use the SSO feature if enabled on your project. |
 | [Feature flags](/dev-docs/configurations/features) | In the `config/features` file | Optional for a typical, stable Strapi application.<br/>Only required to enable [future flags](/dev-docs/configurations/features).|
 
 ## Guides

docusaurus/docs/dev-docs/configurations/admin-panel.md

@@ -28,8 +28,8 @@ The `./config/admin.js` file can include the following parameters:
 | `auditLogs.retentionDays`         | How long [Audit Logs](/user-docs/settings/audit-logs) are kept, in days.<br /><br />_The behavior differs for self-hosted vs. Strapi Cloud customers, see the note under the table._               | integer       | 90                                                                                                                                  |
 | `auth`                            | Authentication configuration                                                                                                                                                                       | object        | -                                                                                                                                   |
 | `auth.secret`                     | Secret used to encode JWT tokens                                                                                                                                                                   | string        | `undefined`                                                                                                                         |
-| `auth.domain`                     | Domain used within the cookie for SSO authentication (Enterprise only)                                                                                                                             | string        | `undefined`                                                                                                                         |
-| `auth.providers`                  | List of authentication providers used for SSO (Enterprise only, see [SSO](/dev-docs/configurations/sso))                                                                                           | array(object) | -                                                                                                                                   |
+| `auth.domain`                     | Domain used within the cookie for SSO authentication <EnterpriseBadge /> <SsoBadge /> | string        | `undefined`                                                                                                                         |
+| `auth.providers`                  | List of authentication providers used for SSO (see [SSO](/dev-docs/configurations/sso)) <EnterpriseBadge /> <SsoBadge />                                                                                         | array(object) | -                                                                                                                                   |
 | `auth.options`                    | Options object passed to [jsonwebtoken](https://www.npmjs.com/package/jsonwebtoken)                                                                                                                | object        | -                                                                                                                                   |
 | `auth.options.expiresIn`          | JWT expire time used in [jsonwebtoken](https://www.npmjs.com/package/jsonwebtoken)                                                                                                                 | object        | `30d`                                                                                                                               |
 | `auth.events`                     | Record of all the events subscribers registered for the authentication                                                                                                                             | object        | `{}`                                                                                                                                |

docusaurus/docs/dev-docs/configurations/sso.md

@@ -13,14 +13,14 @@ tags:
 ---
 
 # Single Sign-On
-<EnterpriseBadge/>
+<EnterpriseBadge/> <SsoBadge />
 
 Single Sign-On on Strapi allows you to configure additional sign-in and sign-up methods for your administration panel.
 
 :::prerequisites
 
 - A Strapi application running on version 3.5.0 or higher is required.
-- To configure SSO on your application, you will need an <EnterpriseBadge /> plan.
+- To configure SSO on your application, you will need an <EnterpriseBadge /> plan or the <SsoBadge /> add-on.
 - Make sure the SSO feature is [enabled in the admin panel](/user-docs/settings/single-sign-on).
 - Make sure Strapi is part of the applications you can access with your provider. For example, with Microsoft (Azure) Active Directory, you must first ask someone with the right permissions to add Strapi to the list of allowed applications. Please refer to your provider(s) documentation to learn more about that.
 :::

docusaurus/docs/user-docs/getting-started/setting-up-admin-panel.md

@@ -34,7 +34,7 @@ To access the admin panel:
 3. Click on the **Login** button. You should be redirected to the homepage of the admin panel.
 
 ### Using SSO for authentication
-<EnterpriseBadge />
+<EnterpriseBadge /> <SsoBadge />
 
 If your Strapi application was configured to allow authentication through SSO (see [Configuring Single Sign-On](/user-docs/settings/single-sign-on)), you can access the admin panel using a specific provider instead of logging in with a regular Strapi administrator account.
 

docusaurus/docs/user-docs/settings/single-sign-on.md

@@ -8,7 +8,7 @@ tags:
 ---
 
 # Configuring Single Sign-On (SSO)
-<EnterpriseBadge />
+<EnterpriseBadge /> <SsoBadge />
 
 Single Sign-On (SSO) can be made available on a Strapi application to allow administrators to authenticate through an identity provider (e.g. Microsoft Azure Active Directory). SSO configurations can be done from ![Settings icon](/img/assets/icons/v5/Cog.svg) *Settings > Global settings > Single Sign-On*.
 

docusaurus/docs/user-docs/users-roles-permissions/configuring-administrator-roles.md

@@ -137,7 +137,7 @@ Settings permissions can be configured for all settings accessible from *General
 | Media Library | <ul><li>General</li><ul><li>"Access the Media Library settings page" - gives access to Media Library settings</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to Media Library settings: <br /> *General > Settings > Global Settings - Media Library* |
 | Internationalization | <ul><li>Locales</li><ul><li>"Create" - allows to create new locales</li><li>"Read" - allows to see available locales</li><li>"Update" - allows to edit available locales</li><li>"Delete" - allows to delete locales</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to the Internationalization settings: <br /> *General > Settings > Global Settings - Internationalization* |
 | Review Workflows <EnterpriseBadge /> | <ul><li>"Create" - allows to create workflows</li><li>"Read" - allows to see created workflows</li><li>"Update" - allows to edit workflows</li><li>"Delete" - allows to delete workflows</li></ul> <Icon name="arrow-fat-right" />  Path reminder to Review workflows settings: <br /> *General > Settings > Global Settings - Review workflows* |
-| Single sign on <EnterpriseBadge /> | <ul><li>Options</li><ul><li>"Read" - allows to access the SSO settings</li><li>"Update" - allows to edit the SSO settings</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to the SSO settings: <br />*General > Settings > Global Settings - Single Sign-On* |
+| Single sign on <EnterpriseBadge /> <SsoBadge /> | <ul><li>Options</li><ul><li>"Read" - allows to access the SSO settings</li><li>"Update" - allows to edit the SSO settings</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to the SSO settings: <br />*General > Settings > Global Settings - Single Sign-On* |
 | Audit Logs | <ul><li>Options</li><ul><li>"Read" - allows to access the Audit Logs settings</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to the Audit Logs settings: <br />*General > Settings > Admin Panel - Audit Logs* |
 | Plugins and Marketplace | <ul><li>Marketplace</li><ul><li>"Access the Marketplace" - gives access to the Marketplace</li></ul></ul> |
 | Webhooks | <ul><li>General</li><ul><li>"Create" - allows to create webhooks</li><li>"Read" - allows to see created webhooks</li><li>"Update" - allows to edit webhooks</li><li>"Delete" - allows to delete webhooks</li></ul></ul> <Icon name="arrow-fat-right" />  Path reminder to Webhook settings: <br /> *General > Settings > Global Settings - Webhook* |

docusaurus/src/components/Badge.js

@@ -108,6 +108,18 @@ export function GrowthBadge(props) {
   );
 }
 
+export function SsoBadge(props) {
+  return (
+    <Badge
+      variant="SSO"
+      link="https://strapi.io/pricing-self-hosted"
+      icon="feather"
+      tooltip="This feature is available with the SSO add-on."
+      {...props}
+    />
+  );
+}
+
 export function CloudProBadge(props) {
   return (
     <Badge

docusaurus/src/scss/_tokens.scss

@@ -94,6 +94,9 @@
   --strapi-alternative-150: #E9D8F4;
   --strapi-alternative-100: #F6ECFC;
 
+  /** Used for SSO add-on badge */
+  --strapi-purple: #AC56F5;
+
   /** Color: Code */
   --strapi-code-fluo-green: #50FA7B;
   --strapi-code-green: #50FA7B;

docusaurus/src/scss/badge.scss

@@ -163,6 +163,17 @@
     --custom-badge-tooltip-color: var(--custom-badge-background-color);
   }
 
+  &--sso {
+    --custom-badge-background-color: var(--strapi-purple);
+    --custom-badge-color: var(--strapi-neutral-0);
+    --custom-badge-border-color: var(--strapi-purple);
+    --custom-badge-tooltip-background-color: var(--custom-badge-background-color);
+
+    a {
+      color: inherit;
+    }
+  }
+
   &--pro {
     --custom-badge-background-color: var(--strapi-primary-600);
     --custom-badge-color: #fff;
@@ -271,6 +282,7 @@ main .badge--team,
 main .badge--pro,
 main .badge--enterprise,
 main .badge--growth,
+main .badge--sso,
 main .badge--version {
   .badge__tooltip {
     @include badge-tooltip();

docusaurus/src/theme/MDXComponents.js

@@ -18,7 +18,7 @@ import FeedbackPlaceholder from '../components/FeedbackPlaceholder';
 import CustomDocCard from '../components/CustomDocCard';
 import CustomDocCardsWrapper from '../components/CustomDocCardsWrapper';
 import { InteractiveQueryBuilder } from '../components/InteractiveQueryBuilder/InteractiveQueryBuilder';
-import { AlphaBadge, BetaBadge, FeatureFlagBadge, EnterpriseBadge, GrowthBadge, CloudDevBadge, CloudProBadge, CloudTeamBadge, NewBadge, UpdatedBadge, VersionBadge } from '../components/Badge';
+import { AlphaBadge, BetaBadge, FeatureFlagBadge, EnterpriseBadge, GrowthBadge, SsoBadge, CloudDevBadge, CloudProBadge, CloudTeamBadge, NewBadge, UpdatedBadge, VersionBadge } from '../components/Badge';
 import { SideBySideColumn, SideBySideContainer } from '../components';
 import ThemedImage from '@theme/ThemedImage';
 import {
@@ -52,6 +52,7 @@ export default {
   FeatureFlagBadge,
   EnterpriseBadge,
   GrowthBadge,
+  SsoBadge,
   NewBadge,
   UpdatedBadge,
   CloudDevBadge,