Merge branch 'main' of github.com:appwrite/appwrite-console-poc into fix-qa-review-v1

This commit is contained in:
Arman
2022-11-10 09:33:30 +01:00
16 changed files with 638 additions and 595 deletions
@@ -1,59 +1,43 @@
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { sdkForProject } from '$lib/stores/sdk';
export async function submitBoolean(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeBoolean>
) {
await sdkForProject.databases.createBooleanAttribute(
databaseId,
collectionId,
key,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
<script lang="ts">
import { InputChoice, InputSelect } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let submitted = false;
export let key: string;
export let overview = false;
export let selectedAttribute: Models.AttributeBoolean;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let xdefault: boolean | null,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createBooleanAttribute(
databaseId,
$collection.$id,
key,
required,
xdefault ?? undefined,
array
);
dispatch('created', attribute);
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
export let selectedAttribute: Models.AttributeBoolean = null;
export let data: Partial<Models.AttributeBoolean> = {
required: false,
array: false,
default: null
};
$: if (submitted) {
submit();
$: if (selectedAttribute) {
data.required = selectedAttribute.required;
data.array = selectedAttribute.array;
data.default = selectedAttribute.default;
}
$: if (overview) {
({ required, array } = selectedAttribute);
xdefault = selectedAttribute.default;
$: if (data.required || data.array) {
data.default = null;
}
$: if (required || array) {
xdefault = null;
}
//TODO: refactor to use context module instead of submitted
</script>
<InputSelect
@@ -65,9 +49,19 @@
{ label: 'True', value: true },
{ label: 'False', value: false }
]}
bind:value={xdefault}
disabled={overview || array || required} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={!!selectedAttribute || data.array || data.required} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,69 +1,54 @@
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { sdkForProject } from '$lib/stores/sdk';
export async function submitDatetime(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeDatetime>
) {
await sdkForProject.databases.createDatetimeAttribute(
databaseId,
collectionId,
key,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
<script lang="ts">
import { InputChoice, InputDateTime } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeDatetime;
export let selectedAttribute: Models.AttributeDatetime = null;
export let data: Partial<Models.AttributeDatetime>;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let xdefault: string,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createDatetimeAttribute(
databaseId,
$collection.$id,
key,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
$: if (selectedAttribute) {
data.required = selectedAttribute.required;
data.array = selectedAttribute.array;
data.default = selectedAttribute.default;
}
$: if (overview) {
({ required, array } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required) {
xdefault = null;
$: if (data.required) {
data.default = null;
}
</script>
<InputDateTime
id="default"
label="Default value"
bind:value={xdefault}
disabled={required}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={data.required}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice id="array" label="Array" bind:value={data.array} disabled={!!selectedAttribute}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,70 +1,59 @@
<script lang="ts">
import { InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
import InputEmail from '$lib/elements/forms/inputEmail.svelte';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeEmail;
import { sdkForProject } from '$lib/stores/sdk';
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
export async function submitEmail(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeEmail>
) {
await sdkForProject.databases.createEmailAttribute(
databaseId,
collectionId,
key,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
let xdefault: string,
required = false,
array = false;
<script lang="ts">
import { InputChoice, InputEmail } from '$lib/elements/forms';
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createEmailAttribute(
databaseId,
$collection.$id,
key,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
export let selectedAttribute: Models.AttributeEmail = null;
export let data: Partial<Models.AttributeEmail>;
$: if (submitted) {
submit();
$: if (selectedAttribute) {
data.required = selectedAttribute.required;
data.array = selectedAttribute.array;
data.default = selectedAttribute.default;
}
$: if (overview) {
({ required, array } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputEmail
id="default"
label="Default value"
bind:value={xdefault}
disabled={required}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={data.required}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,81 +1,73 @@
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { sdkForProject } from '$lib/stores/sdk';
export async function submitEnum(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeEnum>
) {
await sdkForProject.databases.createEnumAttribute(
databaseId,
collectionId,
key,
data.elements,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
<script lang="ts">
import { InputChoice, InputSelect, InputTags } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeEnum;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let xdefault = '',
elements: string[],
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createEnumAttribute(
databaseId,
$collection.$id,
key,
elements,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
export let data: Partial<Models.AttributeEnum>;
$: options =
elements?.map((e) => ({
data.elements?.map((e) => ({
value: e,
label: e
})) ?? [];
$: if (submitted) {
submit();
$: if (selectedAttribute) {
({
required: data.required,
array: data.array,
elements: data.elements,
default: data.default
} = selectedAttribute);
}
$: if (overview) {
({ required, array, elements } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputTags
id="elements"
label="Elements"
bind:tags={elements}
bind:tags={data.elements}
placeholder="Add elements here"
readonly={overview} />
readonly={!!selectedAttribute} />
<InputSelect
id="default"
label="Default value"
bind:options
bind:value={xdefault}
disabled={overview || required} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={!!selectedAttribute || data.required} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,79 +1,76 @@
<script lang="ts">
import { InputNumber, InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
import { sdkForProject } from '$lib/stores/sdk';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeFloat;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let min: number,
max: number,
xdefault: number,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createFloatAttribute(
databaseId,
$collection.$id,
key,
required,
min,
max,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
}
$: if (overview) {
({ required, array, min, max } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
export async function submitFloat(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeFloat>
) {
await sdkForProject.databases.createFloatAttribute(
databaseId,
collectionId,
key,
data.required,
data.min,
data.max,
data.default ? data.default : undefined,
data.array
);
}
</script>
<InputNumber id="min" label="Min" bind:value={min} readonly={overview} />
<InputNumber id="max" label="Max" bind:value={max} readonly={overview} />
<script lang="ts">
import { InputNumber, InputChoice } from '$lib/elements/forms';
export let selectedAttribute: Models.AttributeFloat;
export let data: Partial<Models.AttributeFloat> = {
required: false,
min: 0,
max: 0,
default: 0,
array: false
};
$: if (selectedAttribute) {
({
required: data.required,
array: data.array,
min: data.min,
max: data.max
} = selectedAttribute);
data.default = selectedAttribute.default;
}
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputNumber id="min" label="Min" bind:value={data.min} readonly={!!selectedAttribute} />
<InputNumber id="max" label="Max" bind:value={data.max} readonly={!!selectedAttribute} />
<InputNumber
id="default"
label="Default value"
{min}
{max}
bind:value={xdefault}
disabled={required || array}
readonly={overview}
min={data.min}
max={data.max}
bind:value={data.default}
disabled={data.required || data.array}
readonly={!!selectedAttribute}
step="any" />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,77 +1,74 @@
<script lang="ts">
import { InputNumber, InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
<script context="module" lang="ts">
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let key: string = null;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeInteger;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let min: number,
max: number,
xdefault: number,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createIntegerAttribute(
databaseId,
$collection.$id,
key,
required,
min,
max,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
}
$: if (overview) {
({ required, array, min, max } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
export async function submitInteger(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeInteger>
) {
await sdkForProject.databases.createIntegerAttribute(
databaseId,
collectionId,
key,
data.required,
data.min,
data.max,
data.default ? data.default : undefined,
data.array
);
}
</script>
<InputNumber id="min" label="Min" bind:value={min} readonly={overview} />
<InputNumber id="max" label="Max" bind:value={max} readonly={overview} />
<script lang="ts">
import { InputNumber, InputChoice } from '$lib/elements/forms';
export let selectedAttribute: Models.AttributeInteger;
export let data: Partial<Models.AttributeInteger> = {
required: false,
min: 0,
max: 0,
default: 0,
array: false
};
$: if (selectedAttribute) {
({
required: data.required,
array: data.array,
min: data.min,
max: data.max,
default: data.default
} = selectedAttribute);
}
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputNumber id="min" label="Min" bind:value={data.min} readonly={!!selectedAttribute} />
<InputNumber id="max" label="Max" bind:value={data.max} readonly={!!selectedAttribute} />
<InputNumber
id="default"
label="Default value"
{min}
{max}
bind:value={xdefault}
disabled={required || array}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
min={data.min}
max={data.max}
bind:value={data.default}
disabled={data.required || data.array}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,68 +1,55 @@
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { sdkForProject } from '$lib/stores/sdk';
export async function submitIp(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeIp>
) {
await sdkForProject.databases.createIpAttribute(
databaseId,
collectionId,
key,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
<script lang="ts">
import { InputText, InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeIp;
export let data: Partial<Models.AttributeIp>;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let xdefault: string,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createIpAttribute(
databaseId,
$collection.$id,
key,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
$: if (selectedAttribute) {
({ required: data.required, array: data.array, default: data.default } = selectedAttribute);
}
$: if (overview) {
({ required, array } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputText
id="default"
label="Default value"
bind:value={xdefault}
disabled={required || array}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={data.required || data.array}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,19 +1,26 @@
import type { SvelteComponent } from 'svelte';
import { writable } from 'svelte/store';
import Boolean from './boolean.svelte';
import Email from './email.svelte';
import Enum from './enum.svelte';
import Float from './float.svelte';
import Integer from './integer.svelte';
import Ip from './ip.svelte';
import String from './string.svelte';
import Url from './url.svelte';
import Datetime from './datetime.svelte';
import Boolean, { submitBoolean } from './boolean.svelte';
import Email, { submitEmail } from './email.svelte';
import Enum, { submitEnum } from './enum.svelte';
import Float, { submitFloat } from './float.svelte';
import Integer, { submitInteger } from './integer.svelte';
import Ip, { submitIp } from './ip.svelte';
import String, { submitString } from './string.svelte';
import Url, { submitUrl } from './url.svelte';
import Datetime, { submitDatetime } from './datetime.svelte';
import type { Attributes } from '../store';
export type Option = {
name: string;
component: typeof SvelteComponent;
type: 'string' | 'integer' | 'double' | 'boolean' | 'datetime';
func: (
databaseId: string,
collectionId: string,
key: string,
data: Partial<Attributes>
) => Promise<void>;
format?: 'email' | 'ip' | 'url' | 'enum';
};
@@ -21,51 +28,60 @@ export const options: Option[] = [
{
name: 'String',
component: String,
type: 'string'
type: 'string',
func: submitString
},
{
name: 'Integer',
component: Integer,
type: 'integer'
type: 'integer',
func: submitInteger
},
{
name: 'Float',
component: Float,
type: 'double'
type: 'double',
func: submitFloat
},
{
name: 'Boolean',
component: Boolean,
type: 'boolean'
type: 'boolean',
func: submitBoolean
},
{
name: 'Datetime',
component: Datetime,
type: 'datetime'
type: 'datetime',
func: submitDatetime
},
{
name: 'Email',
component: Email,
type: 'string',
format: 'email'
format: 'email',
func: submitEmail
},
{
name: 'IP',
component: Ip,
type: 'string',
format: 'ip'
format: 'ip',
func: submitIp
},
{
name: 'URL',
component: Url,
type: 'string',
format: 'url'
format: 'url',
func: submitUrl
},
{
name: 'Enum',
component: Enum,
type: 'string',
format: 'enum'
format: 'enum',
func: submitEnum
}
];
@@ -1,72 +1,73 @@
<script lang="ts">
import { InputNumber, InputText, InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
import { sdkForProject } from '$lib/stores/sdk';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeString;
const databaseId = $page.params.database;
let xdefault: string,
size = 255,
required = false,
array = false;
const dispatch = createEventDispatcher();
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createStringAttribute(
databaseId,
$collection.$id,
key,
size,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
}
$: if (overview) {
({ required, array, size } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
export async function submitString(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeString>
) {
await sdkForProject.databases.createStringAttribute(
databaseId,
collectionId,
key,
data.size,
data.required,
data.default ? (data.default as string) : undefined,
data.array
);
}
</script>
<InputNumber id="size" label="Size" bind:value={size} required readonly={overview} />
<script lang="ts">
import { InputNumber, InputText, InputChoice } from '$lib/elements/forms';
export let selectedAttribute: Models.AttributeString;
export let data: Partial<Models.AttributeString> = {
required: false,
size: 0,
default: null,
array: false
};
$: if (selectedAttribute) {
({
required: data.required,
array: data.array,
size: data.size,
default: data.default
} = selectedAttribute);
}
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputNumber
id="size"
label="Size"
bind:value={data.size}
required
readonly={!!selectedAttribute} />
<InputText
id="default"
label="Default value"
bind:value={xdefault}
maxlength={size}
disabled={required || array}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
maxlength={data.size}
disabled={data.required || data.array}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -1,68 +1,55 @@
<script context="module" lang="ts">
import type { Models } from '@aw-labs/appwrite-console';
import { sdkForProject } from '$lib/stores/sdk';
export async function submitUrl(
databaseId: string,
collectionId: string,
key: string,
data: Partial<Models.AttributeUrl>
) {
await sdkForProject.databases.createUrlAttribute(
databaseId,
collectionId,
key,
data.required,
data.default ? data.default : undefined,
data.array
);
}
</script>
<script lang="ts">
import { InputText, InputChoice } from '$lib/elements/forms';
import { addNotification } from '$lib/stores/notifications';
import { sdkForProject } from '$lib/stores/sdk';
import { createEventDispatcher } from 'svelte';
import { collection } from '../store';
import type { Models } from '@aw-labs/appwrite-console';
import { page } from '$app/stores';
export let key: string;
export let submitted = false;
export let overview = false;
export let selectedAttribute: Models.AttributeUrl;
export let data: Partial<Models.AttributeUrl>;
const databaseId = $page.params.database;
const dispatch = createEventDispatcher();
let xdefault: string,
required = false,
array = false;
const submit = async () => {
submitted = false;
try {
const attribute = await sdkForProject.databases.createUrlAttribute(
databaseId,
$collection.$id,
key,
required,
xdefault ? xdefault : undefined,
array
);
dispatch('created', attribute);
addNotification({
type: 'success',
message: `${key} has been created`
});
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
};
$: if (submitted) {
submit();
$: if (selectedAttribute) {
({ required: data.required, array: data.array, default: data.default } = selectedAttribute);
}
$: if (overview) {
({ required, array } = selectedAttribute);
xdefault = selectedAttribute.default;
}
$: if (required || array) {
xdefault = null;
$: if (data.required || data.array) {
data.default = null;
}
</script>
<InputText
id="default"
label="Default value"
bind:value={xdefault}
disabled={required || array}
readonly={overview} />
<InputChoice id="required" label="Required" bind:value={required} disabled={overview || array}>
Indicate whether this is a required attribute</InputChoice>
<InputChoice id="array" label="Array" bind:value={array} disabled={overview || required}>
Indicate whether this attribute should act as an array</InputChoice>
bind:value={data.default}
disabled={data.required || data.array}
readonly={!!selectedAttribute} />
<InputChoice
id="required"
label="Required"
bind:value={data.required}
disabled={!!selectedAttribute || data.array}>
Indicate whether this is a required attribute
</InputChoice>
<InputChoice
id="array"
label="Array"
bind:value={data.array}
disabled={!!selectedAttribute || data.required}>
Indicate whether this attribute should act as an array
</InputChoice>
@@ -2,19 +2,46 @@
import { Modal } from '$lib/components';
import { option, options } from './attributes/store';
import { Button, InputText, FormList, InputSelect } from '$lib/elements/forms';
import { invalidate } from '$app/navigation';
import { goto, invalidate } from '$app/navigation';
import { Dependencies } from '$lib/constants';
import { page } from '$app/stores';
import { addNotification } from '$lib/stores/notifications';
import { base } from '$app/paths';
import type { Attributes } from './store';
export let showCreate = false;
let key: string = null;
let selectedOption = null;
let submitted = false;
const created = async () => {
invalidate(Dependencies.COLLECTION);
showCreate = false;
let data: Partial<Attributes> = {
required: false,
array: false,
default: null
};
const databaseId = $page.params.database;
const collectionId = $page.params.collection;
async function submit() {
try {
await $option.func(databaseId, collectionId, key, data);
invalidate(Dependencies.COLLECTION);
if (!$page.url.pathname.includes('attributes')) {
goto(
`${base}/console/project-${$page.params.project}/databases/database-${databaseId}/collection-${collectionId}/attributes`
);
}
addNotification({
type: 'success',
message: `Attribute ${key} has been created`
});
showCreate = false;
} catch (error) {
addNotification({
type: 'error',
message: error.message
});
}
}
$: if (selectedOption) {
$option = options.find((option) => option.name === selectedOption);
@@ -23,11 +50,11 @@
$: if (!showCreate) {
key = null;
selectedOption = null;
submitted = false;
$option = null;
}
</script>
<Modal size="big" bind:show={showCreate} on:submit={() => (submitted = true)}>
<Modal size="big" bind:show={showCreate} on:submit={submit}>
<svelte:fragment slot="header">Create Attribute</svelte:fragment>
<FormList>
<div>
@@ -59,9 +86,7 @@
{#if selectedOption}
<svelte:component
this={$option.component}
{key}
bind:submitted
on:created={created}
bind:data
on:close={() => ($option = null)} />
{/if}
</FormList>
@@ -7,9 +7,14 @@ import type { PageLoad } from './$types';
export const load: PageLoad = async ({ params, depends }) => {
depends(Dependencies.KEY);
const key = await sdkForConsole.projects.getKey(params.project, params.key);
if (key.expire) {
key.expire = new Date(key.expire).toISOString().slice(0, 23);
}
return {
header: Header,
breadcrumbs: Breadcrumbs,
key: await sdkForConsole.projects.getKey(params.project, params.key)
key
};
};
@@ -1,7 +1,45 @@
<script lang="ts">
import { FormList, InputText, InputDateTime } from '$lib/elements/forms';
import { FormList, InputText, InputDateTime, InputSelect } from '$lib/elements/forms';
import { WizardStep } from '$lib/layout';
import { key } from './store';
let preset = 'never';
function incrementToday(value: number, type: 'day' | 'month' | 'year'): string {
const date = new Date();
switch (type) {
case 'day':
date.setDate(date.getDate() + value);
break;
case 'month':
date.setMonth(date.getMonth() + value);
break;
case 'year':
date.setMonth(date.getMonth() + value * 12);
break;
}
return date.toISOString();
}
$: {
switch (preset) {
case 'never':
$key.expire = null;
break;
case '1day':
$key.expire = incrementToday(1, 'day');
break;
case '7days':
$key.expire = incrementToday(7, 'day');
break;
case '1month':
$key.expire = incrementToday(1, 'month');
break;
case '1year':
$key.expire = incrementToday(1, 'year');
break;
}
}
</script>
<WizardStep>
@@ -14,6 +52,38 @@
placeholder="API Key Name"
required
bind:value={$key.name} />
<InputDateTime id="expire" label="Expiration Date" bind:value={$key.expire} />
<InputSelect
bind:value={preset}
options={[
{
label: 'Never',
value: 'never'
},
{
label: '1 Day',
value: '1day'
},
{
label: '7 Days',
value: '7days'
},
{
label: '1 Month',
value: '1month'
},
{
label: '1 Year',
value: '1year'
},
{
label: 'Custom Date',
value: 'custom'
}
]}
id="preset"
label="Expiration Date" />
{#if preset === 'custom'}
<InputDateTime id="expire" label="" bind:value={$key.expire} showLabel={false} />
{/if}
</FormList>
</WizardStep>
@@ -67,6 +67,21 @@
<Container>
{#if $project}
<Form on:submit={updateName}>
<CardGrid>
<Heading tag="h6" size="7">API Credentials</Heading>
<p class="text">Access Appwrite services using your API Endpoint and Project ID.</p>
<svelte:fragment slot="aside">
<FormList>
<CopyInput label="Project ID" showLabel={true} value={$project.$id} />
<CopyInput label="API Endpoint" showLabel={true} value={endpoint} />
</FormList>
</svelte:fragment>
<svelte:fragment slot="actions">
<Button secondary href={`${base}/console/project-${projectId}/overview/keys`}>
View API Keys
</Button>
</svelte:fragment>
</CardGrid>
<CardGrid>
<Heading tag="h6" size="7">Update Name</Heading>
@@ -87,29 +102,6 @@
</CardGrid>
</Form>
<CardGrid>
<Heading tag="h6" size="7">API Credentials</Heading>
<p class="text">
Access Appwrite services using your API Endpoint and Project ID. You can connect
Appwrite to your applications and server-side code by <a
href="https://appwrite.io/docs"
class="link">integrating a new platform</a>
or
<a href="https://appwrite.io/docs/keys" class="link">creating an API key</a>.
</p>
<svelte:fragment slot="aside">
<FormList>
<CopyInput label="Project ID" showLabel={true} value={$project.$id} />
<CopyInput label="API Endpoint" showLabel={true} value={endpoint} />
</FormList>
</svelte:fragment>
<svelte:fragment slot="actions">
<Button secondary href={`${base}/console/project-${projectId}/overview/keys`}>
View API Keys
</Button>
</svelte:fragment>
</CardGrid>
<CardGrid>
<Heading tag="h6" size="7">Services</Heading>
<p class="text">Choose services you wish to enable or disable.</p>
@@ -153,7 +153,14 @@
<Container>
<CardGrid>
<Heading tag="h2" size="7">Signature Key</Heading>
<p>You can use the Signature Key to validate your webhooks.</p>
<p>
Add the Signature Key to the X-Appwrite-Webhook-Signature header to validate your
webhooks. <a
href="https://appwrite.io/docs/webhooks#verification"
target="_blank"
rel="noopener noreferrer"
class="link">Learn more about webhook validation.</a>
</p>
<svelte:fragment slot="aside">
<div>
<p>Key</p>
@@ -39,7 +39,6 @@
on:click={() => (showCreate = true)}>
{#each data.buckets.buckets as bucket}
<GridItem1 href={`${base}/console/project-${project}/storage/bucket-${bucket.$id}`}>
<svelte:fragment slot="eyebrow">XX Files</svelte:fragment>
<svelte:fragment slot="title">{bucket.name}</svelte:fragment>
<svelte:fragment slot="status">
{#if !bucket.enabled}