From e87ed858674e5839a43430f0d4bc8b5e38c009a3 Mon Sep 17 00:00:00 2001
From: "Torsten Schulz (local)" <tsschulz@gmx.net>
Date: Fri, 15 May 2026 16:05:08 +0200
Subject: [PATCH] fix(home): show only configured OAuth providers in intro copy

---
 frontend/src/views/home/NoLoginView.vue | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/frontend/src/views/home/NoLoginView.vue b/frontend/src/views/home/NoLoginView.vue
index 6cce4d5..33a2ef4 100644
--- a/frontend/src/views/home/NoLoginView.vue
+++ b/frontend/src/views/home/NoLoginView.vue
@@ -62,7 +62,7 @@
                         <div class="oauth-section" v-if="oauthProviders.length">
                             <div class="oauth-section__header">
                                 <span class="panel-kicker">Externe Konten</span>
-                                <p class="oauth-section__text">Google, Microsoft, Keycloak, ORY oder ZITADEL nutzen.</p>
+                                <p class="oauth-section__text">{{ formattedOAuthProviders }}</p>
                             </div>
                             <div class="oauth-provider-list">
                                 <button
@@ -230,6 +230,23 @@ export default {
             }
         }
     },
+    computed: {
+        formattedOAuthProviders() {
+            if (!this.oauthProviders || !this.oauthProviders.length) return '';
+            try {
+                const labels = this.oauthProviders.map(p => p.label);
+                if (typeof Intl !== 'undefined' && Intl.ListFormat) {
+                    const lf = new Intl.ListFormat(this.$i18n?.locale || 'de', { style: 'long', type: 'conjunction' });
+                    return lf.format(labels);
+                }
+                if (labels.length === 1) return labels[0];
+                if (labels.length === 2) return `${labels[0]} oder ${labels[1]}`;
+                return `${labels.slice(0, -1).join(', ')} oder ${labels[labels.length - 1]}`;
+            } catch (_) {
+                return this.oauthProviders.map(p => p.label).join(', ');
+            }
+        }
+    },
     async created() {
         await this.loadOAuthProviders();
     },