mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
fix: various issues
This commit is contained in:
Torsten Dittmann
+2
-2
@@ -21,9 +21,9 @@
|
||||
"dependencies": {
|
||||
"@appwrite.io/console": "https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193",
|
||||
"@appwrite.io/pink-icons": "0.25.0",
|
||||
"@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d",
|
||||
"@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17",
|
||||
"@appwrite.io/pink-legacy": "^1.0.0",
|
||||
"@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d",
|
||||
"@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17",
|
||||
"@popperjs/core": "^2.11.8",
|
||||
"@sentry/sveltekit": "^8.38.0",
|
||||
"@stripe/stripe-js": "^3.5.0",
|
||||
|
||||
Generated
+14
-14
@@ -15,14 +15,14 @@ importers:
|
||||
specifier: 0.25.0
|
||||
version: 0.25.0
|
||||
'@appwrite.io/pink-icons-svelte':
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d(svelte@4.2.19)
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17(svelte@4.2.19)
|
||||
'@appwrite.io/pink-legacy':
|
||||
specifier: ^1.0.0
|
||||
version: 1.0.0
|
||||
'@appwrite.io/pink-svelte':
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)
|
||||
'@popperjs/core':
|
||||
specifier: ^2.11.8
|
||||
version: 2.11.8
|
||||
@@ -218,14 +218,14 @@ packages:
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193}
|
||||
version: 1.2.1
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d}
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17}
|
||||
version: 1.0.0-next.7
|
||||
peerDependencies:
|
||||
svelte: ^4.0.0
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7db23371e0bda04d58f48a2f8e9d6db1e8':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7db23371e0bda04d58f48a2f8e9d6db1e8}
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee1707e8eb0699c439e4c81f1bc2e4685244':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee1707e8eb0699c439e4c81f1bc2e4685244}
|
||||
version: 1.0.0-next.7
|
||||
peerDependencies:
|
||||
svelte: ^4.0.0
|
||||
@@ -239,8 +239,8 @@ packages:
|
||||
'@appwrite.io/pink-legacy@1.0.0':
|
||||
resolution: {integrity: sha512-EZk/wX8oDhIsCXf2A0oQjdNOaHvh5MnWbLQI4pAiGrdy5qQGPoU19AK6iVX6z3QoOq7geoEu0zVwAowBy5hZbQ==}
|
||||
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d}
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17}
|
||||
version: 1.0.0-next.85
|
||||
peerDependencies:
|
||||
react-dom: ^18.0.0
|
||||
@@ -4089,11 +4089,11 @@ snapshots:
|
||||
|
||||
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@9193': {}
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7d(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee17(svelte@4.2.19)':
|
||||
dependencies:
|
||||
svelte: 4.2.19
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7db23371e0bda04d58f48a2f8e9d6db1e8(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee1707e8eb0699c439e4c81f1bc2e4685244(svelte@4.2.19)':
|
||||
dependencies:
|
||||
svelte: 4.2.19
|
||||
|
||||
@@ -4106,9 +4106,9 @@ snapshots:
|
||||
'@appwrite.io/pink-icons': 1.0.0
|
||||
the-new-css-reset: 1.11.3
|
||||
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@cc346f7d(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@07edee17(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)':
|
||||
dependencies:
|
||||
'@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@cc346f7db23371e0bda04d58f48a2f8e9d6db1e8(svelte@4.2.19)
|
||||
'@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@07edee1707e8eb0699c439e4c81f1bc2e4685244(svelte@4.2.19)
|
||||
'@floating-ui/dom': 1.6.13
|
||||
'@melt-ui/pp': 0.3.2(@melt-ui/svelte@0.86.2(svelte@4.2.19))(svelte@4.2.19)
|
||||
'@melt-ui/svelte': 0.86.2(svelte@4.2.19)
|
||||
|
||||
+21
-19
@@ -7,6 +7,7 @@
|
||||
import { FormList } from '$lib/elements/forms';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Selector, Typography } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
|
||||
let authMembershipsUserName = $project?.authMembershipsUserName ?? true;
|
||||
@@ -40,27 +41,28 @@
|
||||
<Form onSubmit={updateMembershipsPrivacy}>
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="personal-data">Memberships privacy</Heading>
|
||||
<p>
|
||||
<Typography.Text>
|
||||
Set privacy preferences to manage which details team members can view about one another.
|
||||
</p>
|
||||
</Typography.Text>
|
||||
<svelte:fragment slot="aside">
|
||||
<FormList>
|
||||
<InputChoice
|
||||
bind:value={authMembershipsUserName}
|
||||
id="membershipsUserName"
|
||||
label="Name">
|
||||
Display team members' names to other team members
|
||||
</InputChoice>
|
||||
<InputChoice
|
||||
bind:value={authMembershipsUserEmail}
|
||||
id="membershipsUserEmail"
|
||||
label="Email">
|
||||
Allow team members to view each other's email addresses
|
||||
</InputChoice>
|
||||
<InputChoice bind:value={authMembershipsMfa} id="membershipsMfa" label="MFA status">
|
||||
Show if team members have multi-factor authentication enabled
|
||||
</InputChoice>
|
||||
</FormList>
|
||||
<Selector.Checkbox
|
||||
id="membershipsUserName"
|
||||
label="Name"
|
||||
size="s"
|
||||
description="Display team members' names to other team members"
|
||||
bind:checked={authMembershipsUserName} />
|
||||
<Selector.Checkbox
|
||||
id="membershipsUserEmail"
|
||||
label="Email"
|
||||
size="s"
|
||||
description="Allow team members to view each other's email addresses"
|
||||
bind:checked={authMembershipsUserEmail} />
|
||||
<Selector.Checkbox
|
||||
id="membershipsMfa"
|
||||
label="MFA status"
|
||||
size="s"
|
||||
description="Show if team members have multi-factor authentication enabled"
|
||||
bind:checked={authMembershipsMfa} />
|
||||
</svelte:fragment>
|
||||
<svelte:fragment slot="actions">
|
||||
<Button
|
||||
|
||||
+13
-14
@@ -3,9 +3,10 @@
|
||||
import { Submit, trackError, trackEvent } from '$lib/actions/analytics';
|
||||
import { CardGrid, Heading } from '$lib/components';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { Button, Form, FormList, InputSwitch } from '$lib/elements/forms';
|
||||
import { Button, Form, InputSwitch } from '$lib/elements/forms';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography, Link } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
|
||||
let passwordDictionary = $project?.authPasswordDictionary ?? false;
|
||||
@@ -35,28 +36,26 @@
|
||||
<Form onSubmit={updatePasswordDictionary}>
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="password-dictionary">Password dictionary</Heading>
|
||||
|
||||
<svelte:fragment slot="aside">
|
||||
<FormList>
|
||||
<InputSwitch
|
||||
bind:value={passwordDictionary}
|
||||
id="passwordDictionary"
|
||||
label="Password dictionary" />
|
||||
</FormList>
|
||||
<p class="text">
|
||||
<InputSwitch
|
||||
bind:value={passwordDictionary}
|
||||
id="passwordDictionary"
|
||||
label="Password dictionary" />
|
||||
<Typography.Text>
|
||||
Enabling this option prevent users from setting insecure passwords by comparing the
|
||||
user's password with the <a
|
||||
user's password with the <Link.Anchor
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="link"
|
||||
href="https://github.com/danielmiessler/SecLists/blob/master/Passwords/Common-Credentials/10k-most-common.txt"
|
||||
>10k most commonly used passwords.</a>
|
||||
</p>
|
||||
>10k most commonly used passwords.</Link.Anchor>
|
||||
</Typography.Text>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
<Button disabled={passwordDictionary === $project?.authPasswordDictionary} submit
|
||||
>Update</Button>
|
||||
<Button disabled={passwordDictionary === $project?.authPasswordDictionary} submit>
|
||||
Update
|
||||
</Button>
|
||||
</svelte:fragment>
|
||||
</CardGrid>
|
||||
</Form>
|
||||
|
||||
@@ -4,11 +4,10 @@
|
||||
import { CardGrid, Heading } from '$lib/components';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { Button, Form, InputNumber, InputSwitch } from '$lib/elements/forms';
|
||||
import FormList from '$lib/elements/forms/formList.svelte';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
import { tick } from 'svelte';
|
||||
|
||||
let passwordHistory = $project?.authPasswordHistory < 1 ? 5 : $project?.authPasswordHistory;
|
||||
let passwordHistoryEnabled = ($project?.authPasswordHistory ?? 0) !== 0;
|
||||
@@ -35,43 +34,30 @@
|
||||
trackError(error, Submit.AuthPasswordHistoryUpdate);
|
||||
}
|
||||
}
|
||||
|
||||
let maxSessionInputField: InputNumber | null = null;
|
||||
|
||||
$: if (passwordHistoryEnabled && maxSessionInputField) {
|
||||
tick().then(() => {
|
||||
maxSessionInputField.addInputFocus();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<Form onSubmit={updatePasswordHistoryLimit}>
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="password-history">Password history</Heading>
|
||||
<svelte:fragment slot="aside">
|
||||
<FormList>
|
||||
<InputSwitch
|
||||
bind:value={passwordHistoryEnabled}
|
||||
id="passwordHistoryEnabled"
|
||||
label="Password history" />
|
||||
</FormList>
|
||||
<p class="text">
|
||||
<InputSwitch
|
||||
bind:value={passwordHistoryEnabled}
|
||||
id="passwordHistoryEnabled"
|
||||
label="Password history" />
|
||||
<Typography.Text>
|
||||
Enabling this option prevents users from reusing recent passwords by comparing the
|
||||
new password with their password history.
|
||||
</p>
|
||||
<p class="text">
|
||||
</Typography.Text>
|
||||
<Typography.Text>
|
||||
Set the maximum number of passwords saved per user. Maximum 20 passwords.
|
||||
</p>
|
||||
<FormList>
|
||||
<InputNumber
|
||||
max={20}
|
||||
min={1}
|
||||
id="max-session"
|
||||
label="Limit"
|
||||
bind:this={maxSessionInputField}
|
||||
disabled={!passwordHistoryEnabled}
|
||||
bind:value={passwordHistory} />
|
||||
</FormList>
|
||||
</Typography.Text>
|
||||
<InputNumber
|
||||
max={20}
|
||||
min={1}
|
||||
id="password-history"
|
||||
label="Limit"
|
||||
disabled={!passwordHistoryEnabled}
|
||||
bind:value={passwordHistory} />
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
|
||||
+10
-11
@@ -4,9 +4,9 @@
|
||||
import { CardGrid, Heading } from '$lib/components';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { Button, Form, InputSwitch } from '$lib/elements/forms';
|
||||
import { FormList } from '$lib/elements/forms';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
|
||||
let authPersonalDataCheck = $project?.authPersonalDataCheck ?? false;
|
||||
@@ -37,18 +37,17 @@
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="personal-data">Personal data</Heading>
|
||||
<svelte:fragment slot="aside">
|
||||
<FormList>
|
||||
<InputSwitch
|
||||
bind:value={authPersonalDataCheck}
|
||||
id="personalDataCheck"
|
||||
label="Disallow personal data" />
|
||||
</FormList>
|
||||
<p class="text">
|
||||
<InputSwitch
|
||||
bind:value={authPersonalDataCheck}
|
||||
id="personalDataCheck"
|
||||
label="Disallow personal data" />
|
||||
<Typography.Text>
|
||||
Do not allow passwords that contain any part of the user's personal data. This
|
||||
includes the user's <code>name</code>, <code>email</code>, or <code>phone</code>.
|
||||
</p>
|
||||
includes the user's <Typography.Code>name</Typography.Code>, <Typography.Code
|
||||
>email</Typography.Code
|
||||
>, or <Typography.Code>phone</Typography.Code>.
|
||||
</Typography.Text>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
<Button disabled={authPersonalDataCheck === $project?.authPersonalDataCheck} submit
|
||||
>Update</Button>
|
||||
|
||||
@@ -4,9 +4,9 @@
|
||||
import { CardGrid, Heading } from '$lib/components';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { Button, Form, InputSwitch } from '$lib/elements/forms';
|
||||
import { FormList } from '$lib/elements/forms';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
|
||||
let authSessionAlerts = $project?.authSessionAlerts ?? false;
|
||||
@@ -34,17 +34,14 @@
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="personal-data">Session alerts</Heading>
|
||||
<svelte:fragment slot="aside">
|
||||
<FormList>
|
||||
<InputSwitch
|
||||
bind:value={authSessionAlerts}
|
||||
id="authSessionAlerts"
|
||||
label="Session alerts" />
|
||||
</FormList>
|
||||
<p class="text">
|
||||
<InputSwitch
|
||||
bind:value={authSessionAlerts}
|
||||
id="authSessionAlerts"
|
||||
label="Session alerts" />
|
||||
<Typography.Text>
|
||||
Enabling this option will send an email to the users when a new session is created.
|
||||
</p>
|
||||
</Typography.Text>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
<Button disabled={authSessionAlerts === $project?.authSessionAlerts} submit>
|
||||
Update
|
||||
|
||||
@@ -35,18 +35,16 @@
|
||||
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="session-length">Session length</Heading>
|
||||
|
||||
<p>
|
||||
If you reduce the limit, users who are currently logged in will be logged out of the
|
||||
application.
|
||||
</p>
|
||||
<svelte:fragment slot="aside">
|
||||
<Layout.Stack>
|
||||
<Layout.Stack direction="row">
|
||||
<InputNumber id="length" label="Length" bind:value={$value} min={0} />
|
||||
<InputSelect id="period" label="Time period" bind:value={$unit} {options} />
|
||||
</Layout.Stack>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
<Button disabled={$baseValue === $project.authDuration} on:click={updateSessionLength}>
|
||||
Update
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
import { Button, Form, InputNumber } from '$lib/elements/forms';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
|
||||
let maxSessions = $project?.authSessionsLimit;
|
||||
@@ -33,13 +34,13 @@
|
||||
<Form onSubmit={updateSessionsLimit}>
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="sessions-limit">Sessions limit</Heading>
|
||||
<p>Maximum number of active sessions allowed per user.</p>
|
||||
<svelte:fragment slot="aside">
|
||||
<ul>
|
||||
<InputNumber id="max-session" label="Limit" bind:value={maxSessions} />
|
||||
</ul>
|
||||
</svelte:fragment>
|
||||
<Typography.Text>
|
||||
<p>Maximum number of active sessions allowed per user.</p>
|
||||
</Typography.Text>
|
||||
|
||||
<svelte:fragment slot="aside">
|
||||
<InputNumber id="max-session" label="Limit" bind:value={maxSessions} />
|
||||
</svelte:fragment>
|
||||
<svelte:fragment slot="actions">
|
||||
<Button disabled={maxSessions === $project?.authSessionsLimit} submit>Update</Button>
|
||||
</svelte:fragment>
|
||||
|
||||
@@ -5,13 +5,15 @@
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { Pill } from '$lib/elements';
|
||||
import { Button } from '$lib/elements/forms';
|
||||
import { clickOnEnter } from '$lib/helpers/a11y';
|
||||
import { addNotification } from '$lib/stores/notifications';
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { Typography, Layout, Selector, Input } from '@appwrite.io/pink-svelte';
|
||||
import { project } from '../../store';
|
||||
import { tick } from 'svelte';
|
||||
|
||||
let isLimited = $project?.authLimit !== 0;
|
||||
let value = $project?.authLimit !== 0 ? 'limited' : 'unlimited';
|
||||
|
||||
$: isLimited = value === 'limited';
|
||||
let newLimit = isLimited ? $project?.authLimit : 100;
|
||||
|
||||
$: btnDisabled = (function isBtnDisabled() {
|
||||
@@ -54,62 +56,38 @@
|
||||
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7" id="users-limit">Users limit</Heading>
|
||||
<p>
|
||||
<Typography.Text>
|
||||
Limit new users from signing up for your project, regardless of authentication method. You
|
||||
can still create users and team memberships from your Appwrite console.
|
||||
</p>
|
||||
</Typography.Text>
|
||||
|
||||
<svelte:fragment slot="aside">
|
||||
<ul class="form-list">
|
||||
<li class="form-item">
|
||||
<label class="choice-item" for="unlimited">
|
||||
<input
|
||||
id="unlimited"
|
||||
name="authLimit"
|
||||
class="u-cross-child-center"
|
||||
required
|
||||
type="radio"
|
||||
bind:group={isLimited}
|
||||
value={false} />
|
||||
<div class="choice-item-content u-cross-child-center">
|
||||
<div class="choice-item-title">Unlimited</div>
|
||||
</div>
|
||||
<Pill>recommended</Pill>
|
||||
</label>
|
||||
</li>
|
||||
<li class="form-item is-multiple u-cross-center">
|
||||
<div class="input-text-wrapper">
|
||||
<label class="choice-item" for="limited">
|
||||
<input
|
||||
id="limited"
|
||||
name="authLimit"
|
||||
required
|
||||
type="radio"
|
||||
bind:group={isLimited}
|
||||
value={true} />
|
||||
<div class="choice-item-content u-padding-inline-end-16">
|
||||
<div class="choice-item-title">Limited</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
class="input-text-wrapper u-stretch"
|
||||
on:click={() => (isLimited = true)}
|
||||
on:keyup|self={clickOnEnter}
|
||||
role="button"
|
||||
tabindex="0">
|
||||
<input
|
||||
type="number"
|
||||
name="limit"
|
||||
id="limit"
|
||||
class="input-text"
|
||||
max="10000"
|
||||
disabled={!isLimited}
|
||||
bind:value={newLimit}
|
||||
bind:this={maxUsersInputField} />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<Layout.Stack>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<Selector.Radio
|
||||
bind:group={value}
|
||||
name="authLimit"
|
||||
id="unlimited"
|
||||
label="Unlimited"
|
||||
value="unlimited" />
|
||||
<Pill>recommended</Pill>
|
||||
</Layout.Stack>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<Selector.Radio
|
||||
bind:group={value}
|
||||
name="authLimit"
|
||||
id="limited"
|
||||
label="Limited"
|
||||
value="limited" />
|
||||
<Input.Number
|
||||
name="limit"
|
||||
id="limit"
|
||||
class="input-text"
|
||||
max="10000"
|
||||
disabled={!isLimited}
|
||||
bind:value={newLimit} />
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
import type { Models } from '@appwrite.io/console';
|
||||
import { project } from '../../store';
|
||||
import { base } from '$app/paths';
|
||||
import { Layout } from '@appwrite.io/pink-svelte';
|
||||
import { Layout, Typography } from '@appwrite.io/pink-svelte';
|
||||
|
||||
const projectId = $page.params.project;
|
||||
let showProvider = false;
|
||||
@@ -48,15 +48,17 @@
|
||||
<Container>
|
||||
<CardGrid>
|
||||
<Heading tag="h2" size="7">Auth methods</Heading>
|
||||
<p>Enable the authentication methods you wish to use.</p>
|
||||
<Typography.Text>Enable the authentication methods you wish to use.</Typography.Text>
|
||||
<svelte:fragment slot="aside">
|
||||
<Layout.Stack gap="l" direction="row" wrap="wrap">
|
||||
{#each $authMethods.list as box}
|
||||
<InputSwitch
|
||||
label={box.label}
|
||||
id={box.method}
|
||||
bind:value={box.value}
|
||||
on:change={() => authUpdate(box)} />
|
||||
<div style="flex-basis: 45%;">
|
||||
<InputSwitch
|
||||
label={box.label}
|
||||
id={box.method}
|
||||
bind:value={box.value}
|
||||
on:change={() => authUpdate(box)} />
|
||||
</div>
|
||||
{/each}
|
||||
</Layout.Stack>
|
||||
</svelte:fragment>
|
||||
|
||||
@@ -15,15 +15,13 @@
|
||||
import Create from '../createTeam.svelte';
|
||||
import { goto } from '$app/navigation';
|
||||
import { toLocaleDateTime } from '$lib/helpers/date';
|
||||
import { Container, ContainerHeader } from '$lib/layout';
|
||||
import { Container } from '$lib/layout';
|
||||
import { base } from '$app/paths';
|
||||
import type { Models } from '@appwrite.io/console';
|
||||
import type { PageData } from './$types';
|
||||
import { writable } from 'svelte/store';
|
||||
import { readOnly } from '$lib/stores/billing';
|
||||
import { isCloud } from '$lib/system';
|
||||
import { canWriteTeams } from '$lib/stores/roles';
|
||||
import { Tooltip, Layout, Table } from '@appwrite.io/pink-svelte';
|
||||
import { Layout, Table } from '@appwrite.io/pink-svelte';
|
||||
|
||||
export let data: PageData;
|
||||
|
||||
|
||||
+49
-53
@@ -7,15 +7,6 @@
|
||||
SearchQuery,
|
||||
PaginationWithLimit
|
||||
} from '$lib/components';
|
||||
import {
|
||||
Table,
|
||||
TableHeader,
|
||||
TableBody,
|
||||
TableRowLink,
|
||||
TableCellHead,
|
||||
TableCellText,
|
||||
TableCell
|
||||
} from '$lib/elements/table';
|
||||
import { Button } from '$lib/elements/forms';
|
||||
import { Container } from '$lib/layout';
|
||||
import type { Models } from '@appwrite.io/console';
|
||||
@@ -27,6 +18,7 @@
|
||||
import DeleteMembership from '../deleteMembership.svelte';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { trackEvent } from '$lib/actions/analytics';
|
||||
import { Table, Layout } from '@appwrite.io/pink-svelte';
|
||||
|
||||
export let data: PageData;
|
||||
|
||||
@@ -42,51 +34,55 @@
|
||||
</script>
|
||||
|
||||
<Container>
|
||||
<SearchQuery search={data.search} placeholder="Search by ID">
|
||||
<Button on:click={() => (showCreate = true)} event="create_membership">
|
||||
<span class="icon-plus" aria-hidden="true" />
|
||||
<span class="text">Create membership</span>
|
||||
</Button>
|
||||
</SearchQuery>
|
||||
<Layout.Stack direction="row" justifyContent="space-between">
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<SearchQuery search={data.search} placeholder="Search by ID" />
|
||||
</Layout.Stack>
|
||||
<Layout.Stack direction="row" alignItems="center" justifyContent="flex-end">
|
||||
<Button on:mousedown={() => (showCreate = true)} event="create_membership" size="s">
|
||||
<span class="icon-plus" aria-hidden="true" />
|
||||
<span class="text">Create membership</span>
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
|
||||
{#if data.memberships.total}
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableCellHead>Name</TableCellHead>
|
||||
<TableCellHead onlyDesktop>Roles</TableCellHead>
|
||||
<TableCellHead onlyDesktop>Joined</TableCellHead>
|
||||
<TableCellHead width={30} />
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{#each data.memberships.memberships as membership}
|
||||
{@const username = membership.userName ? membership.userName : '-'}
|
||||
<TableRowLink
|
||||
href={`${base}/project-${project}/auth/user-${membership.userId}`}>
|
||||
<TableCellText title="Name">
|
||||
<div class="u-flex u-gap-12 u-cross-center">
|
||||
<AvatarInitials size={32} name={username} />
|
||||
<span>{username}</span>
|
||||
</div>
|
||||
</TableCellText>
|
||||
<TableCellText onlyDesktop title="Roles">{membership.roles}</TableCellText>
|
||||
<TableCellText onlyDesktop title="Joined">
|
||||
{toLocaleDateTime(membership.joined)}
|
||||
</TableCellText>
|
||||
<TableCell>
|
||||
<button
|
||||
class="button is-only-icon is-text"
|
||||
aria-label="Delete item"
|
||||
on:click|preventDefault={() => {
|
||||
selectedMembership = membership;
|
||||
showDelete = true;
|
||||
trackEvent('click_delete_membership');
|
||||
}}>
|
||||
<span class="icon-trash" aria-hidden="true" />
|
||||
</button>
|
||||
</TableCell>
|
||||
</TableRowLink>
|
||||
{/each}
|
||||
</TableBody>
|
||||
</Table>
|
||||
<Table.Root>
|
||||
<svelte:fragment slot="header">
|
||||
<Table.Header.Cell>Name</Table.Header.Cell>
|
||||
<Table.Header.Cell>Roles</Table.Header.Cell>
|
||||
<Table.Header.Cell>Joined</Table.Header.Cell>
|
||||
<Table.Header.Cell width="40px" />
|
||||
</svelte:fragment>
|
||||
{#each data.memberships.memberships as membership}
|
||||
<Table.Link href={`${base}/project-${project}/auth/user-${membership.userId}`}>
|
||||
<Table.Cell>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<AvatarInitials size={32} name={membership.teamName} />
|
||||
<span>{membership.teamName ? membership.teamName : 'n/a'}</span>
|
||||
</Layout.Stack>
|
||||
</Table.Cell>
|
||||
<Table.Cell>
|
||||
{membership.roles}
|
||||
</Table.Cell>
|
||||
<Table.Cell>
|
||||
{toLocaleDateTime(membership.joined)}
|
||||
</Table.Cell>
|
||||
<Table.Cell>
|
||||
<button
|
||||
class="button is-only-icon is-text"
|
||||
aria-label="Delete item"
|
||||
on:click|preventDefault={() => {
|
||||
selectedMembership = membership;
|
||||
showDelete = true;
|
||||
trackEvent('click_delete_membership');
|
||||
}}>
|
||||
<span class="icon-trash" aria-hidden="true" />
|
||||
</button>
|
||||
</Table.Cell>
|
||||
</Table.Link>
|
||||
{/each}
|
||||
</Table.Root>
|
||||
|
||||
<PaginationWithLimit
|
||||
name="Memberships"
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
import { sdk } from '$lib/stores/sdk';
|
||||
import { onMount } from 'svelte';
|
||||
import { team } from './store';
|
||||
import { Layout } from '@appwrite.io/pink-svelte';
|
||||
|
||||
$: if (prefs) {
|
||||
if (JSON.stringify(prefs) !== JSON.stringify(Object.entries($team.prefs))) {
|
||||
@@ -62,57 +63,52 @@
|
||||
objects so they can easily be shared across members.
|
||||
</p>
|
||||
<svelte:fragment slot="aside">
|
||||
<form class="form u-grid u-gap-16">
|
||||
<ul class="form-list">
|
||||
{#if prefs}
|
||||
{#each prefs as [key, value], index}
|
||||
<InputText
|
||||
id={`key-${index}`}
|
||||
bind:value={key}
|
||||
placeholder="Enter key"
|
||||
label="Key"
|
||||
required />
|
||||
|
||||
<InputText
|
||||
id={`value-${index}`}
|
||||
bind:value
|
||||
placeholder="Enter value"
|
||||
label="Value"
|
||||
required />
|
||||
<Button
|
||||
text
|
||||
disabled={(!key || !value) && index === 0}
|
||||
on:click={() => {
|
||||
if (index === 0) {
|
||||
prefs = [['', '']];
|
||||
} else {
|
||||
prefs.splice(index, 1);
|
||||
prefs = prefs;
|
||||
}
|
||||
}}>
|
||||
<span class="icon-x" aria-hidden="true" />
|
||||
</Button>
|
||||
{/each}
|
||||
{/if}
|
||||
</ul>
|
||||
<Button
|
||||
noMargin
|
||||
text
|
||||
disabled={prefs?.length &&
|
||||
prefs[prefs.length - 1][0] &&
|
||||
prefs[prefs.length - 1][1]
|
||||
? false
|
||||
: true}
|
||||
on:click={() => {
|
||||
if (prefs[prefs.length - 1][0] && prefs[prefs.length - 1][1]) {
|
||||
prefs.push(['', '']);
|
||||
prefs = prefs;
|
||||
}
|
||||
}}>
|
||||
<span class="icon-plus" aria-hidden="true" />
|
||||
<span class="text">Add Preference</span>
|
||||
</Button>
|
||||
</form>
|
||||
{#if prefs}
|
||||
{#each prefs as [key, value], index}
|
||||
<Layout.Stack direction="row" alignItems="flex-end">
|
||||
<InputText
|
||||
id={`key-${index}`}
|
||||
bind:value={key}
|
||||
placeholder="Enter key"
|
||||
label="Key"
|
||||
required />
|
||||
<InputText
|
||||
id={`value-${index}`}
|
||||
bind:value
|
||||
placeholder="Enter value"
|
||||
label="Value"
|
||||
required />
|
||||
<Button
|
||||
text
|
||||
icon
|
||||
disabled={(!key || !value) && index === 0}
|
||||
on:click={() => {
|
||||
if (index === 0 && prefs?.length === 1) {
|
||||
prefs = [['', '']];
|
||||
} else {
|
||||
prefs.splice(index, 1);
|
||||
prefs = prefs;
|
||||
}
|
||||
}}>
|
||||
<span class="icon-x" aria-hidden="true" />
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
{/each}
|
||||
{/if}
|
||||
<Button
|
||||
text
|
||||
disabled={prefs?.length && prefs[prefs.length - 1][0] && prefs[prefs.length - 1][1]
|
||||
? false
|
||||
: true}
|
||||
on:click={() => {
|
||||
if (prefs[prefs.length - 1][0] && prefs[prefs.length - 1][1]) {
|
||||
prefs.push(['', '']);
|
||||
prefs = prefs;
|
||||
}
|
||||
}}>
|
||||
<span class="icon-plus" aria-hidden="true" />
|
||||
<span class="text">Add Preference</span>
|
||||
</Button>
|
||||
</svelte:fragment>
|
||||
|
||||
<svelte:fragment slot="actions">
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
<Table.Header.Cell>Name</Table.Header.Cell>
|
||||
<Table.Header.Cell>Roles</Table.Header.Cell>
|
||||
<Table.Header.Cell>Joined</Table.Header.Cell>
|
||||
<Table.Header.Cell />
|
||||
<Table.Header.Cell width="40px" />
|
||||
</svelte:fragment>
|
||||
{#each data.memberships.memberships as membership}
|
||||
<Table.Link
|
||||
|
||||
@@ -2,7 +2,7 @@ import type { Column } from '$lib/helpers/types';
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
export const columns = writable<Column[]>([
|
||||
{ id: '$id', title: 'Database ID', type: 'string', show: true, width: 150 },
|
||||
{ id: '$id', title: 'Bucket ID', type: 'string', show: true, width: 150 },
|
||||
{ id: 'name', title: 'Name', type: 'string', show: true, width: 120 },
|
||||
{ id: '$createdAt', title: 'Created', type: 'datetime', show: true, width: 120 },
|
||||
{ id: '$updatedAt', title: 'Updated', type: 'datetime', show: true, width: 120 }
|
||||
|
||||
Reference in New Issue
Block a user