Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: various fixes from review and QA #125

Merged
merged 15 commits into from
Nov 10, 2022
Merged

feat: various fixes from review and QA #125

Show file tree
Hide file tree
Changes from 14 commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
d18fcd0
feat: fix empty search, add status to functions
ArmanNik Nov 9, 2022
8621823
fix: placeholder visible when tags are present
ArmanNik Nov 9, 2022
3fc0e2b
fix: heading overflow
ArmanNik Nov 9, 2022
456597c
Merge branch 'main' of github.com:appwrite/appwrite-console-poc into …
ArmanNik Nov 9, 2022
8438641
fix: add trim to boxes
ArmanNik Nov 9, 2022
fefb90e
feat: add validation to special select elements
ArmanNik Nov 9, 2022
890ddf0
Merge branch 'main' of github.com:appwrite/appwrite-console-poc into …
ArmanNik Nov 10, 2022
538d739
feat: add tag to coming soon
ArmanNik Nov 10, 2022
39266ea
Merge branch 'main' of github.com:appwrite/appwrite-console-poc into …
ArmanNik Nov 10, 2022
c296110
fix: heading test
ArmanNik Nov 10, 2022
9189023
fix: removed deployment fetching
ArmanNik Nov 10, 2022
bdd8764
fix: error message
ArmanNik Nov 10, 2022
3b8ed6d
chore: remove commented out code
ArmanNik Nov 10, 2022
de2e5d1
fix: placeholder
ArmanNik Nov 10, 2022
a0ea0ba
chore: remove unused class
ArmanNik Nov 10, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 5 additions & 7 deletions src/lib/components/emptySearch.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,11 @@

