From 4f138b480c0db83a0f9feba549520f5f7899a702 Mon Sep 17 00:00:00 2001 From: Arman Date: Fri, 8 Apr 2022 16:15:49 +0200 Subject: [PATCH 01/26] Created Avatar component --- src/lib/components/avatar.svelte | 6 ++++++ src/lib/components/index.ts | 1 + src/lib/layout/header.svelte | 11 ++++------- 3 files changed, 11 insertions(+), 7 deletions(-) create mode 100644 src/lib/components/avatar.svelte diff --git a/src/lib/components/avatar.svelte b/src/lib/components/avatar.svelte new file mode 100644 index 0000000000..3935850a89 --- /dev/null +++ b/src/lib/components/avatar.svelte @@ -0,0 +1,6 @@ + + + diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index fd1b70c23b..21fa3228e3 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -13,3 +13,4 @@ export { default as DropList } from './dropList.svelte'; export { default as DropListItem } from './dropListItem.svelte'; export { default as DropListLink } from './dropListLink.svelte'; export { default as Collapsible } from './collapsible.svelte'; +export { default as Avatar } from './avatar.svelte'; diff --git a/src/lib/layout/header.svelte b/src/lib/layout/header.svelte index 7a35b9b9fa..b1dc8bebc5 100644 --- a/src/lib/layout/header.svelte +++ b/src/lib/layout/header.svelte @@ -2,7 +2,7 @@ import { goto } from '$app/navigation'; import { base } from '$app/paths'; import { page } from '$app/stores'; - import { DropList, DropListItem, DropListLink } from '$lib/components'; + import { DropList, DropListItem, DropListLink, Avatar } from '$lib/components'; import { app } from '$lib/stores/app'; import { sdkForConsole } from '$lib/stores/sdk'; import { user } from '$lib/stores/user'; @@ -46,12 +46,9 @@ Your Account From 212a7997c67964959c9aa911c801eeee1d6ca30d Mon Sep 17 00:00:00 2001 From: Arman Date: Fri, 8 Apr 2022 17:52:17 +0200 Subject: [PATCH 02/26] Changed 'size' prop type from string to number in Avatar --- src/lib/components/avatar.svelte | 2 +- src/lib/layout/header.svelte | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/lib/components/avatar.svelte b/src/lib/components/avatar.svelte index 3935850a89..311e8fb9b4 100644 --- a/src/lib/components/avatar.svelte +++ b/src/lib/components/avatar.svelte @@ -1,5 +1,5 @@ diff --git a/src/lib/layout/header.svelte b/src/lib/layout/header.svelte index b1dc8bebc5..1e0787c71d 100644 --- a/src/lib/layout/header.svelte +++ b/src/lib/layout/header.svelte @@ -47,7 +47,7 @@ From e631891048dc0804f82e0a4577bd51b4303b506b Mon Sep 17 00:00:00 2001 From: Arman Date: Mon, 11 Apr 2022 11:58:18 +0200 Subject: [PATCH 03/26] inputSeach now updates on clear --- src/lib/elements/forms/inputSearch.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/lib/elements/forms/inputSearch.svelte b/src/lib/elements/forms/inputSearch.svelte index 5a89508e09..93d3a7fecd 100644 --- a/src/lib/elements/forms/inputSearch.svelte +++ b/src/lib/elements/forms/inputSearch.svelte @@ -17,7 +17,7 @@ } }); - const onKeyUp = (event: KeyboardEvent) => { + const onKeyUp = (event: FormEventHandler) => { clearTimeout(timer); timer = setTimeout(() => { const target = event.target as HTMLInputElement; @@ -32,5 +32,5 @@ {required} type="search" class="input-text" - on:keyup={onKeyUp} + on:change={onKeyUp} bind:this={element} /> From b6248d7bd97a4757d8b4804b2b71400ff0577875 Mon Sep 17 00:00:00 2001 From: Arman Date: Mon, 11 Apr 2022 12:03:56 +0200 Subject: [PATCH 04/26] better name for change function --- src/lib/elements/forms/inputSearch.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/lib/elements/forms/inputSearch.svelte b/src/lib/elements/forms/inputSearch.svelte index 93d3a7fecd..0c41d1af7a 100644 --- a/src/lib/elements/forms/inputSearch.svelte +++ b/src/lib/elements/forms/inputSearch.svelte @@ -17,7 +17,7 @@ } }); - const onKeyUp = (event: FormEventHandler) => { + const valueChange = (event: FormEventHandler) => { clearTimeout(timer); timer = setTimeout(() => { const target = event.target as HTMLInputElement; @@ -32,5 +32,5 @@ {required} type="search" class="input-text" - on:change={onKeyUp} + on:change={valueChange} bind:this={element} /> From d1368ddd9166e716c0f91422450caf98cf5735d2 Mon Sep 17 00:00:00 2001 From: Arman Date: Mon, 11 Apr 2022 12:18:12 +0200 Subject: [PATCH 05/26] fix valueChange not getting called & typescript --- src/lib/elements/forms/inputSearch.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/lib/elements/forms/inputSearch.svelte b/src/lib/elements/forms/inputSearch.svelte index 0c41d1af7a..7903ae8cd9 100644 --- a/src/lib/elements/forms/inputSearch.svelte +++ b/src/lib/elements/forms/inputSearch.svelte @@ -17,7 +17,7 @@ } }); - const valueChange = (event: FormEventHandler) => { + const valueChange = (event: Event) => { clearTimeout(timer); timer = setTimeout(() => { const target = event.target as HTMLInputElement; @@ -32,5 +32,5 @@ {required} type="search" class="input-text" - on:change={valueChange} + on:input={valueChange} bind:this={element} /> From 6e80088fb193bf89fe51223b89b9390c1d0600ce Mon Sep 17 00:00:00 2001 From: Arman Date: Mon, 11 Apr 2022 15:13:49 +0200 Subject: [PATCH 06/26] InputSearch unit testing --- tests/unit/elements/inputSearch.test.ts | 57 +++++++++++++++++++++++++ 1 file changed, 57 insertions(+) create mode 100644 tests/unit/elements/inputSearch.test.ts diff --git a/tests/unit/elements/inputSearch.test.ts b/tests/unit/elements/inputSearch.test.ts new file mode 100644 index 0000000000..3b3e061651 --- /dev/null +++ b/tests/unit/elements/inputSearch.test.ts @@ -0,0 +1,57 @@ +import '@testing-library/jest-dom'; +import { render } from '@testing-library/svelte'; +import userEvent from '@testing-library/user-event'; +import { InputSearch } from '../../../src/lib/elements/forms'; + +test('shows search input', () => { + const { getByPlaceholderText } = render(InputSearch, { placeholder: 'search' }); + + expect(getByPlaceholderText('search')).toBeInTheDocument(); + expect(getByPlaceholderText('search')).toHaveAttribute('type', 'search'); +}); + +test('shows input search - required', () => { + const { getByPlaceholderText } = render(InputSearch, { placeholder: 'search', required: true }); + + expect(getByPlaceholderText('search')).toBeRequired(); +}); + +test('shows input search - disabled', () => { + const { getByPlaceholderText } = render(InputSearch, { placeholder: 'search', disabled: true }); + + expect(getByPlaceholderText('search')).toBeDisabled(); +}); + +test('shows input search - autofocus', () => { + const { getByPlaceholderText } = render(InputSearch, { + placeholder: 'search', + autofocus: true + }); + + expect(getByPlaceholderText('search')).toHaveFocus(); +}); + +test('shows input search - placeholder', () => { + const { getByPlaceholderText } = render(InputSearch, { + placeholder: 'find me' + }); + + expect(getByPlaceholderText('find me')).toBeInTheDocument(); +}); + +test('state change after debounce', async () => { + const debounce = 250; + const { component, getByPlaceholderText } = render(InputSearch, { + placeholder: 'search', + value: '', + debounce + }); + const input = getByPlaceholderText('search'); + + expect(component.value).toEqual(''); + await userEvent.type(input, 'lorem'); + expect(component.value).not.toEqual('lorem'); + setTimeout(() => { + expect(component.value).toEqual('lorem'); + }, debounce); +}); From 6d2816809ea3c05a613a5f894baf20c43fe83593 Mon Sep 17 00:00:00 2001 From: Arman Date: Mon, 11 Apr 2022 17:21:43 +0200 Subject: [PATCH 07/26] Created switchBox + test, added it to users settings --- src/lib/components/index.ts | 1 + src/lib/components/switchBox.svelte | 34 +++++++++++ .../console/[project]/users/settings.svelte | 17 +++++- tests/unit/components/switchBox.test.ts | 56 +++++++++++++++++++ 4 files changed, 105 insertions(+), 3 deletions(-) create mode 100644 src/lib/components/switchBox.svelte create mode 100644 tests/unit/components/switchBox.test.ts diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index 21fa3228e3..1ab386a80a 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -14,3 +14,4 @@ export { default as DropListItem } from './dropListItem.svelte'; export { default as DropListLink } from './dropListLink.svelte'; export { default as Collapsible } from './collapsible.svelte'; export { default as Avatar } from './avatar.svelte'; +export { default as SwitchBox } from './switchBox.svelte'; diff --git a/src/lib/components/switchBox.svelte b/src/lib/components/switchBox.svelte new file mode 100644 index 0000000000..0f8d7f24ee --- /dev/null +++ b/src/lib/components/switchBox.svelte @@ -0,0 +1,34 @@ + + +
  • + +
    • diff --git a/src/routes/console/[project]/users/settings.svelte b/src/routes/console/[project]/users/settings.svelte index c270642c71..275106066c 100644 --- a/src/routes/console/[project]/users/settings.svelte +++ b/src/routes/console/[project]/users/settings.svelte @@ -1,10 +1,21 @@

    Settings

    - - +

    Choose auth methods you wish to use.

    +
      + +
    diff --git a/tests/unit/components/switchBox.test.ts b/tests/unit/components/switchBox.test.ts new file mode 100644 index 0000000000..83b6bdfaf6 --- /dev/null +++ b/tests/unit/components/switchBox.test.ts @@ -0,0 +1,56 @@ +import '@testing-library/jest-dom'; +import { render, fireEvent } from '@testing-library/svelte'; +import { SwitchBox } from '../../../src/lib/components'; +const src = 'https://via.placeholder.com/50'; + +test('shows boolean input', () => { + const { getByText, getByRole, getByAltText } = render(SwitchBox, { + id: 'input', + src, + label: 'Bool', + alt: 'image' + }); + const checkbox = getByRole('switch'); + const img = getByAltText('image'); + + expect(getByText('Bool')).toBeInTheDocument(); + expect(img).toBeInTheDocument(); + expect(checkbox).toBeInTheDocument(); + expect(checkbox).toHaveAttribute('type', 'checkbox'); +}); + +test('shows boolean input - required', () => { + const { getByRole } = render(SwitchBox, { id: 'input', src, label: 'Bool', required: true }); + + expect(getByRole('switch')).toBeRequired(); +}); + +test('shows boolean input - disabled', () => { + const { getByRole } = render(SwitchBox, { id: 'input', src, label: 'Bool', disabled: true }); + + expect(getByRole('switch')).toBeDisabled(); +}); + +test('state', async () => { + const { getByRole, component } = render(SwitchBox, { id: 'input', src, label: 'Bool' }); + const checkbox = getByRole('switch'); + + expect(checkbox).not.toBeChecked(); + expect(component.value).toStrictEqual(false); + + await fireEvent.click(checkbox); + expect(checkbox).toBeChecked(); + expect(component.value).toStrictEqual(true); + + await fireEvent.click(checkbox); + expect(checkbox).not.toBeChecked(); + expect(component.value).toStrictEqual(false); + + component.value = true; + expect(checkbox).toBeChecked(); + expect(component.value).toStrictEqual(true); + + component.value = false; + expect(checkbox).not.toBeChecked(); + expect(component.value).toStrictEqual(false); +}); From bd4b0683b0223d6928ba80d5cfa1068c0fa4defe Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 10:59:30 +0200 Subject: [PATCH 08/26] added option to disable autocomplete in inputText --- src/lib/elements/forms/inputText.svelte | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/lib/elements/forms/inputText.svelte b/src/lib/elements/forms/inputText.svelte index 83ce788900..c5a00710ef 100644 --- a/src/lib/elements/forms/inputText.svelte +++ b/src/lib/elements/forms/inputText.svelte @@ -9,6 +9,7 @@ export let required = false; export let disabled = false; export let autofocus = false; + export let autocomplete = true; export let maxlength: number = null; let element: HTMLInputElement; @@ -29,6 +30,7 @@ {disabled} {required} {maxlength} + {autocomplete} type="text" class="input-text" bind:value From 8305c3742c4248abea15d4e4a4f5af91fe6b8039 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 11:00:15 +0200 Subject: [PATCH 09/26] added option to disable meter in inputText --- src/lib/elements/forms/inputPassword.svelte | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/src/lib/elements/forms/inputPassword.svelte b/src/lib/elements/forms/inputPassword.svelte index 64f56a2e0a..3fa8bcc9e5 100644 --- a/src/lib/elements/forms/inputPassword.svelte +++ b/src/lib/elements/forms/inputPassword.svelte @@ -9,6 +9,7 @@ export let required = false; export let disabled = false; export let autofocus = false; + export let meter = true; let element: HTMLInputElement; @@ -33,14 +34,16 @@ class="input-text" bind:value bind:this={element} /> - 100 ? 100 : strength} - min="0" - max="100" - class="password-meter" - class:is-weak={strength !== 0 && strength <= 33} - class:is-medium={strength > 33 && strength <= 66} - class:is-strong={strength > 66 && strength <= 100} - aria-label="Password strength week" /> + {#if meter} + 100 ? 100 : strength} + min="0" + max="100" + class="password-meter" + class:is-weak={strength !== 0 && strength <= 33} + class:is-medium={strength > 33 && strength <= 66} + class:is-strong={strength > 66 && strength <= 100} + aria-label="Password strength weak" /> + {/if} From 5d2b46575715e05adf8abc7f7bc014adb800cc59 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 11:08:37 +0200 Subject: [PATCH 10/26] fixed small typo in footer --- src/lib/layout/footer.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/layout/footer.svelte b/src/lib/layout/footer.svelte index 41d36bbd64..24579831c4 100644 --- a/src/lib/layout/footer.svelte +++ b/src/lib/layout/footer.svelte @@ -4,7 +4,7 @@
  • From 692363f6c5f90a4b6d30c005c5e3a4ef5e05d368 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 16:22:50 +0200 Subject: [PATCH 11/26] created switchBoxes component --- src/lib/components/index.ts | 1 + src/lib/components/switchBox.svelte | 54 +++++++++++++++++---------- src/lib/components/switchBoxes.svelte | 13 +++++++ 3 files changed, 48 insertions(+), 20 deletions(-) create mode 100644 src/lib/components/switchBoxes.svelte diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index 1ab386a80a..de82e54141 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -15,3 +15,4 @@ export { default as DropListLink } from './dropListLink.svelte'; export { default as Collapsible } from './collapsible.svelte'; export { default as Avatar } from './avatar.svelte'; export { default as SwitchBox } from './switchBox.svelte'; +export { default as SwitchBoxes } from './switchBoxes.svelte'; diff --git a/src/lib/components/switchBox.svelte b/src/lib/components/switchBox.svelte index 0f8d7f24ee..78bf1a8453 100644 --- a/src/lib/components/switchBox.svelte +++ b/src/lib/components/switchBox.svelte @@ -1,34 +1,48 @@
    • diff --git a/src/lib/components/switchBoxes.svelte b/src/lib/components/switchBoxes.svelte new file mode 100644 index 0000000000..9bbec18f9a --- /dev/null +++ b/src/lib/components/switchBoxes.svelte @@ -0,0 +1,13 @@ + + +
      + {#each boxes as box} + dispatch('updated', e.detail)} /> + {/each} +
    From 43e71ff412a0663617d955c7e0aa4e2554b7de6e Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 16:23:25 +0200 Subject: [PATCH 12/26] modified switchBox tests --- tests/unit/components/switchBox.test.ts | 58 ++++++++++++++++--------- 1 file changed, 38 insertions(+), 20 deletions(-) diff --git a/tests/unit/components/switchBox.test.ts b/tests/unit/components/switchBox.test.ts index 83b6bdfaf6..9b434cbc4c 100644 --- a/tests/unit/components/switchBox.test.ts +++ b/tests/unit/components/switchBox.test.ts @@ -1,14 +1,20 @@ import '@testing-library/jest-dom'; import { render, fireEvent } from '@testing-library/svelte'; import { SwitchBox } from '../../../src/lib/components'; -const src = 'https://via.placeholder.com/50'; + +let box = { + id: 'input', + src: 'https://via.placeholder.com/50', + label: 'Bool', + alt: 'image', + required: false, + disabled: false, + value: false +}; test('shows boolean input', () => { const { getByText, getByRole, getByAltText } = render(SwitchBox, { - id: 'input', - src, - label: 'Bool', - alt: 'image' + box }); const checkbox = getByRole('switch'); const img = getByAltText('image'); @@ -20,37 +26,49 @@ test('shows boolean input', () => { }); test('shows boolean input - required', () => { - const { getByRole } = render(SwitchBox, { id: 'input', src, label: 'Bool', required: true }); + box.required = true; + const { getByRole } = render(SwitchBox, { box }); expect(getByRole('switch')).toBeRequired(); }); test('shows boolean input - disabled', () => { - const { getByRole } = render(SwitchBox, { id: 'input', src, label: 'Bool', disabled: true }); + box.disabled = true; + const { getByRole } = render(SwitchBox, { box }); expect(getByRole('switch')).toBeDisabled(); }); test('state', async () => { - const { getByRole, component } = render(SwitchBox, { id: 'input', src, label: 'Bool' }); + const { getByRole, component } = render(SwitchBox, { box }); const checkbox = getByRole('switch'); - expect(checkbox).not.toBeChecked(); - expect(component.value).toStrictEqual(false); + setTimeout(() => { + expect(checkbox).not.toBeChecked(); + expect(component.box.value).toStrictEqual(false); + }, 1); await fireEvent.click(checkbox); - expect(checkbox).toBeChecked(); - expect(component.value).toStrictEqual(true); + setTimeout(() => { + expect(checkbox).toBeChecked(); + expect(component.box.value).toStrictEqual(true); + }, 1); await fireEvent.click(checkbox); - expect(checkbox).not.toBeChecked(); - expect(component.value).toStrictEqual(false); + setTimeout(() => { + expect(checkbox).not.toBeChecked(); + expect(component.box.value).toStrictEqual(false); + }, 1); - component.value = true; - expect(checkbox).toBeChecked(); - expect(component.value).toStrictEqual(true); + component.box.value = true; + setTimeout(() => { + expect(checkbox).toBeChecked(); + expect(component.box.value).toStrictEqual(true); + }, 1); - component.value = false; - expect(checkbox).not.toBeChecked(); - expect(component.value).toStrictEqual(false); + component.box.value = false; + setTimeout(() => { + expect(checkbox).not.toBeChecked(); + expect(component.box.value).toStrictEqual(false); + }, 1); }); From 362b77a046991b0190f0adaca21c420570a8f416 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 16:24:53 +0200 Subject: [PATCH 13/26] WIP created oauth modal, logic for auth methods user setting page --- .../[project]/users/_toggleOAuth.svelte | 55 ++++++++ .../console/[project]/users/settings.svelte | 118 ++++++++++++++++-- 2 files changed, 160 insertions(+), 13 deletions(-) create mode 100644 src/routes/console/[project]/users/_toggleOAuth.svelte diff --git a/src/routes/console/[project]/users/_toggleOAuth.svelte b/src/routes/console/[project]/users/_toggleOAuth.svelte new file mode 100644 index 0000000000..60a4d509a7 --- /dev/null +++ b/src/routes/console/[project]/users/_toggleOAuth.svelte @@ -0,0 +1,55 @@ + + +
    + + {provider} OAuth2 Settings + + + +

    + To complete set up, add this OAuth2 redirect URI to your {provider} app configuration. +

    + + + + + +     + diff --git a/src/routes/console/[project]/users/settings.svelte b/src/routes/console/[project]/users/settings.svelte index 275106066c..2ebd0da6de 100644 --- a/src/routes/console/[project]/users/settings.svelte +++ b/src/routes/console/[project]/users/settings.svelte @@ -1,21 +1,113 @@ - -

    Settings

    +

    Settings

    Choose auth methods you wish to use.

    -
      - -
    + +

    OAuth2 Providers

    +     + +{#if provider && showModal} + +{/if} From 61abb31c5029ab31f26b7113030dafbf80c48fd7 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 17:29:33 +0200 Subject: [PATCH 14/26] updated todo format --- src/lib/components/switchBox.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/components/switchBox.svelte b/src/lib/components/switchBox.svelte index 78bf1a8453..53ef2a1a76 100644 --- a/src/lib/components/switchBox.svelte +++ b/src/lib/components/switchBox.svelte @@ -20,7 +20,7 @@ const dispatch = createEventDispatcher(); - //@todo move SwitchBox type outside component + //TODO: move SwitchBox type outside component
  • From 43985589eacafdfbf311186226e4ae080ee7adc9 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 17:37:09 +0200 Subject: [PATCH 15/26] created authLimit component and logic --- .../[project]/users/_setUserLimit.svelte | 49 +++++++++++++++++++ .../console/[project]/users/settings.svelte | 22 +++++++-- 2 files changed, 67 insertions(+), 4 deletions(-) create mode 100644 src/routes/console/[project]/users/_setUserLimit.svelte diff --git a/src/routes/console/[project]/users/_setUserLimit.svelte b/src/routes/console/[project]/users/_setUserLimit.svelte new file mode 100644 index 0000000000..ae0f613b82 --- /dev/null +++ b/src/routes/console/[project]/users/_setUserLimit.svelte @@ -0,0 +1,49 @@ + + +
    + + Max Allowed Users + + + +

    + This limit will prevent new users from signing up for your project, no matter what auth + method has been used. You will still be able to create users and team memberships from + your Appwrite console. For an unlimited amount of users, set the limit to 0. Max limit + is 10,000. +

    + + + + +     + diff --git a/src/routes/console/[project]/users/settings.svelte b/src/routes/console/[project]/users/settings.svelte index 2ebd0da6de..76188073c1 100644 --- a/src/routes/console/[project]/users/settings.svelte +++ b/src/routes/console/[project]/users/settings.svelte @@ -1,16 +1,19 @@ +

    + {authLimit ? `${authLimit} Users allowed` : 'Unlimited Users '} + +

    Settings

    Choose auth methods you wish to use.

    @@ -111,3 +123,5 @@ {#if provider && showModal} {/if} + + From 2727ff704d95da1174b93fbca610ebbd8576fc31 Mon Sep 17 00:00:00 2001 From: Arman Date: Wed, 13 Apr 2022 17:39:23 +0200 Subject: [PATCH 16/26] cleaned up code in setting page --- src/routes/console/[project]/users/settings.svelte | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/routes/console/[project]/users/settings.svelte b/src/routes/console/[project]/users/settings.svelte index 76188073c1..a0f0905351 100644 --- a/src/routes/console/[project]/users/settings.svelte +++ b/src/routes/console/[project]/users/settings.svelte @@ -13,15 +13,13 @@ let provider; let authLimit = $project.authLimit; - console.log($project); const authUpdate = async (event) => { try { - const upup = await sdkForConsole.projects.updateAuthStatus( + await sdkForConsole.projects.updateAuthStatus( projectId, event.detail.id, event.detail.value ); - console.log(upup); addNotification({ type: 'success', message: 'Updated project auth status successfully' From cbdba8ad1959352b8b72eaac32d055706ae46857 Mon Sep 17 00:00:00 2001 From: Arman Date: Tue, 19 Apr 2022 10:24:33 +0200 Subject: [PATCH 17/26] created elementCount component and test --- src/lib/components/elementCount.svelte | 5 +++++ src/lib/components/index.ts | 1 + tests/unit/components/elementCount.test.ts | 10 ++++++++++ 3 files changed, 16 insertions(+) create mode 100644 src/lib/components/elementCount.svelte create mode 100644 tests/unit/components/elementCount.test.ts diff --git a/src/lib/components/elementCount.svelte b/src/lib/components/elementCount.svelte new file mode 100644 index 0000000000..f7b3724de5 --- /dev/null +++ b/src/lib/components/elementCount.svelte @@ -0,0 +1,5 @@ + + +

    {count} found

    diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index de82e54141..1cf2a6938f 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -16,3 +16,4 @@ export { default as Collapsible } from './collapsible.svelte'; export { default as Avatar } from './avatar.svelte'; export { default as SwitchBox } from './switchBox.svelte'; export { default as SwitchBoxes } from './switchBoxes.svelte'; +export { default as ElementCount } from './elementCount.svelte'; diff --git a/tests/unit/components/elementCount.test.ts b/tests/unit/components/elementCount.test.ts new file mode 100644 index 0000000000..f97ed6b484 --- /dev/null +++ b/tests/unit/components/elementCount.test.ts @@ -0,0 +1,10 @@ +import '@testing-library/jest-dom'; +import { render } from '@testing-library/svelte'; +import { ElementCount } from '../../../src/lib/components'; + +test('shows correct count', () => { + const { getByText } = render(ElementCount, { + count: 1 + }); + expect(getByText(/1/i)).toBeInTheDocument(); +}); From 2c5860cff452379d9b970f6c01c7dcb66f9c37b1 Mon Sep 17 00:00:00 2001 From: Arman Date: Tue, 19 Apr 2022 10:25:27 +0200 Subject: [PATCH 18/26] added elementCount to various pages --- .../[project]/database/collection/[collection]/index.svelte | 3 ++- src/routes/console/[project]/functions/index.svelte | 3 ++- .../console/[project]/storage/bucket/[bucket]/index.svelte | 4 +++- src/routes/console/[project]/users/index.svelte | 4 +++- src/routes/console/[project]/users/teams.svelte | 4 +++- 5 files changed, 13 insertions(+), 5 deletions(-) diff --git a/src/routes/console/[project]/database/collection/[collection]/index.svelte b/src/routes/console/[project]/database/collection/[collection]/index.svelte index ec2d7876ae..59dd361e78 100644 --- a/src/routes/console/[project]/database/collection/[collection]/index.svelte +++ b/src/routes/console/[project]/database/collection/[collection]/index.svelte @@ -9,7 +9,7 @@ TableCellHead, TableCellLink } from '$lib/elements/table'; - import { Empty, Pagination } from '$lib/components'; + import { Empty, Pagination, ElementCount } from '$lib/components'; import { collection } from './store'; import { Container } from '$lib/layout'; import { Button } from '$lib/elements/forms'; @@ -36,6 +36,7 @@
    {:then response} {#if response.total} + documents {#each columns as column} diff --git a/src/routes/console/[project]/functions/index.svelte b/src/routes/console/[project]/functions/index.svelte index 2cb3f96375..388f5d96df 100644 --- a/src/routes/console/[project]/functions/index.svelte +++ b/src/routes/console/[project]/functions/index.svelte @@ -2,7 +2,7 @@ import { page } from '$app/stores'; import { sdkForProject } from '$lib/stores/sdk'; import { Button, InputSearch } from '$lib/elements/forms'; - import { Card, Empty, Pagination, Tile, Tiles } from '$lib/components'; + import { Card, Empty, Pagination, Tile, Tiles, ElementCount } from '$lib/components'; import Create from './_create.svelte'; import { Container } from '$lib/layout'; import { base } from '$app/paths'; @@ -28,6 +28,7 @@
    {:then response} {#if response.total} + functions {#each response.functions as func} {:then response} {#if response.total} + files +
    diff --git a/src/routes/console/[project]/users/index.svelte b/src/routes/console/[project]/users/index.svelte index bf5a8447fb..d167d15e29 100644 --- a/src/routes/console/[project]/users/index.svelte +++ b/src/routes/console/[project]/users/index.svelte @@ -1,7 +1,7 @@ + +{#key $page.url.pathname} +
    + +
    +{/key} diff --git a/src/routes/console/[project]/database/__layout.svelte b/src/routes/console/[project]/database/__layout.svelte index 440d15da66..789ea302ad 100644 --- a/src/routes/console/[project]/database/__layout.svelte +++ b/src/routes/console/[project]/database/__layout.svelte @@ -1,5 +1,6 @@ @@ -14,4 +12,6 @@ API Keys - + + + diff --git a/src/routes/console/[project]/settings/__layout.svelte b/src/routes/console/[project]/settings/__layout.svelte index df03f4f741..674e64c69f 100644 --- a/src/routes/console/[project]/settings/__layout.svelte +++ b/src/routes/console/[project]/settings/__layout.svelte @@ -1,9 +1,8 @@ - +{name} diff --git a/src/lib/components/elementCount.svelte b/src/lib/components/elementCount.svelte deleted file mode 100644 index f7b3724de5..0000000000 --- a/src/lib/components/elementCount.svelte +++ /dev/null @@ -1,5 +0,0 @@ - - -

    {count} found

    diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index aac6c90a5f..a21de557ae 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -16,5 +16,4 @@ export { default as Collapsible } from './collapsible.svelte'; export { default as Avatar } from './avatar.svelte'; export { default as SwitchBox } from './switchBox.svelte'; export { default as SwitchBoxes } from './switchBoxes.svelte'; -export { default as ElementCount } from './elementCount.svelte'; export { default as InfoSection } from './infoSection.svelte'; diff --git a/src/lib/elements/forms/inputText.svelte b/src/lib/elements/forms/inputText.svelte index c5a00710ef..120f796545 100644 --- a/src/lib/elements/forms/inputText.svelte +++ b/src/lib/elements/forms/inputText.svelte @@ -30,7 +30,7 @@ {disabled} {required} {maxlength} - {autocomplete} + autocomplete={autocomplete ? 'on' : 'off'} type="text" class="input-text" bind:value diff --git a/src/lib/layout/header.svelte b/src/lib/layout/header.svelte index c15d119f63..58f52e668f 100644 --- a/src/lib/layout/header.svelte +++ b/src/lib/layout/header.svelte @@ -48,6 +48,7 @@ {$user.name} diff --git a/src/routes/console/[project]/database/collection/[collection]/index.svelte b/src/routes/console/[project]/database/collection/[collection]/index.svelte index 79a7f78164..4759c2f889 100644 --- a/src/routes/console/[project]/database/collection/[collection]/index.svelte +++ b/src/routes/console/[project]/database/collection/[collection]/index.svelte @@ -9,7 +9,7 @@ TableCellHead, TableCellLink } from '$lib/elements/table'; - import { Empty, Pagination, ElementCount } from '$lib/components'; + import { Empty, Pagination } from '$lib/components'; import { collection } from './store'; import { Container } from '$lib/layout'; import { Button } from '$lib/elements/forms'; @@ -36,7 +36,7 @@
    {:then response} {#if response.total} - documents +

    {response.total} documents found

    {#each columns as column} diff --git a/src/routes/console/[project]/functions/index.svelte b/src/routes/console/[project]/functions/index.svelte index 388f5d96df..c77c62a26f 100644 --- a/src/routes/console/[project]/functions/index.svelte +++ b/src/routes/console/[project]/functions/index.svelte @@ -2,7 +2,7 @@ import { page } from '$app/stores'; import { sdkForProject } from '$lib/stores/sdk'; import { Button, InputSearch } from '$lib/elements/forms'; - import { Card, Empty, Pagination, Tile, Tiles, ElementCount } from '$lib/components'; + import { Card, Empty, Pagination, Tile, Tiles } from '$lib/components'; import Create from './_create.svelte'; import { Container } from '$lib/layout'; import { base } from '$app/paths'; @@ -28,7 +28,7 @@
    {:then response} {#if response.total} - functions +

    {response.total} functions found

    {#each response.functions as func} {:then response} {#if response.total} - files - +

    {response.total} files found

    diff --git a/src/routes/console/[project]/users/index.svelte b/src/routes/console/[project]/users/index.svelte index d167d15e29..e7048aea68 100644 --- a/src/routes/console/[project]/users/index.svelte +++ b/src/routes/console/[project]/users/index.svelte @@ -1,7 +1,7 @@ - -{#key $page.url.pathname} -
    - -
    -{/key} diff --git a/src/routes/console/[project]/functions/__layout.svelte b/src/routes/console/[project]/functions/__layout.svelte index 3d2c010e24..6998ad013e 100644 --- a/src/routes/console/[project]/functions/__layout.svelte +++ b/src/routes/console/[project]/functions/__layout.svelte @@ -2,7 +2,7 @@ import { base } from '$app/paths'; import { page } from '$app/stores'; import { Back } from '$lib/components'; - import { Cover, PageTransition } from '$lib/layout'; + import { Cover } from '$lib/layout'; import Tabs from './_tabs.svelte'; const project = $page.params.project; @@ -20,6 +20,4 @@ {/if} - - - + diff --git a/src/routes/console/[project]/keys/__layout.svelte b/src/routes/console/[project]/keys/__layout.svelte index 9dc0f82b45..df96cc6b9c 100644 --- a/src/routes/console/[project]/keys/__layout.svelte +++ b/src/routes/console/[project]/keys/__layout.svelte @@ -2,7 +2,7 @@ import { base } from '$app/paths'; import { page } from '$app/stores'; import { Back } from '$lib/components'; - import { Cover, PageTransition } from '$lib/layout'; + import { Cover } from '$lib/layout'; const projectId = $page.params.project; @@ -12,6 +12,4 @@ API Keys - - - + diff --git a/src/routes/console/[project]/settings/__layout.svelte b/src/routes/console/[project]/settings/__layout.svelte index 674e64c69f..57a76442f9 100644 --- a/src/routes/console/[project]/settings/__layout.svelte +++ b/src/routes/console/[project]/settings/__layout.svelte @@ -2,7 +2,7 @@ import { base } from '$app/paths'; import { page } from '$app/stores'; import { Back } from '$lib/components'; - import { Cover, PageTransition } from '$lib/layout'; + import { Cover } from '$lib/layout'; import Tabs from './_tabs.svelte'; const project = $page.params.project; @@ -19,6 +19,4 @@ Settings - - - + diff --git a/src/routes/console/[project]/storage/__layout.svelte b/src/routes/console/[project]/storage/__layout.svelte index 54a3bac960..3253557f29 100644 --- a/src/routes/console/[project]/storage/__layout.svelte +++ b/src/routes/console/[project]/storage/__layout.svelte @@ -3,7 +3,7 @@ import { page } from '$app/stores'; import { Back } from '$lib/components'; - import { Cover, PageTransition } from '$lib/layout'; + import { Cover } from '$lib/layout'; import Tabs from './_tabs.svelte'; const project = $page.params.project; @@ -22,6 +22,4 @@ {/if} - - - + diff --git a/src/routes/console/[project]/users/__layout.svelte b/src/routes/console/[project]/users/__layout.svelte index 3367ee12e8..1f1d1a7756 100644 --- a/src/routes/console/[project]/users/__layout.svelte +++ b/src/routes/console/[project]/users/__layout.svelte @@ -2,7 +2,7 @@ import { base } from '$app/paths'; import { page } from '$app/stores'; import { Back } from '$lib/components'; - import { Cover, PageTransition } from '$lib/layout'; + import { Cover } from '$lib/layout'; import Tabs from './_tabs.svelte'; const project = $page.params.project; @@ -20,6 +20,4 @@ {/if} - - - + From 665473e282cce15d48f89f55b1a2d080181da61c Mon Sep 17 00:00:00 2001 From: Arman Date: Tue, 26 Apr 2022 09:29:17 +0200 Subject: [PATCH 24/26] removed missed transition --- src/routes/console/[project]/database/__layout.svelte | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/src/routes/console/[project]/database/__layout.svelte b/src/routes/console/[project]/database/__layout.svelte index 789ea302ad..5a41d46614 100644 --- a/src/routes/console/[project]/database/__layout.svelte +++ b/src/routes/console/[project]/database/__layout.svelte @@ -1,7 +1,5 @@