From c3f50d1f123eb2fc3ce286bff46761509b8cb49c Mon Sep 17 00:00:00 2001
From: Georges-Antoine Assi <contact@me.gantoine.com>
Date: Mon, 23 Dec 2024 09:28:00 -0500
Subject: [PATCH] Add oidc provider name and icon to login page

---
 backend/config/__init__.py                    |  1 +
 backend/decorators/auth.py                    |  2 ++
 backend/endpoints/heartbeat.py                |  6 +++++-
 backend/endpoints/responses/heartbeat.py      |  1 +
 env.template                                  |  1 +
 frontend/src/__generated__/models/OIDCDict.ts |  1 +
 frontend/src/views/Auth/Login.vue             | 15 +++++++++++++--
 7 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/backend/config/__init__.py b/backend/config/__init__.py
index c733efbd2..84ef5e787 100644
--- a/backend/config/__init__.py
+++ b/backend/config/__init__.py
@@ -78,6 +78,7 @@ DISABLE_DOWNLOAD_ENDPOINT_AUTH = str_to_bool(
 
 # OIDC
 OIDC_ENABLED: Final = str_to_bool(os.environ.get("OIDC_ENABLED", "false"))
+OICD_PROVIDER: Final = os.environ.get("OICD_PROVIDER", "")
 OIDC_CLIENT_ID: Final = os.environ.get("OIDC_CLIENT_ID", "")
 OIDC_CLIENT_SECRET: Final = os.environ.get("OIDC_CLIENT_SECRET", "")
 OIDC_REDIRECT_URI: Final = os.environ.get("OIDC_REDIRECT_URI", "")
diff --git a/backend/decorators/auth.py b/backend/decorators/auth.py
index 25cfa0f72..de005a17a 100644
--- a/backend/decorators/auth.py
+++ b/backend/decorators/auth.py
@@ -2,6 +2,7 @@ from typing import Any
 
 from authlib.integrations.starlette_client import OAuth
 from config import (
+    OICD_PROVIDER,
     OIDC_CLIENT_ID,
     OIDC_CLIENT_SECRET,
     OIDC_ENABLED,
@@ -36,6 +37,7 @@ oauth2_password_bearer = OAuth2PasswordBearer(
 config = Config(
     environ={
         "OIDC_ENABLED": str(OIDC_ENABLED),
+        "OICD_PROVIDER": OICD_PROVIDER,
         "OIDC_CLIENT_ID": OIDC_CLIENT_ID,
         "OIDC_CLIENT_SECRET": OIDC_CLIENT_SECRET,
         "OIDC_REDIRECT_URI": OIDC_REDIRECT_URI,
diff --git a/backend/endpoints/heartbeat.py b/backend/endpoints/heartbeat.py
index 2b542fce5..6cb467512 100644
--- a/backend/endpoints/heartbeat.py
+++ b/backend/endpoints/heartbeat.py
@@ -4,6 +4,7 @@ from config import (
     ENABLE_RESCAN_ON_FILESYSTEM_CHANGE,
     ENABLE_SCHEDULED_RESCAN,
     ENABLE_SCHEDULED_UPDATE_SWITCH_TITLEDB,
+    OICD_PROVIDER,
     OIDC_ENABLED,
     RESCAN_ON_FILESYSTEM_CHANGE_DELAY,
     SCHEDULED_RESCAN_CRON,
@@ -64,5 +65,8 @@ def heartbeat() -> HeartbeatResponse:
             "DISABLE_RUFFLE_RS": DISABLE_RUFFLE_RS,
         },
         "FRONTEND": {"UPLOAD_TIMEOUT": UPLOAD_TIMEOUT},
-        "OIDC": {"ENABLED": OIDC_ENABLED},
+        "OIDC": {
+            "ENABLED": OIDC_ENABLED,
+            "PROVIDER": OICD_PROVIDER,
+        },
     }
diff --git a/backend/endpoints/responses/heartbeat.py b/backend/endpoints/responses/heartbeat.py
index 306f4f1ed..7f7d83946 100644
--- a/backend/endpoints/responses/heartbeat.py
+++ b/backend/endpoints/responses/heartbeat.py
@@ -33,6 +33,7 @@ class FrontendDict(TypedDict):
 
 class OIDCDict(TypedDict):
     ENABLED: bool
+    PROVIDER: str
 
 
 class HeartbeatResponse(TypedDict):
diff --git a/env.template b/env.template
index ac8959ceb..16ec26986 100644
--- a/env.template
+++ b/env.template
@@ -36,6 +36,7 @@ AUTHENTIK_BOOTSTRAP_PASSWORD=
 # Authentication
 ROMM_AUTH_SECRET_KEY=
 OIDC_ENABLED=
+OICD_PROVIDER=
 OIDC_CLIENT_ID=
 OIDC_CLIENT_SECRET=
 OIDC_REDIRECT_URI=
diff --git a/frontend/src/__generated__/models/OIDCDict.ts b/frontend/src/__generated__/models/OIDCDict.ts
index 985108703..965bba101 100644
--- a/frontend/src/__generated__/models/OIDCDict.ts
+++ b/frontend/src/__generated__/models/OIDCDict.ts
@@ -5,5 +5,6 @@
 
 export type OIDCDict = {
     ENABLED: boolean;
+    PROVIDER: string;
 };
 
diff --git a/frontend/src/views/Auth/Login.vue b/frontend/src/views/Auth/Login.vue
index 21b1aeb33..95023bbb2 100644
--- a/frontend/src/views/Auth/Login.vue
+++ b/frontend/src/views/Auth/Login.vue
@@ -111,10 +111,21 @@ async function loginOIDC() {
             v-if="heartbeatStore.value.OIDC.ENABLED"
             :loading="loggingIn"
             :variant="'text'"
-            class="bg-terciary"
+            class="bg-terciary mt-2"
             @click="loginOIDC()"
           >
-            <span>Login with OIDC</span>
+            <span class="pt-1">
+              <v-avatar size="20" class="mr-1">
+                <v-img
+                  v-if="heartbeatStore.value.OIDC.PROVIDER"
+                  :src="`https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${heartbeatStore.value.OIDC.PROVIDER}.png`"
+                  class="fill-height"
+                >
+                  <template #error> </template>
+                </v-img>
+              </v-avatar>
+              Login with {{ heartbeatStore.value.OIDC.PROVIDER || "OIDC" }}
+            </span>
             <template #append>
               <v-icon class="text-romm-accent-1"
                 >mdi-chevron-right-circle-outline</v-icon