<article class="card u-grid u-cross-center u-width-full-line common-section">
<div class="u-flex u-flex-vertical u-cross-center u-gap-24">
<button type="button" on:click|preventDefault>
{#if $app.themeInUse === 'dark'}
<img src={Dark} alt="create" aria-hidden="true" />
{:else}
<img src={Light} alt="create" aria-hidden="true" />
{/if}
</button>
{#if $app.themeInUse === 'dark'}
<img src={Dark} alt="create" aria-hidden="true" />
{:else}
<img src={Light} alt="create" aria-hidden="true" />
{/if}
<slot />
</div>
</article>
Expand Down
3 changes: 2 additions & 1 deletion src/lib/components/heading.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
<script lang="ts">
export let tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
export let size: '1' | '2' | '3' | '4' | '5' | '6' | '7';
export let trimmed = true;
</script>

<svelte:element this={tag} class={`heading-level-${size}`}>
<svelte:element this={tag} class={`heading-level-${size}`} class:u-trim-1={trimmed}>
<slot />
</svelte:element>
2 changes: 1 addition & 1 deletion src/lib/components/permissions/row.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
{:else if role === 'any'}
<div>Any</div>
{:else}
<div>{role}</div>
<div class="u-trim-1">{role}</div>
{/if}
</div>
</div>
2 changes: 1 addition & 1 deletion src/lib/elements/forms/inputTags.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@
</div>
<input
{id}
placeholder={!tags.length ? placeholder : ''}
{placeholder}
{disabled}
{readonly}
type="text"
Expand Down
4 changes: 2 additions & 2 deletions src/lib/layout/coverTitle.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,13 @@
export let href: string = null;
</script>

<Heading size="4" tag="h1">
<Heading size="4" tag="h1" trimmed={false}>
{#if href}
<a class="button is-text is-only-icon" {href} aria-label="page back">
<span class="icon-cheveron-left" aria-hidden="true" />
</a>
{/if}
<span class="text">
<span class="text u-trim-1 u-min-width-0">
<slot />
</span>
</Heading>
2 changes: 1 addition & 1 deletion src/routes/console/account/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,7 @@
<AvatarInitials size={48} name={$user.name} />
</svelte:fragment>
<svelte:fragment slot="title">
<h6 class="u-bold">{$user.name}</h6>
<h6 class="u-bold u-trim-1">{$user.name}</h6>
</svelte:fragment>
</Box>
</svelte:fragment>
Expand Down
2 changes: 1 addition & 1 deletion src/routes/console/organization-[organization]/settings/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@
<AvatarGroup {avatars} total={$members.total} />
</svelte:fragment>
<svelte:fragment slot="title">
<h6 class="u-bold">{$organization.name}</h6>
<h6 class="u-bold u-trim-1">{$organization.name}</h6>
</svelte:fragment>
<p>{$organization.total} projects</p>
</Box>
Expand Down
2 changes: 1 addition & 1 deletion src/routes/console/project-[project]/auth/[[page]]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
</script>

<Container>
<SearchQuery search={data.search} placeholder="Search by name, email, or ID">
<SearchQuery search={data.search} placeholder="Search by name, email, phone, or ID">
<span
use:event={{
name: 'console_users',
Expand Down
2 changes: 1 addition & 1 deletion src/routes/console/project-[project]/auth/security/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@
</CardGrid>

<CardGrid>
<Heading tag="h2" size="6">Session Length (Coming Soon)</Heading>
<Heading tag="h2" size="6">Session Length <Pill>Coming Soon!</Pill></Heading>
<p>
If you reduce the limit, users who are currently logged in will be logged out of the
application.
Expand Down
2 changes: 1 addition & 1 deletion src/routes/console/project-[project]/auth/teams/team-[team]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@
<AvatarInitials size={48} name={$team.name} />
</svelte:fragment>
<svelte:fragment slot="title">
<h6 class="u-bold">{$team.name}</h6>
<h6 class="u-bold u-trim-1">{$team.name}</h6>
<span>{$team.total} Members</span>
</svelte:fragment>
</Box>
Expand Down
11 changes: 7 additions & 4 deletions src/routes/console/project-[project]/auth/teams/team-[team]/members/[[page]]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
<span class="text">Create membership</span>
</Button>
</SearchQuery>
{#if data.memberships.total}
{#if data.memberships.total && !data.search}
<Table>
<TableHeader>
<TableCellHead>Name</TableCellHead>
Expand Down Expand Up @@ -92,9 +92,12 @@
<p>There are no members that match your search.</p>
</div>
<Button
secondary
href={`/console/project-${$page.params.project}/auth/teams/team-${$page.params.team}/members`}
>Clear Search</Button>
external
href="https://appwrite.io/docs/client/teams?sdk=web-default#teamsCreateMembership"
text>
Documentation
</Button>
<Button secondary on:click={() => (showCreate = true)}>Create membership</Button>
</EmptySearch>
{:else}
<Empty
Expand Down
4 changes: 2 additions & 2 deletions src/routes/console/project-[project]/auth/user-[user]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -470,11 +470,11 @@
{/if}
</svelte:fragment>
<svelte:fragment slot="title">
<h6 class="u-bold">
<h6 class="u-bold u-trim-1">
{$user.name || $user.email || $user.phone || 'Anonymous'}
</h6>
</svelte:fragment>
<p>
<p class="u-trim-1">
{$user.email && $user.phone
? [$user.email, $user.phone].join(',')
: $user.email || $user.phone}
Expand Down
2 changes: 1 addition & 1 deletion ...t]/databases/database-[database]/collection-[collection]/document-[document]/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@
<svelte:fragment slot="aside">
<Box>
<svelte:fragment slot="title">
<h6 class="u-bold">{$doc.$id}</h6>
<h6 class="u-bold u-trim-1">{$doc.$id}</h6>
</svelte:fragment>
<p>
Last Updated: {toLocaleDateTime($doc.$updatedAt)}
Expand Down
180 changes: 78 additions & 102 deletions ...project]/databases/database-[database]/collection-[collection]/indexes/createIndex.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,20 +9,22 @@
import type { Attributes } from '../store';
import { invalidate } from '$app/navigation';
import { Dependencies } from '$lib/constants';
import Select from './select.svelte';

export let showCreateIndex = false;
export let externalAttribute: Attributes = null;

const databaseId = $page.params.database;

let error: string;
let key: string = null;
let types = [
{ value: 'key', label: 'Key' },
{ value: 'unique', label: 'Unique' },
{ value: 'fulltext', label: 'FullText' }
];
let newAttr = false;
let selectedType = '';
let selectedType = 'key';
$: attributeOptions = $collection.attributes.map((attribute: Attributes) => ({
value: attribute.key,
label: attribute.key
Expand All @@ -40,91 +42,74 @@

$: if (showCreateIndex) {
attributeList = [];
selectedType = selectedOrder = selectedAttribute = '';
selectedOrder = selectedAttribute = '';
selectedType = 'key';
key = null;
}
const created = async () => {
if (selectedAttribute && selectedOrder) {
attributeList.push({ value: selectedAttribute, order: selectedOrder });
selectedAttribute = selectedOrder = '';
}
try {
await sdkForProject.databases.createIndex(
databaseId,
$collection.$id,
key,
selectedType,
attributeList.map((a) => a.value),
attributeList.map((a) => a.order)
);
invalidate(Dependencies.COLLECTION);
addNotification({
message: 'Index has been created',
type: 'success'
});
} catch (error) {
addNotification({
message: error.message,
type: 'error'
});
}
if (key && selectedAttribute && selectedOrder && selectedType) {
if (selectedAttribute && selectedOrder) {
attributeList.push({ value: selectedAttribute, order: selectedOrder });
selectedAttribute = selectedOrder = '';
}
try {
await sdkForProject.databases.createIndex(
databaseId,
$collection.$id,
key,
selectedType,
attributeList.map((a) => a.value),
attributeList.map((a) => a.order)
);
invalidate(Dependencies.COLLECTION);
addNotification({
message: 'Index has been created',
type: 'success'
});
} catch (error) {
addNotification({
message: error.message,
type: 'error'
});
}

showCreateIndex = false;
showCreateIndex = false;
} else error = 'All fields are required';
};
</script>

<Modal size="big" on:submit={created} bind:show={showCreateIndex}>
<Modal bind:error size="big" on:submit={created} bind:show={showCreateIndex}>
<svelte:fragment slot="header">Create Index</svelte:fragment>
<FormList>
<InputText
id="key"
label="Index Key"
placeholder="Enter Key"
bind:value={key}
autofocus
required />
<InputSelect
options={types}
id="type"
label="Index type"
placeholder="Select type"
bind:value={selectedType}
required />
<InputText id="key" label="Index Key" placeholder="Enter Key" bind:value={key} autofocus />
<InputSelect options={types} id="type" label="Index type" bind:value={selectedType} />

{#if attributeList?.length}
{#each attributeList as index, i}
<li class="form-item is-multiple">
<div class="form-item-part u-stretch">
<label class="label" for="attribute">Attribute</label>
<div class="select">
<select id="attribute" bind:value={index.value}>
<optgroup label="Internal">
<option value="$id">$id</option>
<option value="$createdAt">$createdAt</option>
<option value="$updatedAt">$updatedAt</option>
</optgroup>
<optgroup label="Attributes">
{#each attributeOptions as option}
<option
value={option.value}
selected={option.value === selectedAttribute}>
{option.label}
</option>
{/each}
</optgroup>
</select>
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
<Select id="attribute" label="Attribute" bind:value={index.value}>
<optgroup label="Internal">
<option value="$id">$id</option>
<option value="$createdAt">$createdAt</option>
<option value="$updatedAt">$updatedAt</option>
</optgroup>
<optgroup label="Attributes">
{#each attributeOptions as option}
<option
value={option.value}
selected={option.value === selectedAttribute}>
{option.label}
</option>
{/each}
</optgroup>
</Select>
</div>
<div class="form-item-part u-stretch">
<label class="label" for="order">Order</label>
<div class="select">
<select id="order" bind:value={index.order}>
<option value="ASC"> ASC </option>
<option value="DESC"> DESC </option>
</select>
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
<Select id="order" label="Order" bind:value={index.order}>
<option value="ASC"> ASC </option>
<option value="DESC"> DESC </option>
</Select>
</div>

<div class="form-item-part u-cross-child-end">
Expand All @@ -143,43 +128,34 @@
{/if}
{#if !attributeList?.length || newAttr}
<li class="form-item is-multiple">
<div class="form-item-part u-stretch">
<label class="label" for="attribute">Attribute</label>
<div class="select">
<select required id="attribute" bind:value={selectedAttribute}>
<option value="" disabled selected hidden>Select Attribute</option>
<div class="form-item-part u-stretch" style="align-items: flex-start;">
<Select id="attribute" label="Attribute" bind:value={selectedAttribute}>
<option value="" disabled selected hidden>Select Attribute</option>

<optgroup label="Internal">
<option value="$id">$id</option>
<option value="$createdAt">$createdAt</option>
<option value="$updatedAt">$updatedAt</option>
</optgroup>
<optgroup label="Attributes">
{#each attributeOptions as option}
<option
value={option.value}
selected={option.value === selectedAttribute}>
{option.label}
</option>
{/each}
</optgroup>
</select>
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
<optgroup label="Internal">
<option value="$id">$id</option>
<option value="$createdAt">$createdAt</option>
<option value="$updatedAt">$updatedAt</option>
</optgroup>
<optgroup label="Attributes">
{#each attributeOptions as option}
<option
value={option.value}
selected={option.value === selectedAttribute}>
{option.label}
</option>
{/each}
</optgroup>
</Select>
</div>
<div class="form-item-part u-stretch">
<label class="label" for="order">Order</label>
<div class="select">
<select id="order" bind:value={selectedOrder}>
<option value="" disabled selected hidden>Select Order</option>
<Select id="order" label="Order" bind:value={selectedOrder}>
<option value="" disabled selected hidden>Select Order</option>

<option value="ASC"> ASC </option>
<option value="DESC"> DESC </option>
</select>
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
<option value="ASC"> ASC </option>
<option value="DESC"> DESC </option>
</Select>
</div>

<div class="form-item-part u-cross-child-end">
<Button
text
Expand Down
Loading