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

added OIDC host change confirm message

Browse Source
This commit is contained in:
Gani Georgiev
2024-10-15 09:03:48 +03:00
parent 8271452430
commit cfff7b6d11
33 changed files with 376 additions and 261 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/components/collections/CollectionFieldsTab.svelte
+20 -1
View File
@@ -161,6 +161,25 @@
collection.fields.push(field);
}
}
function replaceIdentityFields(oldName, newName) {
if (oldName === newName || !newName) {
return;
}
let identityFields = collection.passwordAuth?.identityFields || [];
for (let i = 0; i < identityFields.length; i++) {
if (identityFields[i] == oldName) {
identityFields[i] = newName;
}
}
}
function onFieldRename(oldName, newName) {
replaceIndexesColumn(oldName, newName);
replaceIdentityFields(oldName, newName);
}
</script>
<div class="schema-fields total-{collection.fields.length}">
@@ -194,7 +213,7 @@
bind:field
on:remove={() => removeField(i)}
on:duplicate={() => duplicateField(i)}
on:rename={(e) => replaceIndexesColumn(e.detail.oldName, e.detail.newName)}
on:rename={(e) => onFieldRename(e.detail.oldName, e.detail.newName)}
/>
</Draggable>
{/each}
ui/src/components/collections/CollectionUpdateConfirm.svelte
+87 -15
View File
@@ -1,6 +1,7 @@
<script>
import OverlayPanel from "@/components/base/OverlayPanel.svelte";
import { createEventDispatcher, tick } from "svelte";
import ApiClient from "@/utils/ApiClient";
import OverlayPanel from "@/components/base/OverlayPanel.svelte";
const dispatch = createEventDispatcher();
@@ -8,6 +9,7 @@
let oldCollection;
let newCollection;
let hideAfterSave;
let conflictingOIDCs = [];
$: isCollectionRenamed = oldCollection?.name != newCollection?.name;
@@ -36,13 +38,16 @@
newCollection = changed;
hideAfterSave = hideAfterSaveArg;
await detectConflictingOIDCs();
await tick();
if (
isCollectionRenamed ||
renamedFields.length ||
deletedFields.length ||
multipleToSingleFields.length
multipleToSingleFields.length ||
conflictingOIDCs.length
) {
panel?.show();
} else {
@@ -59,6 +64,50 @@
hide();
dispatch("confirm", hideAfterSave);
}
const oidcProviders = ["oidc", "oidc2", "oidc3"];
async function detectConflictingOIDCs() {
conflictingOIDCs = [];
for (let name of oidcProviders) {
let oldProvider = oldCollection?.oauth2?.providers?.find((p) => p.name == name);
let newProvider = newCollection?.oauth2?.providers?.find((p) => p.name == name);
if (!oldProvider || !newProvider) {
continue;
}
let oldHost = new URL(oldProvider.authURL).host;
let newHost = new URL(newProvider.authURL).host;
if (oldHost == newHost) {
continue;
}
// check if there are existing externalAuths
if (await haveExternalAuths(name)) {
conflictingOIDCs.push({ name, oldHost, newHost });
}
}
}
async function haveExternalAuths(provider) {
try {
await ApiClient.collection("_externalAuths").getFirstListItem(
ApiClient.filter("collectionRef={:collectionId} && provider={:provider}", {
collectionId: newCollection?.id,
provider: provider,
}),
);
return true;
} catch {}
return false;
}
function getExternalAuthsFilterLink(provider) {
return `#/collections?collectionId=_pbc_2951383030&filter=collectionRef%3D%22${newCollection?.id}%22+%26%26+provider%3D%22${provider}%22`;
}
</script>
<OverlayPanel bind:this={panel} class="confirm-changes-panel" popup on:hide on:show>
@@ -66,20 +115,22 @@
<h4>Confirm collection changes</h4>
</svelte:fragment>
<div class="alert alert-warning">
<div class="icon">
<i class="ri-error-warning-line" />
{#if isCollectionRenamed || deletedFields.length || renamedFields.length}
<div class="alert alert-warning">
<div class="icon">
<i class="ri-error-warning-line" />
</div>
<div class="content txt-bold">
<p>
If any of the collection changes is part of another collection rule, filter or view query,
you'll have to update it manually!
</p>
{#if deletedFields.length}
<p>All data associated with the removed fields will be permanently deleted!</p>
{/if}
</div>
</div>
<div class="content txt-bold">
<p>
If any of the collection changes is part of another collection rule, filter or view query,
you'll have to update it manually!
</p>
{#if deletedFields.length}
<p>All data associated with the removed fields will be permanently deleted!</p>
{/if}
</div>
</div>
{/if}
{#if showChanges}
<h6>Changes:</h6>
@@ -121,6 +172,27 @@
</li>
{/each}
{/if}
{#each conflictingOIDCs as oidc}
<li>
Changed <code>{oidc.name}</code> host
<div class="inline-flex m-l-5">
<strong class="txt-strikethrough txt-hint">{oidc.oldHost}</strong>
<i class="ri-arrow-right-line txt-sm" />
<strong class="txt">{oidc.newHost}</strong>
</div>
<br />
<em class="txt-hint">
If the old and new OIDC configuration is not for the same provider consider deleting
all old <code class="txt-sm">_externalAuths</code> records associated to the current
collection and provider, otherwise it may result in account linking errors.
<a href={getExternalAuthsFilterLink(oidc.name)} target="_blank">
Review existing <code class="txt-sm">_externalAuths</code> records
<i class="ri-external-link-line txt-sm"></i>
</a>.
</em>
</li>
{/each}
</ul>
{/if}
ui/src/components/collections/CollectionUpsertPanel.svelte
+27 -10
View File
@@ -37,6 +37,7 @@
let original = null;
let collection = {};
let isSaving = false;
let isLoadingConfirmation = false;
let confirmClose = false; // prevent close recursion
let activeTab = TAB_SCHEMA;
let initialFormHash = calculateFormHash(collection);
@@ -49,7 +50,7 @@
$: isView = collection.type === TYPE_VIEW;
$: if ($errors.fields || $errors.viewQuery) {
$: if ($errors.fields || $errors.viewQuery || $errors.indexes) {
// extract the direct fields list error, otherwise - return a generic message
fieldsTabError = CommonHelper.getNestedVal($errors, "fields.message") || "Has errors";
} else {
@@ -92,6 +93,8 @@
load(model);
confirmClose = true;
isLoadingConfirmation = false;
isSaving = false;
changeTab(TAB_SCHEMA);
@@ -140,12 +143,22 @@
initialFormHash = calculateFormHash(collection);
}
function saveConfirm(hideAfterSave = true) {
if (!collection.id) {
save(hideAfterSave);
} else {
confirmChangesPanel?.show(original, collection, hideAfterSave);
async function saveConfirm(hideAfterSave = true) {
if (isLoadingConfirmation) {
return;
}
isLoadingConfirmation = true;
try {
if (!collection.id) {
await save(hideAfterSave);
} else {
await confirmChangesPanel?.show(original, collection, hideAfterSave);
}
} catch {}
isLoadingConfirmation = false;
}
function save(hideAfterSave = true) {
@@ -165,7 +178,7 @@
request = ApiClient.collections.update(collection.id, data);
}
request
return request
.then((result) => {
removeAllToasts();
@@ -557,15 +570,19 @@
class="btn"
class:btn-expanded={!collection.id}
class:btn-expanded-sm={!!collection.id}
class:btn-loading={isSaving}
disabled={!canSave || isSaving}
class:btn-loading={isSaving || isLoadingConfirmation}
disabled={!canSave || isSaving || isLoadingConfirmation}
on:click={() => saveConfirm()}
>
<span class="txt">{!collection.id ? "Create" : "Save changes"}</span>
</button>
{#if collection.id}
<button type="button" class="btn p-l-5 p-r-5 flex-gap-0" disabled={!canSave || isSaving}>
<button
type="button"
class="btn p-l-5 p-r-5 flex-gap-0"
disabled={!canSave || isSaving || isLoadingConfirmation}
>
<i class="ri-arrow-down-s-line" aria-hidden="true"></i>
<Toggler class="dropdown dropdown-upside dropdown-right dropdown-nowrap m-b-5">
ui/src/components/collections/OAuth2ProvidersListPanel.svelte
+1
View File
@@ -19,6 +19,7 @@
}
export function show() {
clearSearch();
panel?.show();
}
ui/src/components/collections/PasswordAuthAccordion.svelte
+8 -8
View File
@@ -1,12 +1,11 @@
<script>
import { scale } from "svelte/transition";
import tooltip from "@/actions/tooltip";
import Accordion from "@/components/base/Accordion.svelte";
import Field from "@/components/base/Field.svelte";
import ObjectSelect from "@/components/base/ObjectSelect.svelte";
import { errors } from "@/stores/errors";
import CommonHelper from "@/utils/CommonHelper";
import { onMount } from "svelte";
import { scale } from "svelte/transition";
export let collection;
@@ -14,7 +13,7 @@
$: isSuperusers = collection?.system && collection?.name === "_superusers";
$: if (CommonHelper.isEmpty(collection.passwordAuth)) {
$: if (CommonHelper.isEmpty(collection?.passwordAuth)) {
collection.passwordAuth = {
enabled: true,
identityFields: ["email"],
@@ -46,13 +45,14 @@
return result;
}
onMount(() => {
identityFieldsOptions = extractUniqueFields(collection);
});
</script>
<Accordion single>
<Accordion
single
on:expand={() => {
identityFieldsOptions = extractUniqueFields(collection);
}}
>
<svelte:fragment slot="header">
<div class="inline-flex">
<i class="ri-lock-password-line"></i>
ui/src/components/collections/providers/OIDCOptions.svelte
+1
View File
@@ -26,6 +26,7 @@
if (!config.extra) {
config.extra = {};
hasUserInfoURL = true;
}
$: if (typeof hasUserInfoURL !== undefined) {