diff --git a/src/entrypoints/popup/App.svelte b/src/entrypoints/popup/App.svelte index e19d39f..ba033e3 100644 --- a/src/entrypoints/popup/App.svelte +++ b/src/entrypoints/popup/App.svelte @@ -2,6 +2,7 @@ import '@/assets/base.css'; import { fly } from 'svelte/transition'; + import Toast from '@/entrypoints/popup/components/Toast.svelte'; import Main from '@/entrypoints/popup/pages/main/Main.svelte'; import Settings from '@/entrypoints/popup/pages/settings/Settings.svelte'; import { isMobile } from '@/entrypoints/popup/state.js'; @@ -17,6 +18,7 @@
+ {#if activePage === 'main'}
(activePage = 'settings')} /> diff --git a/src/entrypoints/popup/components/Toast.svelte b/src/entrypoints/popup/components/Toast.svelte new file mode 100644 index 0000000..03ceb90 --- /dev/null +++ b/src/entrypoints/popup/components/Toast.svelte @@ -0,0 +1,13 @@ + + +{#if $toast} +
+ {$toast.message} +
+{/if} diff --git a/src/entrypoints/popup/pages/main/CopyMatch.svelte b/src/entrypoints/popup/pages/main/CopyMatch.svelte index 0d26896..cc41254 100644 --- a/src/entrypoints/popup/pages/main/CopyMatch.svelte +++ b/src/entrypoints/popup/pages/main/CopyMatch.svelte @@ -1,7 +1,7 @@ diff --git a/src/entrypoints/popup/state.ts b/src/entrypoints/popup/state.ts index 21cb581..5b58f2a 100644 --- a/src/entrypoints/popup/state.ts +++ b/src/entrypoints/popup/state.ts @@ -1,3 +1,22 @@ import { writable } from 'svelte/store'; +/* --- global init --- */ export const isMobile = writable(false); + +/* --- toast --- */ +interface Toast { + id: number; + message: string; +} + +export const toast = writable(null); + +let toastId = 0; + +export function showToast(message: string, duration = 2000) { + const id = ++toastId; + toast.set({ id, message }); + setTimeout(() => { + toast.update((current) => (current?.id === id ? null : current)); + }, duration); +}