Merge pull request #286 from sebadob/ext_auth_provider_foundation

Upstream Auth Providers Part 1
sebadob · Mar 15, 2024 · fc4d39b · fc4d39b
2 parents a7b3ac1 + 826b2f3
commit fc4d39b
Show file tree

Hide file tree

Showing 23 changed files with 1,408 additions and 696 deletions.
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -33,6 +33,7 @@ The most important thing to compile the code is obviously `rust` and `cargo`. Th
 - `docker` available, if you want to build images
 - [just](https://github.com/casey/just) installed
 - BASH (no cmd.exe or powershell) - when you are on windows, you can use something like Git BASH
+- For building the UI `just build-ui`, you need [sd](https://crates.io/crates/sd): `cargo install sd`
 
 ### Get it up and running
 

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/src/components/admin/AdminMain.svelte b/frontend/src/components/admin/AdminMain.svelte
@@ -30,6 +30,8 @@
     import ApiKeys from "./api_keys/ApiKeys.svelte";
     import EventsArchive from "./events/EventsArchive.svelte";
     import IconBellAlert from "$lib/icons/IconBellAlert.svelte";
+    import IconCloud from "$lib/icons/IconCloud.svelte";
+    import Providers from "./providers/Providers.svelte";
 
     export let selected = 'Users';
 
@@ -97,6 +99,11 @@
                 title = 'ApiKeys';
                 break;
             }
+            case 'Providers': {
+                window.history.pushState('Providers', '', '/auth/v1/admin/providers');
+                title = 'Providers';
+                break;
+            }
             case 'Config': {
                 window.history.pushState('Config', '', '/auth/v1/admin/config');
                 title = 'Config';
@@ -114,13 +121,10 @@
     }
 
     onMount(() => {
-        window.addEventListener('popstate', (event) => {
-            selected = event.state;
-        });
-
+        window.addEventListener('popstate', setSelected);
         calcWidths(window.innerWidth);
 
-        return () => window.removeEventListener('popstate');
+        return () => window.removeEventListener('popstate', setSelected);
     });
 
     function calcWidths(innerWidth) {
@@ -129,6 +133,10 @@
         eventsWide = innerWidth > 1450;
     }
 
+    function setSelected(event) {
+        selected = event.state;
+    }
+
 </script>
 
 <svelte:window bind:innerWidth/>
@@ -183,11 +191,15 @@
             </NavEntry>
 
             <NavEntry label="Blacklist">
-                <IconStop width={24} />
+                <IconStop width={24}/>
             </NavEntry>
 
             <NavEntry label="ApiKeys">
-                <IconKey />
+                <IconKey/>
+            </NavEntry>
+
+            <NavEntry label="Providers">
+                <IconCloud/>
             </NavEntry>
 
             <NavEntry label="Config">
@@ -245,6 +257,10 @@
             <ContentWrapper bind:eventsWide bind:eventsCollapsed>
                 <ApiKeys/>
             </ContentWrapper>
+        {:else if 'Providers' === selected}
+            <ContentWrapper bind:eventsWide bind:eventsCollapsed>
+                <Providers/>
+            </ContentWrapper>
         {:else if 'Config' === selected}
             <ContentWrapper bind:eventsWide bind:eventsCollapsed>
                 <Config/>
@@ -256,7 +272,7 @@
         {/if}
 
         {#if innerWidth !== undefined }
-            <Events collapsed={eventsCollapsed} wide={eventsWide} />
+            <Events collapsed={eventsCollapsed} wide={eventsWide}/>
         {/if}
     </div>
 </main>

diff --git a/frontend/src/components/admin/AdminMainPre.svelte b/frontend/src/components/admin/AdminMainPre.svelte
@@ -22,7 +22,7 @@
             if (resAdmin.ok) {
                 sessionInfo = body;
                 isAdmin = true;
-            } else if (resAdmin.status === 406 ) {
+            } else if (resAdmin.status === 406) {
                 mfaReqErr = true;
                 sessionInfo = {};
             } else {
@@ -60,7 +60,7 @@
             <Button on:click={() => window.location.href = '/auth/v1/'}>GO BACK</Button>
         </div>
     {:else}
-        <AdminMain bind:sessionInfo bind:selected/>
+        <AdminMain bind:selected/>
     {/if}
 </BrowserCheck>