Adjusted OIDC template, continue working on building client side app

src/dashboard.py

@@ -1127,7 +1127,7 @@ class Locale:
     
     def updateLanguage(self, lang_id):
         if not os.path.exists(os.path.join(f"{self.localePath}{lang_id}.json")):
-            DashboardConfig.SetConfig("Server", "dashboard_language", "en")
+            DashboardConfig.SetConfig("Server", "dashboard_language", "en-US")
         else:
             DashboardConfig.SetConfig("Server", "dashboard_language", lang_id)
         

src/modules/DashboardClients.py

@@ -21,7 +21,7 @@ class DashboardClients:
         self.logger = DashboardLogger()
         self.engine = db.create_engine(ConnectionString("wgdashboard"))
         self.metadata = db.MetaData()
-        self.OIDC = DashboardOIDC()
+        self.OIDC = DashboardOIDC("Client")
         
         self.dashboardClientsTable = db.Table(
             'DashboardClients', self.metadata,

src/modules/DashboardConfig.py

@@ -23,7 +23,7 @@ class DashboardConfig:
     def __init__(self):
         if not os.path.exists(DashboardConfig.ConfigurationFilePath):
             open(DashboardConfig.ConfigurationFilePath, "x")
-        self.__config = configparser.ConfigParser(strict=False)
+        self.__config = configparser.RawConfigParser(strict=False)
         self.__config.read_file(open(DashboardConfig.ConfigurationFilePath, "r+"))
         self.hiddenAttribute = ["totp_key", "auth_req"]
         self.__default = {
@@ -76,6 +76,10 @@ class DashboardConfig:
                 "send_from": "",
                 "email_template": ""
             },
+            "OIDC": {
+                "admin_enable": "false",
+                "client_enable": "false"
+            },
             "WireGuardConfiguration": {
                 "autostart": ""
             }
@@ -236,7 +240,7 @@ class DashboardConfig:
             elif type(value) is list:
                 self.__config[section][key] = "||".join(value).strip("||")
             else:
-                self.__config[section][key] = value
+                self.__config[section][key] = fr"{value}"
             return self.SaveConfig(), ""
         else:
             return False, f"{key} does not exist under {section}"

src/modules/DashboardOIDC.py

@@ -8,15 +8,25 @@ from flask import current_app
 class DashboardOIDC:
     ConfigurationPath = os.getenv('CONFIGURATION_PATH', '.')
     ConfigurationFilePath = os.path.join(ConfigurationPath, 'wg-dashboard-oidc-providers.json')
-    def __init__(self):
+    def __init__(self, mode):
+        self.mode = mode
         self.providers: dict[str, dict] = {}
         self.provider_secret: dict[str, str] = {}
         self.__default = {
+            "Admin": {
                 'Provider': {
                     'client_id': '',
                     'client_secret': '',
                     'issuer': '',
                 },
+            },
+            "Client": {
+                'Provider': {
+                    'client_id': '',
+                    'client_secret': '',
+                    'issuer': '',
+                },
+            }
         }
         
         if not os.path.exists(DashboardOIDC.ConfigurationFilePath):
@@ -109,6 +119,7 @@ class DashboardOIDC:
             providers = decoder.decode(
                 open(DashboardOIDC.ConfigurationFilePath, 'r').read()
             )
+            providers = providers[self.mode]
             for k in providers.keys():
                 if all([providers[k]['client_id'], providers[k]['client_secret'], providers[k]['issuer']]):
                     try:

src/static/app/src/components/clientComponents/clientProfile.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

src/static/app/src/components/clientComponents/clientSettings.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+import LocaleText from "@/components/text/localeText.vue";
+const emits = defineEmits(['close'])
+
+</script>
+
+<template>
+<div class="position-absolute w-100 h-100 top-0 start-0 z-1 rounded-3 d-flex p-2" style="background-color: #00000070;">
+	<div class="card m-auto rounded-3" style="width: 700px">
+		<div class="card-header bg-transparent d-flex align-items-center gap-2 border-0 p-4 pb-2">
+			<h4 class="mb-0">
+				<LocaleText t="Clients Settings"></LocaleText>
+			</h4>
+			<button type="button" class="btn-close ms-auto" @click="emits('close')"></button>
+		</div>
+		<div class="card-body px-4">
+			<div class="py-2">
+				<h6>
+					<LocaleText t="OpenID Connect (OIDC)"></LocaleText>
+				</h6>
+				<hr>
+				<div class="form-check form-switch">
+					<label class="form-check-label" for="oidc_switch">
+						<LocaleText t="Enable"></LocaleText>
+					</label>
+					<input class="form-check-input" type="checkbox" role="switch" id="oidc_switch">
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+</template>
+
+<style scoped>
+
+</style>

src/static/app/src/router/router.js

@@ -91,7 +91,10 @@ const router = createRouter({
 						{
 							name: "Client Viewer",
 							path: ':id',
-							component: () => import('@/components/clientComponents/clientViewer.vue')
+							component: () => import('@/components/clientComponents/clientViewer.vue'),
+							meta: {
+								title: "Clients"
+							},
 						}
 					]
 				},
@@ -155,11 +158,9 @@ router.beforeEach(async (to, from, next) => {
 	const dashboardConfigurationStore = DashboardConfigurationStore();
 
 	if (to.meta.title){
-		if (to.params.id){
-			document.title = to.params.id + " | WGDashboard";
-		}else{
 		document.title = to.meta.title + " | WGDashboard";
-		}
+	}else if(to.params.id){
+		document.title = to.params.id + " | WGDashboard";
 	}else{
 		document.title = "WGDashboard"
 	}

src/static/app/src/views/clients.vue

@@ -7,13 +7,14 @@ import {GetLocale} from "@/utilities/locale.js";
 import ClientGroup from "@/components/clientComponents/clientGroup.vue";
 import { fetchGet } from "@/utilities/fetch.js"
 import {useRoute} from "vue-router";
+import ClientSettings from "@/components/clientComponents/clientSettings.vue";
 
 await assignmentStore.getClients();
 assignmentStore.getAllConfigurationsPeers();
 
 const searchString = ref("")
 const route = useRoute()
-
+const settings = ref(false)
 const oidc = computed(() => {
 	return Object.fromEntries(
 		Object.entries(assignmentStore.clients).filter(
@@ -24,8 +25,12 @@ const oidc = computed(() => {
 </script>
 
 <template>
-	<div class="text-body w-100 h-100 pb-2">
+	<div class="text-body w-100 h-100 pb-2 position-relative">
+
 		<div class="w-100 h-100 card rounded-3">
+			<Transition name="zoom">
+				<ClientSettings v-if="settings"></ClientSettings>
+			</Transition>
 			<div class="border-bottom z-0">
 				<div class="d-flex text-body align-items-center sticky-top p-3 bg-body-tertiary rounded-top-3" style="border-top-right-radius: 0 !important;">
 					<label for="searchClient"><i class="bi bi-search me-2"></i></label>
@@ -35,7 +40,7 @@ const oidc = computed(() => {
 						class="form-control rounded-3 form-control-sm"
 						:placeholder="GetLocale('Search Clients...')"
 						type="email" style="width: auto;">
-					<button class="btn btn-body ms-auto bg-body-secondary rounded-3 btn-sm">
+					<button class="btn btn-body ms-auto bg-body-secondary rounded-3 btn-sm" @click="settings = !settings">
 						<i class="bi bi-gear-fill me-2"></i>
 						<LocaleText t="Settings"></LocaleText>
 					</button>