refactor(ui): toast bileşeninde reactive store kullan
This commit is contained in:
@@ -2,16 +2,6 @@
|
|||||||
import { toast } from '../stores/toastStore.js';
|
import { toast } from '../stores/toastStore.js';
|
||||||
import { fade } from 'svelte/transition';
|
import { fade } from 'svelte/transition';
|
||||||
|
|
||||||
let toastData = {
|
|
||||||
message: null,
|
|
||||||
type: 'success',
|
|
||||||
visible: false
|
|
||||||
};
|
|
||||||
|
|
||||||
toast.subscribe(value => {
|
|
||||||
toastData = value;
|
|
||||||
});
|
|
||||||
|
|
||||||
const icons = {
|
const icons = {
|
||||||
success: 'fa-solid fa-circle-check',
|
success: 'fa-solid fa-circle-check',
|
||||||
error: 'fa-solid fa-circle-exclamation',
|
error: 'fa-solid fa-circle-exclamation',
|
||||||
@@ -19,11 +9,11 @@
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if toastData.visible && toastData.message}
|
{#if $toast.visible && $toast.message}
|
||||||
<div class="toast-container" transition:fade={{ duration: 200 }}>
|
<div class="toast-container" transition:fade={{ duration: 200 }}>
|
||||||
<div class="toast {toastData.type}">
|
<div class="toast {$toast.type}">
|
||||||
<i class="{icons[toastData.type] || icons.info}"></i>
|
<i class="{icons[$toast.type] || icons.info}"></i>
|
||||||
<span>{toastData.message}</span>
|
<span>{$toast.message}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
Reference in New Issue
Block a user