website/integration: update harbor integration document (#13816)

* Updates harbor integration doc to new template and fixes reported issue

* typo

Signed-off-by: Dewi Roberts <dewi@goauthentik.io>

---------

Signed-off-by: Dewi Roberts <dewi@goauthentik.io>

website/integrations/services/harbor/index.md

@@ -33,13 +33,39 @@ To support the integration of Harbor with authentik, you need to create an appli
 - **Application**: provide a descriptive name, an optional group for the type of application, the policy engine mode, and optional UI settings.
 - **Choose a Provider type**: select **OAuth2/OpenID Connect** as the provider type.
 - **Configure the Provider**: provide a name (or accept the auto-provided name), the authorization flow to use for this provider, and the following required configurations.
-    - Note the **Client ID**,**Client Secret**, and **slug** values because they will be required later.
-    - Set a `Strict` redirect URI to <kbd>https://<em>harbor.company</em>/c/oidc/callback/</kbd>.
-    - Select any available signing key.
+
+    - **Protocol Settings**:
+        - **Redirect URI**:
+            - Strict: <kbd>https://<em>harbor.company</em>/c/oidc/callback/</kbd>.
+        - **Signing Key**: select any available signing key.
+    - **Advanced Protocol Settings**:
+        - **Scopes**: add `authentik default OAuth Mapping: OpenID 'offline_access'` to **Selected Scopes**.
+
 - **Configure Bindings** _(optional)_: you can create a [binding](/docs/add-secure-apps/flows-stages/bindings/) (policy, group, or user) to manage the listing and access to applications on a user's **My applications** page.
 
 3. Click **Submit** to save the new application and provider.
 
-## Harbor
+## Harbor configuration
 
-![](./harbor.png)
+To support the integration of authentik with Harbor, you need to configure OIDC authentication.
+
+1. Login to the Harbor dashboard as an admin.
+2. Navigate to **Configuration** and select the **Authentication** tab.
+3. In the **Auth Mode** dropdown, select **OIDC** and provide the following required configurations.
+
+    - **OIDC Provider Name**: `authentik`
+    - **OIDC Endpoint**: <kbd>https://<em>authentik.company</em>/application/o/<em>harbor</em></kbd>
+    - **OIDC Client ID**: <em>client ID from authentik</em>
+    - **OIDC Client Secret**: <em>client secret from authentik</em>
+    - **OIDC Scope**: `openid,profile,email,offline_access`
+    - **Username Claim**: `preferred_username`
+
+4. Click **Save**.
+
+:::note
+If you are experiencing redirect errors, ensure that you have set the `hostname` and `external_url` fields in your `harbor.yml` file and run the `setup.sh` script.
+:::
+
+## Configuration verification
+
+To confirm that authentik is properly configured with Harbor, log out of Harbor, locate the "LOGIN VIA OIDC PROVIDER" button on the login page, click on it, and ensure you can successfully log in using Single Sign-On.