feat: debounce buttons

This commit is contained in:
EETagent 2022-12-05 23:38:24 +01:00
parent b9bc1c278a
commit 5086583ead
2 changed files with 8 additions and 5 deletions

View file

@ -1,4 +1,6 @@
<script lang="ts">
import debounce from 'just-debounce-it';
import { apiDeltePortfolio, apiSubmitPortfolio } from '$lib/@api/candidate';
import Circles from '$lib/components/icons/Circles.svelte';
import { fetchSubmProgress, type Status } from '$lib/stores/portfolio';
@ -24,17 +26,17 @@
};
const handleNotificationClick = async () => {
if (status === "uploaded") {
if (status === 'uploaded') {
await submitPortfolio();
} else if (status === "submitted") {
} else if (status === 'submitted') {
await deletePortfolio();
}
}
};
</script>
<div class="card flex flex-col">
<div class="infoBar flex flex-row-reverse">
<StatusNotificationBig {loading} {status} on:click={handleNotificationClick} />
<StatusNotificationBig {loading} {status} on:click={debounce(handleNotificationClick, 150)} />
</div>
<div class="relative flex flex-row justify-between">
<div>

View file

@ -1,5 +1,6 @@
<script lang="ts">
import FileType from './FileType.svelte';
import debounce from 'just-debounce-it';
import { filedrop, type FileDropOptions } from 'filedrop-svelte';
import { submissionProgress, UploadStatus, type Status } from '$lib/stores/portfolio';
import { createEventDispatcher } from 'svelte';
@ -105,7 +106,7 @@
{#if status === 'uploaded'}
<button
class="mr-3 rounded-xl bg-[#ef8b46] py-0.5 px-2 text-white shadow-md transition-all duration-300 hover:bg-orange-400"
on:click={() => dispatch('delete')}>Smazat</button
on:click={debounce(() => dispatch('delete'), 150)}>Smazat</button
>
{/if}
<StatusNotificationDot {status} />