Github-Mirror/pocketbase
1
0
Fork 0
mirror of https://github.com/pocketbase/pocketbase.git synced 2026-09-20 13:30:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

merge v0.23.0-rc changes

Browse Source
This commit is contained in:
Gani Georgiev
2024-09-29 21:09:46 +03:00
parent ad92992324
commit 844f18cac3
753 changed files with 85107 additions and 63362 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/components/collections/docs/AuthMethodsDocs.svelte
+19 -36
View File
@@ -1,54 +1,37 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
let responseTab = 200;
let responses = [];
let authMethods = {};
let isLoading = false;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: responses = [
{
code: 200,
body: `
{
"usernamePassword": true,
"emailPassword": true,
"authProviders": [
{
"name": "github",
"state": "3Yd8jNkK_6PJG6hPWwBjLqKwse6Ejd",
"codeVerifier": "KxFDWz1B3fxscCDJ_9gHQhLuh__ie7",
"codeChallenge": "NM1oVexB6Q6QH8uPtOUfK7tq4pmu4Jz6lNDIwoxHZNE=",
"codeChallengeMethod": "S256",
"authUrl": "https://github.com/login/oauth/authorize?client_id=demo&code_challenge=NM1oVexB6Q6QH8uPtOUfK7tq4pmu4Jz6lNDIwoxHZNE%3D&code_challenge_method=S256&response_type=code&scope=user&state=3Yd8jNkK_6PJG6hPWwBjLqKwse6Ejd&redirect_uri="
},
{
"name": "gitlab",
"state": "NeQSbtO5cShr_mk5__3CUukiMnymeb",
"codeVerifier": "ahTFHOgua8mkvPAlIBGwCUJbWKR_xi",
"codeChallenge": "O-GATkTj4eXDCnfonsqGLCd6njvTixlpCMvy5kjgOOg=",
"codeChallengeMethod": "S256",
"authUrl": "https://gitlab.com/oauth/authorize?client_id=demo&code_challenge=O-GATkTj4eXDCnfonsqGLCd6njvTixlpCMvy5kjgOOg%3D&code_challenge_method=S256&response_type=code&scope=read_user&state=NeQSbtO5cShr_mk5__3CUukiMnymeb&redirect_uri="
},
{
"name": "google",
"state": "zB3ZPifV1TW2GMuvuFkamSXfSNkHPQ",
"codeVerifier": "t3CmO5VObGzdXqieakvR_fpjiW0zdO",
"codeChallenge": "KChwoQPKYlz2anAdqtgsSTdIo8hdwtc1fh2wHMwW2Yk=",
"codeChallengeMethod": "S256",
"authUrl": "https://accounts.google.com/o/oauth2/auth?client_id=demo&code_challenge=KChwoQPKYlz2anAdqtgsSTdIo8hdwtc1fh2wHMwW2Yk%3D&code_challenge_method=S256&response_type=code&scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile+https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.email&state=zB3ZPifV1TW2GMuvuFkamSXfSNkHPQ&redirect_uri="
}
]
}
`,
body: isLoading ? "..." : JSON.stringify(authMethods, null, 2),
},
];
listAuthMethods();
async function listAuthMethods() {
isLoading = true;
try {
authMethods = await ApiClient.collection(collection.name).listAuthMethods();
} catch (err) {
ApiClient.error(err);
}
isLoading = false;
}
</script>
<h3 class="m-b-sm">List auth methods ({collection.name})</h3>
ui/src/components/collections/docs/AuthRefreshDocs.svelte
+10 -12
View File
@@ -1,16 +1,16 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
let responseTab = 200;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: responses = [
{
@@ -21,7 +21,7 @@
record: CommonHelper.dummyCollectionRecord(collection),
},
null,
2
2,
),
},
{
@@ -64,10 +64,8 @@
<strong>already authenticated record</strong>.
</p>
<p>
<em>
This method is usually called by users on page/screen reload to ensure that the previously stored
data in <code>pb.authStore</code> is still valid and up-to-date.
</em>
This method is usually called by users on page/screen reload to ensure that the previously stored data
in <code>pb.authStore</code> is still valid and up-to-date.
</p>
</div>
@@ -84,7 +82,7 @@
// after the above you can also access the refreshed auth data from the authStore
console.log(pb.authStore.isValid);
console.log(pb.authStore.token);
console.log(pb.authStore.model.id);
console.log(pb.authStore.record.id);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
@@ -98,7 +96,7 @@
// after the above you can also access the refreshed auth data from the authStore
print(pb.authStore.isValid);
print(pb.authStore.token);
print(pb.authStore.model.id);
print(pb.authStore.record.id);
`}
/>
@@ -110,7 +108,7 @@
/api/collections/<strong>{collection.name}</strong>/auth-refresh
</p>
</div>
<p class="txt-hint txt-sm txt-right">Requires record <code>Authorization:TOKEN</code> header</p>
<p class="txt-hint txt-sm txt-right">Requires <code>Authorization:TOKEN</code> header</p>
</div>
<div class="section-title">Query parameters</div>
ui/src/components/collections/docs/AuthWithOAuth2Docs.svelte
+11 -11
View File
@@ -1,16 +1,16 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
let responseTab = 200;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: responses = [
{
@@ -24,14 +24,14 @@
name: "John Doe",
username: "john.doe",
email: "test@example.com",
avatarUrl: "https://example.com/avatar.png",
avatarURL: "https://example.com/avatar.png",
accessToken: "...",
refreshToken: "...",
rawUser: {},
},
},
null,
2
2,
),
},
{
@@ -82,9 +82,9 @@
// after the above you can also access the auth data from the authStore
console.log(pb.authStore.isValid);
console.log(pb.authStore.token);
console.log(pb.authStore.model.id);
console.log(pb.authStore.record.id);
// "logout" the last authenticated model
// "logout"
pb.authStore.clear();
`}
dart={`
@@ -108,9 +108,9 @@
// after the above you can also access the auth data from the authStore
print(pb.authStore.isValid);
print(pb.authStore.token);
print(pb.authStore.model.id);
print(pb.authStore.record.id);
// "logout" the last authenticated model
// "logout"
pb.authStore.clear();
`}
/>
@@ -175,7 +175,7 @@
<td>
<div class="inline-flex">
<span class="label label-success">Required</span>
<span>redirectUrl</span>
<span>redirectURL</span>
</div>
</td>
<td>
ui/src/components/collections/docs/AuthWithOtpApiAuthDocs.svelte
+106
View File
@@ -0,0 +1,106 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
let responseTab = 200;
let responses = [];
$: responses = [
{
code: 200,
body: JSON.stringify(
{
token: "JWT_TOKEN",
record: CommonHelper.dummyCollectionRecord(collection),
},
null,
2,
),
},
{
code: 400,
body: `
{
"code": 400,
"message": "Failed to authenticate.",
"data": {
"otpId": {
"code": "validation_required",
"message": "Missing required value."
}
}
}
`,
},
];
</script>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
<p>
/api/collections/<strong>{collection.name}</strong>/auth-with-otp
</p>
</div>
</div>
<div class="section-title">Body Parameters</div>
<table class="table-compact table-border m-b-base">
<thead>
<tr>
<th>Param</th>
<th>Type</th>
<th width="50%">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="inline-flex">
<span class="label label-success">Required</span>
<span>otpId</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>The id of the OTP request.</td>
</tr>
<tr>
<td>
<div class="inline-flex">
<span class="label label-success">Required</span>
<span>password</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>The one-time password.</td>
</tr>
</tbody>
</table>
<div class="section-title">Responses</div>
<div class="tabs">
<div class="tabs-header compact combined left">
{#each responses as response (response.code)}
<button
class="tab-item"
class:active={responseTab === response.code}
on:click={() => (responseTab = response.code)}
>
{response.code}
</button>
{/each}
</div>
<div class="tabs-content">
{#each responses as response (response.code)}
<div class="tab-item" class:active={responseTab === response.code}>
<CodeBlock content={response.body} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/AuthWithOtpApiRequestDocs.svelte
+103
View File
@@ -0,0 +1,103 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
let responseTab = 200;
let responses = [];
$: responses = [
{
code: 200,
body: JSON.stringify(
{
otpId: CommonHelper.randomString(15),
},
null,
2,
),
},
{
code: 400,
body: `
{
"code": 400,
"message": "An error occurred while validating the submitted data.",
"data": {
"email": {
"code": "validation_is_email",
"message": "Must be a valid email address."
}
}
}
`,
},
{
code: 429,
body: `
{
"code": 429,
"message": "You've send too many OTP requests, please try again later.",
"data": {}
}
`,
},
];
</script>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
<p>
/api/collections/<strong>{collection.name}</strong>/request-otp
</p>
</div>
</div>
<div class="section-title">Body Parameters</div>
<table class="table-compact table-border m-b-base">
<thead>
<tr>
<th>Param</th>
<th>Type</th>
<th width="50%">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="inline-flex">
<span class="label label-success">Required</span>
<span>email</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>The auth record email address to send the OTP request (if exists).</td>
</tr>
</tbody>
</table>
<div class="section-title">Responses</div>
<div class="tabs">
<div class="tabs-header compact combined left">
{#each responses as response (response.code)}
<button
class="tab-item"
class:active={responseTab === response.code}
on:click={() => (responseTab = response.code)}
>
{response.code}
</button>
{/each}
</div>
<div class="tabs-content">
{#each responses as response (response.code)}
<div class="tab-item" class:active={responseTab === response.code}>
<CodeBlock content={response.body} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/AuthWithOtpDocs.svelte
+96
View File
@@ -0,0 +1,96 @@
<script>
import AuthWithOtpApiAuthDocs from "@/components/collections/docs/AuthWithOtpApiAuthDocs.svelte";
import AuthWithOtpApiRequestDocs from "@/components/collections/docs/AuthWithOtpApiRequestDocs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
const apiTabs = [
{ title: "OTP Request", component: AuthWithOtpApiRequestDocs },
{ title: "OTP Auth", component: AuthWithOtpApiAuthDocs },
];
let activeApiTab = 0;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
</script>
<h3 class="m-b-sm">Auth with OTP ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Authenticate with an one-time password (OTP).</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
// send OTP email to the provided auth record
const req = await pb.collection('${collection?.name}').requestOtp('test@example.com');
// ... show a screen/popup to enter the password from the email ...
// authenticate with the requested OTP id and the email password
const authData = await pb.collection('${collection?.name}').authWithOtp(
req.otpId,
"YOUR_OTP",
);
// after the above you can also access the auth data from the authStore
console.log(pb.authStore.isValid);
console.log(pb.authStore.token);
console.log(pb.authStore.record.id);
// "logout"
pb.authStore.clear();
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
// send OTP email to the provided auth record
final req = await pb.collection('${collection?.name}').requestOtp('test@example.com');
// ... show a screen/popup to enter the password from the email ...
// authenticate with the requested OTP id and the email password
final authData = await pb.collection('${collection?.name}').authWithOtp(
req.otpId,
"YOUR_OTP",
);
// after the above you can also access the auth data from the authStore
print(pb.authStore.isValid);
print(pb.authStore.token);
print(pb.authStore.record.id);
// "logout"
pb.authStore.clear();
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="tabs">
<div class="tabs-header compact">
{#each apiTabs as tab, i}
<button class="tab-item" class:active={activeApiTab == i} on:click={() => (activeApiTab = i)}>
<div class="txt">{tab.title}</div>
</button>
{/each}
</div>
<div class="tabs-content">
{#each apiTabs as tab, i}
<div class="tab-item" class:active={activeApiTab == i}>
<svelte:component this={tab.component} {collection} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/AuthWithPasswordDocs.svelte
+17 -38
View File
@@ -1,27 +1,21 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
let responseTab = 200;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: allowEmail = collection?.options?.allowEmailAuth;
$: allowUsername = collection?.options?.allowUsernameAuth;
$: identityFields = collection?.passwordAuth?.identityFields || [];
$: exampleIdentityLabel =
allowUsername && allowEmail
? "YOUR_USERNAME_OR_EMAIL"
: allowUsername
? "YOUR_USERNAME"
: "YOUR_EMAIL";
identityFields.length == 0 ? "NONE" : "YOUR_" + identityFields.join("_OR_").toUpperCase();
$: responses = [
{
@@ -32,7 +26,7 @@
record: CommonHelper.dummyCollectionRecord(collection),
},
null,
2
2,
),
},
{
@@ -56,17 +50,8 @@
<h3 class="m-b-sm">Auth with password ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>
Returns new auth token and account data by a combination of
<strong>
{#if allowUsername && allowEmail}
username/email
{:else if allowUsername}
username
{:else if allowEmail}
email
{/if}
</strong>
and <strong>password</strong>.
Authenticate with combination of
<strong>{identityFields.join("/")}</strong> and <strong>password</strong>.
</p>
</div>
@@ -86,9 +71,9 @@
// after the above you can also access the auth data from the authStore
console.log(pb.authStore.isValid);
console.log(pb.authStore.token);
console.log(pb.authStore.model.id);
console.log(pb.authStore.record.id);
// "logout" the last authenticated account
// "logout"
pb.authStore.clear();
`}
dart={`
@@ -106,9 +91,9 @@
// after the above you can also access the auth data from the authStore
print(pb.authStore.isValid);
print(pb.authStore.token);
print(pb.authStore.model.id);
print(pb.authStore.record.id);
// "logout" the last authenticated account
// "logout"
pb.authStore.clear();
`}
/>
@@ -144,16 +129,10 @@
<span class="label">String</span>
</td>
<td>
The
{#if allowUsername}
<strong>username</strong>
{/if}
{#if allowUsername && allowEmail}
or
{/if}
{#if allowEmail}
<strong>email</strong>
{/if}
{#each identityFields as name, i}
{#if i > 0}or{/if}
<strong>{name}</strong>
{/each}
of the record to authenticate.
</td>
</tr>
ui/src/components/collections/docs/CreateApiDocs.svelte
+36 -57
View File
@@ -1,9 +1,9 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
@@ -13,9 +13,16 @@
$: isAuth = collection.type === "auth";
$: adminsOnly = collection?.createRule === null;
$: superusersOnly = collection?.createRule === null;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: excludedTableFields = isAuth ? ["password", "verified", "email", "emailVisibility"] : [];
$: tableFields =
collection?.fields?.filter((f) => {
return !f.hidden && f.type != "autodate" && !excludedTableFields.includes(f.name);
}) || [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: responses = [
{
@@ -29,7 +36,7 @@
"code": 400,
"message": "Failed to create record.",
"data": {
"${collection?.schema?.[0]?.name}": {
"${collection?.fields?.[0]?.name}": {
"code": "validation_required",
"message": "Missing required value."
}
@@ -51,9 +58,6 @@
$: if (isAuth) {
baseData = {
username: "test_username",
email: "test@example.com",
emailVisibility: true,
password: "12345678",
passwordConfirm: "12345678",
};
@@ -89,7 +93,7 @@ const pb = new PocketBase('${backendAbsUrl}');
...
// example create data
const data = ${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection)), null, 4)};
const data = ${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection, true)), null, 4)};
const record = await pb.collection('${collection?.name}').create(data);
` + (isAuth ?
@@ -106,7 +110,7 @@ final pb = PocketBase('${backendAbsUrl}');
...
// example create body
final body = <String, dynamic>${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection)), null, 2)};
final body = <String, dynamic>${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection, true)), null, 2)};
final record = await pb.collection('${collection?.name}').create(body: body);
` + (isAuth ?
@@ -125,8 +129,8 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
/api/collections/<strong>{collection.name}</strong>/records
</p>
</div>
{#if adminsOnly}
<p class="txt-hint txt-sm txt-right">Requires admin <code>Authorization:TOKEN</code> header</p>
{#if superusersOnly}
<p class="txt-hint txt-sm txt-right">Requires superuser <code>Authorization:TOKEN</code> header</p>
{/if}
</div>
@@ -140,47 +144,14 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="inline-flex">
<span class="label label-warning">Optional</span>
<span>id</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>
<strong>15 characters string</strong> to store as record ID.
<br />
If not set, it will be auto generated.
</td>
</tr>
{#if isAuth}
<tr>
<td colspan="3" class="txt-hint">Auth fields</td>
<td colspan="3" class="txt-hint txt-bold">Auth specific fields</td>
</tr>
<tr>
<td>
<div class="inline-flex">
<span class="label label-warning">Optional</span>
<span>username</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>
The username of the auth record.
<br />
If not set, it will be auto generated.
</td>
</tr>
<tr>
<td>
<div class="inline-flex">
{#if collection?.options?.requireEmail}
{#if collection?.fields?.find((f) => f.name == "email")?.required}
<span class="label label-success">Required</span>
{:else}
<span class="label label-warning">Optional</span>
@@ -196,7 +167,11 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
<tr>
<td>
<div class="inline-flex">
<span class="label label-warning">Optional</span>
{#if collection?.fields?.find((f) => f.name == "emailVisibility")?.required}
<span class="label label-success">Required</span>
{:else}
<span class="label label-warning">Optional</span>
{/if}
<span>emailVisibility</span>
</div>
</td>
@@ -242,22 +217,22 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
<td>
Indicates whether the auth record is verified or not.
<br />
This field can be set only by admins or auth records with "Manage" access.
This field can be set only by superusers or auth records with "Manage" access.
</td>
</tr>
<tr>
<td colspan="3" class="txt-hint">Schema fields</td>
<td colspan="3" class="txt-hint txt-bold">Other fields</td>
</tr>
{/if}
{#each collection?.schema as field (field.name)}
{#each tableFields as field (field.name)}
<tr>
<td>
<div class="inline-flex">
{#if field.required}
<span class="label label-success">Required</span>
{:else}
{#if !field.required || (field.type == "text" && field.autogeneratePattern)}
<span class="label label-warning">Optional</span>
{:else}
<span class="label label-success">Required</span>
{/if}
<span>{field.name}</span>
</div>
@@ -268,6 +243,9 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
<td>
{#if field.type === "text"}
Plain text value.
{#if field.autogeneratePattern}
It is autogenerated if not set.
{/if}
{:else if field.type === "number"}
Number value.
{:else if field.type === "json"}
@@ -278,9 +256,10 @@ await pb.collection('${collection?.name}').requestVerification('test@example.com
URL address.
{:else if field.type === "file"}
File object.<br />
Set to <code>null</code> to delete already uploaded file(s).
Set to empty value (<code>null</code>, <code>""</code> or <code>[]</code>) to delete
already uploaded file(s).
{:else if field.type === "relation"}
Relation record {field.options?.maxSelect === 1 ? "id" : "ids"}.
Relation record {field.maxSelect === 1 ? "id" : "ids"}.
{/if}
</td>
</tr>
ui/src/components/collections/docs/DeleteApiDocs.svelte
+7 -7
View File
@@ -2,16 +2,16 @@
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: adminsOnly = collection?.deleteRule === null;
$: superusersOnly = collection?.deleteRule === null;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: if (collection?.id) {
responses.push({
@@ -32,13 +32,13 @@
`,
});
if (adminsOnly) {
if (superusersOnly) {
responses.push({
code: 403,
body: `
{
"code": 403,
"message": "Only admins can access this action.",
"message": "Only superusers can access this action.",
"data": {}
}
`,
@@ -92,8 +92,8 @@
/api/collections/<strong>{collection.name}</strong>/records/<strong>:id</strong>
</p>
</div>
{#if adminsOnly}
<p class="txt-hint txt-sm txt-right">Requires admin <code>Authorization:TOKEN</code> header</p>
{#if superusersOnly}
<p class="txt-hint txt-sm txt-right">Requires superuser <code>Authorization:TOKEN</code> header</p>
{/if}
</div>
ui/src/components/collections/docs/ConfirmEmailChangeDocs.svelte → ui/src/components/collections/docs/EmailChangeApiConfirmDocs.svelte
-42
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -34,43 +29,6 @@
];
</script>
<h3 class="m-b-sm">Confirm email change ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Confirms <strong>{collection.name}</strong> email change request.</p>
<p>
After this request all previously issued tokens for the specific record will be automatically
invalidated.
</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').confirmEmailChange(
'TOKEN',
'YOUR_PASSWORD',
);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').confirmEmailChange(
'TOKEN',
'YOUR_PASSWORD',
);
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
ui/src/components/collections/docs/RequestEmailChangeDocs.svelte → ui/src/components/collections/docs/EmailChangeApiRequestDocs.svelte
+1 -37
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -54,37 +49,6 @@
];
</script>
<h3 class="m-b-sm">Request email change ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> email change request.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '1234567890');
await pb.collection('${collection?.name}').requestEmailChange('new@example.com');
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '1234567890');
await pb.collection('${collection?.name}').requestEmailChange('new@example.com');
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
@@ -92,7 +56,7 @@
/api/collections/<strong>{collection.name}</strong>/request-email-change
</p>
</div>
<p class="txt-hint txt-sm txt-right">Requires record <code>Authorization:TOKEN</code> header</p>
<p class="txt-hint txt-sm txt-right">Requires <code>Authorization:TOKEN</code> header</p>
</div>
<div class="section-title">Body Parameters</div>
ui/src/components/collections/docs/EmailChangeDocs.svelte
+92
View File
@@ -0,0 +1,92 @@
<script>
import EmailChangeApiConfirmDocs from "@/components/collections/docs/EmailChangeApiConfirmDocs.svelte";
import EmailChangeApiRequestDocs from "@/components/collections/docs/EmailChangeApiRequestDocs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
const apiTabs = [
{ title: "Request email change", component: EmailChangeApiRequestDocs },
{ title: "Confirm email change", component: EmailChangeApiConfirmDocs },
];
let activeApiTab = 0;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
</script>
<h3 class="m-b-sm">Email change ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> email change request.</p>
<p>
On successful email change all previously issued auth tokens for the specific record will be
automatically invalidated.
</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '1234567890');
await pb.collection('${collection?.name}').requestEmailChange('new@example.com');
// ---
// (optional) in your custom confirmation page:
// ---
// note: after this call all previously issued auth tokens are invalidated
await pb.collection('${collection?.name}').confirmEmailChange(
'EMAIL_CHANGE_TOKEN',
'YOUR_PASSWORD',
);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '1234567890');
await pb.collection('${collection?.name}').requestEmailChange('new@example.com');
...
// ---
// (optional) in your custom confirmation page:
// ---
// note: after this call all previously issued auth tokens are invalidated
await pb.collection('${collection?.name}').confirmEmailChange(
'EMAIL_CHANGE_TOKEN',
'YOUR_PASSWORD',
);
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="tabs">
<div class="tabs-header compact">
{#each apiTabs as tab, i}
<button class="tab-item" class:active={activeApiTab == i} on:click={() => (activeApiTab = i)}>
<div class="txt">{tab.title}</div>
</button>
{/each}
</div>
<div class="tabs-content">
{#each apiTabs as tab, i}
<div class="tab-item" class:active={activeApiTab == i}>
<svelte:component this={tab.component} {collection} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/ListApiDocs.svelte
+7 -7
View File
@@ -3,7 +3,7 @@
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FilterSyntax from "@/components/collections/docs/FilterSyntax.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
@@ -13,9 +13,9 @@
$: fieldNames = CommonHelper.getAllCollectionIdentifiers(collection);
$: adminsOnly = collection?.listRule === null;
$: superusersOnly = collection?.listRule === null;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: if (collection?.id) {
responses.push({
@@ -47,13 +47,13 @@
`,
});
if (adminsOnly) {
if (superusersOnly) {
responses.push({
code: 403,
body: `
{
"code": 403,
"message": "Only admins can access this action.",
"message": "Only superusers can access this action.",
"data": {}
}
`,
@@ -127,8 +127,8 @@
/api/collections/<strong>{collection.name}</strong>/records
</p>
</div>
{#if adminsOnly}
<p class="txt-hint txt-sm txt-right">Requires admin <code>Authorization:TOKEN</code> header</p>
{#if superusersOnly}
<p class="txt-hint txt-sm txt-right">Requires superuser <code>Authorization:TOKEN</code> header</p>
{/if}
</div>
ui/src/components/collections/docs/ListExternalAuthsDocs.svelte
-176
View File
@@ -1,176 +0,0 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
let responseTab = 200;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 200,
body: `
[
{
"id": "8171022dc95a4e8",
"created": "2022-09-01 10:24:18.434",
"updated": "2022-09-01 10:24:18.889",
"recordId": "e22581b6f1d44ea",
"collectionId": "${collection.id}",
"provider": "google",
"providerId": "2da15468800514p",
},
{
"id": "171022dc895a4e8",
"created": "2022-09-01 10:24:18.434",
"updated": "2022-09-01 10:24:18.889",
"recordId": "e22581b6f1d44ea",
"collectionId": "${collection.id}",
"provider": "twitter",
"providerId": "720688005140514",
}
]
`,
},
{
code: 401,
body: `
{
"code": 401,
"message": "The request requires valid record authorization token to be set.",
"data": {}
}
`,
},
{
code: 403,
body: `
{
"code": 403,
"message": "The authorized record model is not allowed to perform this action.",
"data": {}
}
`,
},
{
code: 404,
body: `
{
"code": 404,
"message": "The requested resource wasn't found.",
"data": {}
}
`,
},
];
</script>
<h3 class="m-b-sm">List OAuth2 accounts ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>
Returns a list with all OAuth2 providers linked to a single <strong>{collection.name}</strong>.
</p>
<p>Only admins and the account owner can access this action.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '123456');
const result = await pb.collection('${collection?.name}').listExternalAuths(
pb.authStore.model.id
);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '123456');
final result = await pb.collection('${collection?.name}').listExternalAuths(
pb.authStore.model.id,
);
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-info">
<strong class="label label-primary">GET</strong>
<div class="content">
<p>
/api/collections/<strong>{collection.name}</strong>/records/<strong>:id</strong>/external-auths
</p>
</div>
<p class="txt-hint txt-sm txt-right">Requires <code>Authorization:TOKEN</code> header</p>
</div>
<div class="section-title">Path Parameters</div>
<table class="table-compact table-border m-b-base">
<thead>
<tr>
<th>Param</th>
<th>Type</th>
<th width="60%">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>id</td>
<td>
<span class="label">String</span>
</td>
<td>ID of the auth record.</td>
</tr>
</tbody>
</table>
<div class="section-title">Query parameters</div>
<table class="table-compact table-border m-b-base">
<thead>
<tr>
<th>Param</th>
<th>Type</th>
<th width="50%">Description</th>
</tr>
</thead>
<tbody>
<FieldsQueryParam />
</tbody>
</table>
<div class="section-title">Responses</div>
<div class="tabs">
<div class="tabs-header compact combined left">
{#each responses as response (response.code)}
<button
class="tab-item"
class:active={responseTab === response.code}
on:click={() => (responseTab = response.code)}
>
{response.code}
</button>
{/each}
</div>
<div class="tabs-content">
{#each responses as response (response.code)}
<div class="tab-item" class:active={responseTab === response.code}>
<CodeBlock content={response.body} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/ConfirmPasswordResetDocs.svelte → ui/src/components/collections/docs/PasswordResetApiConfirmDocs.svelte
-56
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -34,57 +29,6 @@
];
</script>
<h3 class="m-b-sm">Confirm password reset ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Confirms <strong>{collection.name}</strong> password reset request and sets a new password.</p>
<p>
After this request all previously issued tokens for the specific record will be automatically
invalidated.
</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
let oldAuth = pb.authStore.model;
await pb.collection('${collection?.name}').confirmPasswordReset(
'TOKEN',
'NEW_PASSWORD',
'NEW_PASSWORD_CONFIRM',
);
// reauthenticate if needed
// (after the above call all previously issued tokens are invalidated)
await pb.collection('${collection?.name}').authWithPassword(oldAuth.email, 'NEW_PASSWORD');
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
final oldAuth = pb.authStore.model;
await pb.collection('${collection?.name}').confirmPasswordReset(
'TOKEN',
'NEW_PASSWORD',
'NEW_PASSWORD_CONFIRM',
);
// reauthenticate if needed
// (after the above call all previously issued tokens are invalidated)
await pb.collection('${collection?.name}').authWithPassword(oldAuth.email, 'NEW_PASSWORD');
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
ui/src/components/collections/docs/RequestPasswordResetDocs.svelte → ui/src/components/collections/docs/PasswordResetApiRequestDocs.svelte
-32
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -34,33 +29,6 @@
];
</script>
<h3 class="m-b-sm">Request password reset ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> password reset email request.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestPasswordReset('test@example.com');
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestPasswordReset('test@example.com');
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
ui/src/components/collections/docs/PasswordResetDocs.svelte
+88
View File
@@ -0,0 +1,88 @@
<script>
import PasswordResetApiConfirmDocs from "@/components/collections/docs/PasswordResetApiConfirmDocs.svelte";
import PasswordResetApiRequestDocs from "@/components/collections/docs/PasswordResetApiRequestDocs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
const apiTabs = [
{ title: "Request password reset", component: PasswordResetApiRequestDocs },
{ title: "Confirm password reset", component: PasswordResetApiConfirmDocs },
];
let activeApiTab = 0;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
</script>
<h3 class="m-b-sm">Password reset ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> password reset email request.</p>
<p>
On successful password reset all previously issued auth tokens for the specific record will be
automatically invalidated.
</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestPasswordReset('test@example.com');
// ---
// (optional) in your custom confirmation page:
// ---
// note: after this call all previously issued auth tokens are invalidated
await pb.collection('${collection?.name}').confirmPasswordReset(
'RESET_TOKEN',
'NEW_PASSWORD',
'NEW_PASSWORD_CONFIRM',
);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestPasswordReset('test@example.com');
// ---
// (optional) in your custom confirmation page:
// ---
// note: after this call all previously issued auth tokens are invalidated
await pb.collection('${collection?.name}').confirmPasswordReset(
'RESET_TOKEN',
'NEW_PASSWORD',
'NEW_PASSWORD_CONFIRM',
);
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="tabs">
<div class="tabs-header compact">
{#each apiTabs as tab, i}
<button class="tab-item" class:active={activeApiTab == i} on:click={() => (activeApiTab = i)}>
<div class="txt">{tab.title}</div>
</button>
{/each}
</div>
<div class="tabs-content">
{#each apiTabs as tab, i}
<div class="tab-item" class:active={activeApiTab == i}>
<svelte:component this={tab.component} {collection} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/RealtimeApiDocs.svelte
+8 -8
View File
@@ -1,12 +1,12 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
</script>
<h3 class="m-b-sm">Realtime ({collection.name})</h3>
@@ -53,13 +53,13 @@
pb.collection('${collection?.name}').subscribe('*', function (e) {
console.log(e.action);
console.log(e.record);
}, { /* other options like expand, custom headers, etc. */ });
}, { /* other options like: filter, expand, custom headers, etc. */ });
// Subscribe to changes only in the specified record
pb.collection('${collection?.name}').subscribe('RECORD_ID', function (e) {
console.log(e.action);
console.log(e.record);
}, { /* other options like expand, custom headers, etc. */ });
}, { /* other options like: filter, expand, custom headers, etc. */ });
// Unsubscribe
pb.collection('${collection?.name}').unsubscribe('RECORD_ID'); // remove all 'RECORD_ID' subscriptions
@@ -80,13 +80,13 @@
pb.collection('${collection?.name}').subscribe('*', (e) {
print(e.action);
print(e.record);
}, /* other options like expand, custom headers, etc. */);
}, /* other options like: filter, expand, custom headers, etc. */);
// Subscribe to changes only in the specified record
pb.collection('${collection?.name}').subscribe('RECORD_ID', (e) {
print(e.action);
print(e.record);
}, /* other options like expand, custom headers, etc. */);
}, /* other options like: filter, expand, custom headers, etc. */);
// Unsubscribe
pb.collection('${collection?.name}').unsubscribe('RECORD_ID'); // remove all 'RECORD_ID' subscriptions
@@ -111,6 +111,6 @@
record: CommonHelper.dummyCollectionRecord(collection),
},
null,
2
2,
).replace('"action": "create"', '"action": "create" // create, update or delete')}
/>
ui/src/components/collections/docs/SdkTabs.svelte
-67
View File
@@ -1,67 +0,0 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
const SDK_PREFERENCE_KEY = "pb_sdk_preference";
let classes = "m-b-sm";
export { classes as class }; // export reserved keyword
export let js = "";
export let dart = "";
let activeTab = localStorage.getItem(SDK_PREFERENCE_KEY) || "javascript";
$: if (activeTab) {
// store user preference
localStorage.setItem(SDK_PREFERENCE_KEY, activeTab);
}
$: sdkExamples = [
{
title: "JavaScript",
language: "javascript",
content: js,
url: import.meta.env.PB_JS_SDK_URL,
},
{
title: "Dart",
language: "dart",
content: dart,
url: import.meta.env.PB_DART_SDK_URL,
},
];
</script>
<div class="tabs sdk-tabs {classes}">
<div class="tabs-header compact combined left">
{#each sdkExamples as example (example.language)}
<button
class="tab-item"
class:active={activeTab === example.language}
on:click={() => (activeTab = example.language)}
>
<div class="txt">{example.title}</div>
</button>
{/each}
</div>
<div class="tabs-content">
{#each sdkExamples as example (example.language)}
<div class="tab-item" class:active={activeTab === example.language}>
<CodeBlock language={example.language} content={example.content} />
<div class="txt-right">
<em class="txt-sm txt-hint">
<a href={example.url} target="_blank" rel="noopener noreferrer">
{example.title} SDK
</a>
</em>
</div>
</div>
{/each}
</div>
</div>
<style>
.sdk-tabs .tabs-header .tab-item {
min-width: 100px;
}
</style>
ui/src/components/collections/docs/UnlinkExternalAuthDocs.svelte
-153
View File
@@ -1,153 +0,0 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
body: "null",
},
{
code: 401,
body: `
{
"code": 401,
"message": "The request requires valid record authorization token to be set.",
"data": {}
}
`,
},
{
code: 403,
body: `
{
"code": 403,
"message": "The authorized record model is not allowed to perform this action.",
"data": {}
}
`,
},
{
code: 404,
body: `
{
"code": 404,
"message": "The requested resource wasn't found.",
"data": {}
}
`,
},
];
</script>
<h3 class="m-b-sm">Unlink OAuth2 account ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>
Unlink a single external OAuth2 provider from <strong>{collection.name}</strong> record.
</p>
<p>Only admins and the account owner can access this action.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '123456');
await pb.collection('${collection?.name}').unlinkExternalAuth(
pb.authStore.model.id,
'google'
);
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').authWithPassword('test@example.com', '123456');
await pb.collection('${collection?.name}').unlinkExternalAuth(
pb.authStore.model.id,
'google',
);
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-danger">
<strong class="label label-primary">DELETE</strong>
<div class="content">
<p>
/api/collections/<strong>{collection.name}</strong>/records/<strong>:id</strong
>/external-auths/<strong>:provider</strong>
</p>
</div>
<p class="txt-hint txt-sm txt-right">Requires <code>Authorization:TOKEN</code> header</p>
</div>
<div class="section-title">Path Parameters</div>
<table class="table-compact table-border m-b-base">
<thead>
<tr>
<th>Param</th>
<th>Type</th>
<th width="60%">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>id</td>
<td>
<span class="label">String</span>
</td>
<td>ID of the auth record.</td>
</tr>
<tr>
<td>provider</td>
<td>
<span class="label">String</span>
</td>
<td>
The name of the auth provider to unlink, eg. <code>google</code>, <code>twitter</code>,
<code>github</code>, etc.
</td>
</tr>
</tbody>
</table>
<div class="section-title">Responses</div>
<div class="tabs">
<div class="tabs-header compact combined left">
{#each responses as response (response.code)}
<button
class="tab-item"
class:active={responseTab === response.code}
on:click={() => (responseTab = response.code)}
>
{response.code}
</button>
{/each}
</div>
<div class="tabs-content">
{#each responses as response (response.code)}
<div class="tab-item" class:active={responseTab === response.code}>
<CodeBlock content={response.body} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/UpdateApiDocs.svelte
+31 -36
View File
@@ -1,9 +1,9 @@
<script>
import CodeBlock from "@/components/base/CodeBlock.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
@@ -13,9 +13,16 @@
$: isAuth = collection?.type === "auth";
$: adminsOnly = collection?.updateRule === null;
$: superusersOnly = collection?.updateRule === null;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: excludedTableFields = isAuth ? ["id", "password", "verified", "email", "emailVisibility"] : ["id"];
$: tableFields =
collection?.fields?.filter((f) => {
return !f.hidden && f.type != "autodate" && !excludedTableFields.includes(f.name);
}) || [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: responses = [
{
@@ -29,7 +36,7 @@
"code": 400,
"message": "Failed to update record.",
"data": {
"${collection?.schema?.[0]?.name}": {
"${collection?.fields?.[0]?.name}": {
"code": "validation_required",
"message": "Missing required value."
}
@@ -59,10 +66,8 @@
},
];
$: if (collection.type === "auth") {
$: if (isAuth) {
baseData = {
username: "test_username_update",
emailVisibility: false,
password: "87654321",
passwordConfirm: "87654321",
oldPassword: "12345678",
@@ -108,7 +113,7 @@ const pb = new PocketBase('${backendAbsUrl}');
...
// example update data
const data = ${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection)), null, 4)};
const data = ${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection, true)), null, 4)};
const record = await pb.collection('${collection?.name}').update('RECORD_ID', data);
`}
@@ -120,7 +125,7 @@ final pb = PocketBase('${backendAbsUrl}');
...
// example update body
final body = <String, dynamic>${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection)), null, 2)};
final body = <String, dynamic>${JSON.stringify(Object.assign({}, baseData, CommonHelper.dummyCollectionSchemaData(collection, true)), null, 2)};
final record = await pb.collection('${collection?.name}').update('RECORD_ID', body: body);
`}
@@ -134,8 +139,8 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
/api/collections/<strong>{collection.name}</strong>/records/<strong>:id</strong>
</p>
</div>
{#if adminsOnly}
<p class="txt-hint txt-sm txt-right">Requires admin <code>Authorization:TOKEN</code> header</p>
{#if superusersOnly}
<p class="txt-hint txt-sm txt-right">Requires superuser <code>Authorization:TOKEN</code> header</p>
{/if}
</div>
@@ -171,19 +176,7 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
<tbody>
{#if isAuth}
<tr>
<td colspan="3" class="txt-hint">Auth fields</td>
</tr>
<tr>
<td>
<div class="inline-flex">
<span class="label label-warning">Optional</span>
<span>username</span>
</div>
</td>
<td>
<span class="label">String</span>
</td>
<td>The username of the auth record.</td>
<td colspan="3" class="txt-hint txt-bold">Auth specific fields</td>
</tr>
<tr>
<td>
@@ -198,7 +191,7 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
<td>
The auth record email address.
<br />
This field can be updated only by admins or auth records with "Manage" access.
This field can be updated only by superusers or auth records with "Manage" access.
<br />
Regular accounts can update their email by calling "Request email change".
</td>
@@ -206,7 +199,11 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
<tr>
<td>
<div class="inline-flex">
<span class="label label-warning">Optional</span>
{#if collection?.fields?.find((f) => f.name == "emailVisibility")?.required}
<span class="label label-success">Required</span>
{:else}
<span class="label label-warning">Optional</span>
{/if}
<span>emailVisibility</span>
</div>
</td>
@@ -228,8 +225,8 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
<td>
Old auth record password.
<br />
This field is required only when changing the record password. Admins and auth records with
"Manage" access can skip this field.
This field is required only when changing the record password. Superusers and auth records
with "Manage" access can skip this field.
</td>
</tr>
<tr>
@@ -269,15 +266,15 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
<td>
Indicates whether the auth record is verified or not.
<br />
This field can be set only by admins or auth records with "Manage" access.
This field can be set only by superusers or auth records with "Manage" access.
</td>
</tr>
<tr>
<td colspan="3" class="txt-hint">Schema fields</td>
<td colspan="3" class="txt-hint txt-bold">Other fields</td>
</tr>
{/if}
{#each collection?.schema as field (field.name)}
{#each tableFields as field (field.name)}
<tr>
<td>
<div class="inline-flex">
@@ -307,9 +304,7 @@ final record = await pb.collection('${collection?.name}').update('RECORD_ID', bo
File object.<br />
Set to <code>null</code> to delete already uploaded file(s).
{:else if field.type === "relation"}
Relation record {field.options?.maxSelect > 1 ? "ids" : "id"}.
{:else if field.type === "user"}
User {field.options?.maxSelect > 1 ? "ids" : "id"}.
Relation record {field.maxSelect == 1 ? "id" : "ids"}.
{/if}
</td>
</tr>
ui/src/components/collections/docs/ConfirmVerificationDocs.svelte → ui/src/components/collections/docs/VerificationApiConfirmDocs.svelte
-38
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -34,39 +29,6 @@
];
</script>
<h3 class="m-b-sm">Confirm verification ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Confirms <strong>{collection.name}</strong> account verification request.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').confirmVerification('TOKEN');
// optionally refresh the previous authStore state with the latest record changes
await pb.collection('${collection?.name}').authRefresh();
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').confirmVerification('TOKEN');
// optionally refresh the previous authStore state with the latest record changes
await pb.collection('${collection?.name}').authRefresh();
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
ui/src/components/collections/docs/RequestVerificationDocs.svelte → ui/src/components/collections/docs/VerificationApiRequestDocs.svelte
-32
View File
@@ -1,16 +1,11 @@
<script>
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
export let collection;
let responseTab = 204;
let responses = [];
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: responses = [
{
code: 204,
@@ -34,33 +29,6 @@
];
</script>
<h3 class="m-b-sm">Request verification ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> verification email request.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestVerification('test@example.com');
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestVerification('test@example.com');
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="alert alert-success">
<strong class="label label-primary">POST</strong>
<div class="content">
ui/src/components/collections/docs/VerificationDocs.svelte
+74
View File
@@ -0,0 +1,74 @@
<script>
import SdkTabs from "@/components/base/SdkTabs.svelte";
import VerificationApiConfirmDocs from "@/components/collections/docs/VerificationApiConfirmDocs.svelte";
import VerificationApiRequestDocs from "@/components/collections/docs/VerificationApiRequestDocs.svelte";
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
export let collection;
const apiTabs = [
{ title: "Request verification", component: VerificationApiRequestDocs },
{ title: "Confirm verification", component: VerificationApiConfirmDocs },
];
let activeApiTab = 0;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
</script>
<h3 class="m-b-sm">Account verification ({collection.name})</h3>
<div class="content txt-lg m-b-sm">
<p>Sends <strong>{collection.name}</strong> account verification request.</p>
</div>
<SdkTabs
js={`
import PocketBase from 'pocketbase';
const pb = new PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestVerification('test@example.com');
// ---
// (optional) in your custom confirmation page:
// ---
await pb.collection('${collection?.name}').confirmVerification('VERIFICATION_TOKEN');
`}
dart={`
import 'package:pocketbase/pocketbase.dart';
final pb = PocketBase('${backendAbsUrl}');
...
await pb.collection('${collection?.name}').requestVerification('test@example.com');
// ---
// (optional) in your custom confirmation page:
// ---
await pb.collection('${collection?.name}').confirmVerification('VERIFICATION_TOKEN');
`}
/>
<h6 class="m-b-xs">API details</h6>
<div class="tabs">
<div class="tabs-header compact">
{#each apiTabs as tab, i}
<button class="tab-item" class:active={activeApiTab == i} on:click={() => (activeApiTab = i)}>
<div class="txt">{tab.title}</div>
</button>
{/each}
</div>
<div class="tabs-content">
{#each apiTabs as tab, i}
<div class="tab-item" class:active={activeApiTab == i}>
<svelte:component this={tab.component} {collection} />
</div>
{/each}
</div>
</div>
ui/src/components/collections/docs/ViewApiDocs.svelte
+7 -7
View File
@@ -2,7 +2,7 @@
import ApiClient from "@/utils/ApiClient";
import CommonHelper from "@/utils/CommonHelper";
import CodeBlock from "@/components/base/CodeBlock.svelte";
import SdkTabs from "@/components/collections/docs/SdkTabs.svelte";
import SdkTabs from "@/components/base/SdkTabs.svelte";
import FieldsQueryParam from "@/components/collections/docs/FieldsQueryParam.svelte";
export let collection;
@@ -10,9 +10,9 @@
let responseTab = 200;
let responses = [];
$: adminsOnly = collection?.viewRule === null;
$: superusersOnly = collection?.viewRule === null;
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseUrl);
$: backendAbsUrl = CommonHelper.getApiExampleUrl(ApiClient.baseURL);
$: if (collection?.id) {
responses.push({
@@ -20,13 +20,13 @@
body: JSON.stringify(CommonHelper.dummyCollectionRecord(collection), null, 2),
});
if (adminsOnly) {
if (superusersOnly) {
responses.push({
code: 403,
body: `
{
"code": 403,
"message": "Only admins can access this action.",
"message": "Only superusers can access this action.",
"data": {}
}
`,
@@ -84,8 +84,8 @@
/api/collections/<strong>{collection.name}</strong>/records/<strong>:id</strong>
</p>
</div>
{#if adminsOnly}
<p class="txt-hint txt-sm txt-right">Requires admin <code>Authorization:TOKEN</code> header</p>
{#if superusersOnly}
<p class="txt-hint txt-sm txt-right">Requires superuser <code>Authorization:TOKEN</code> header</p>
{/if}
</div>