tomas/pocketbase
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[#746] added microsoft oauth2 provider

Browse Source
This commit is contained in:
Gani Georgiev
2022-10-31 21:17:10 +02:00
parent bcb9c22685
commit 5298543ce4
41 changed files with 279 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/components/records/ExternalAuthsList.svelte
+1 -1
View File
@@ -14,7 +14,7 @@
let isLoading = false;
function getProviderTitle(provider) {
return providersList[provider + "Auth"]?.title || CommonHelper.sentenize(auth.provider, false);
return providersList[provider + "Auth"]?.title || CommonHelper.sentenize(provider, false);
}
function getProviderIcon(provider) {
ui/src/components/settings/AuthProviderAccordion.svelte
+3 -23
View File
@@ -11,7 +11,7 @@
export let title;
export let icon = "";
export let config = {};
export let showSelfHostedFields = false;
export let optionsComponent;
let accordion;
@@ -82,29 +82,9 @@
</Field>
</div>
{#if showSelfHostedFields}
{#if optionsComponent}
<div class="col-lg-12">
<div class="section-title">Optional endpoints (if you self host the OAUTH2 service)</div>
<div class="grid">
<div class="col-lg-4">
<Field class="form-field" name="{key}.authUrl" let:uniqueId>
<label for={uniqueId}>Custom Auth URL</label>
<input type="url" id={uniqueId} bind:value={config.authUrl} />
</Field>
</div>
<div class="col-lg-4">
<Field class="form-field" name="{key}.tokenUrl" let:uniqueId>
<label for={uniqueId}>Custom Token URL</label>
<input type="text" id={uniqueId} bind:value={config.tokenUrl} />
</Field>
</div>
<div class="col-lg-4">
<Field class="form-field" name="{key}.userApiUrl" let:uniqueId>
<label for={uniqueId}>Custom User API URL</label>
<input type="text" id={uniqueId} bind:value={config.userApiUrl} />
</Field>
</div>
</div>
<svelte:component this={optionsComponent} {key} bind:config />
</div>
{/if}
</div>
ui/src/components/settings/PageAuthProviders.svelte
+1 -1
View File
@@ -99,7 +99,7 @@
{key}
title={provider.title}
icon={provider.icon || "ri-fingerprint-line"}
showSelfHostedFields={provider.selfHosted}
optionsComponent={provider.optionsComponent}
bind:config={formSettings[key]}
/>
{/each}
ui/src/components/settings/providers/MicrosoftOptions.svelte
+40
View File
@@ -0,0 +1,40 @@
<script>
import Field from "@/components/base/Field.svelte";
export let key = "";
export let config = {};
</script>
<div class="section-title">Azure AD endpoints</div>
<div class="grid">
<div class="col-lg-12">
<Field class="form-field required" name="{key}.authUrl" let:uniqueId>
<label for={uniqueId}>Auth URL</label>
<input
type="url"
id={uniqueId}
required
placeholder="https://login.microsoftonline.com/YOUR_DIRECTORY_TENANT_ID/oauth2/v2.0/authorize"
bind:value={config.authUrl}
/>
<div class="help-block">
Eg. {`https://login.microsoftonline.com/YOUR_DIRECTORY_TENANT_ID/oauth2/v2.0/authorize`}
</div>
</Field>
</div>
<div class="col-lg-12">
<Field class="form-field required" name="{key}.tokenUrl" let:uniqueId>
<label for={uniqueId}>Token URL</label>
<input
type="text"
id={uniqueId}
required
placeholder="https://login.microsoftonline.com/YOUR_DIRECTORY_TENANT_ID/oauth2/v2.0/token"
bind:value={config.tokenUrl}
/>
<div class="help-block">
Eg. {`https://login.microsoftonline.com/YOUR_DIRECTORY_TENANT_ID/oauth2/v2.0/token`}
</div>
</Field>
</div>
</div>
ui/src/components/settings/providers/SelfHostedOptions.svelte
+28
View File
@@ -0,0 +1,28 @@
<script>
import Field from "@/components/base/Field.svelte";
export let key = "";
export let config = {};
</script>
<div class="section-title">Selfhosted endpoints (optional)</div>
<div class="grid">
<div class="col-lg-4">
<Field class="form-field" name="{key}.authUrl" let:uniqueId>
<label for={uniqueId}>Auth URL</label>
<input type="url" id={uniqueId} bind:value={config.authUrl} />
</Field>
</div>
<div class="col-lg-4">
<Field class="form-field" name="{key}.tokenUrl" let:uniqueId>
<label for={uniqueId}>Token URL</label>
<input type="text" id={uniqueId} bind:value={config.tokenUrl} />
</Field>
</div>
<div class="col-lg-4">
<Field class="form-field" name="{key}.userApiUrl" let:uniqueId>
<label for={uniqueId}>User API URL</label>
<input type="text" id={uniqueId} bind:value={config.userApiUrl} />
</Field>
</div>
</div>
ui/src/providers.js
+16 -4
View File
@@ -1,7 +1,14 @@
import SelfHostedOptions from "@/components/settings/providers/SelfHostedOptions.svelte";
import MicrosoftOptions from "@/components/settings/providers/MicrosoftOptions.svelte";
// Object list with all supported OAuth2 providers in the format:
// ```
// { settingsKey: { title, icon, selfHosted } }
// { settingsKey: { title, icon, optionsComponent? } }
// ```
//
// If `optionsComponent` is provided it will receive 2 parameters:
// - `key` - the provider settings key (eg. "gitlabAuth")
// - `config` - the provider settings config that is currently being updated
export default {
googleAuth: {
title: "Google",
@@ -20,12 +27,17 @@ export default {
icon: "ri-github-fill",
},
gitlabAuth: {
title: "GitLab",
icon: "ri-gitlab-fill",
selfHosted: true,
title: "GitLab",
icon: "ri-gitlab-fill",
optionsComponent: SelfHostedOptions,
},
discordAuth: {
title: "Discord",
icon: "ri-discord-fill",
},
microsoftAuth: {
title: "Microsoft",
icon: "ri-microsoft-fill",
optionsComponent: MicrosoftOptions,
},
};