From 02b0e0cf9f99dbd5fe6a7a8704aafcb4ff7d502e Mon Sep 17 00:00:00 2001
From: kwaroran <amasio1234@proton.me>
Date: Sat, 6 Jul 2024 01:44:10 +0900
Subject: [PATCH] feat: add account warn

---
 src/App.svelte                           |  5 +++++
 src/lib/Others/AccountWarningComp.svelte | 11 +++++++++++
 2 files changed, 16 insertions(+)
 create mode 100644 src/lib/Others/AccountWarningComp.svelte

diff --git a/src/App.svelte b/src/App.svelte
index c8169651..7332c8ab 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -11,6 +11,8 @@
     import Settings from './lib/Setting/Settings.svelte';
     import { showRealmInfoStore } from './ts/characterCards';
     import RealmFrame from './lib/UI/Realm/RealmFrame.svelte';
+    import { AccountWarning } from './ts/storage/accountStorage';
+    import AccountWarningComp from './lib/Others/AccountWarningComp.svelte';
 
     let didFirstSetup: boolean  = false
     let gridOpen = false
@@ -63,4 +65,7 @@
     {#if $ShowRealmFrameStore}
         <RealmFrame />
     {/if}
+    {#if $AccountWarning}
+        <AccountWarningComp />
+    {/if}
 </main>
\ No newline at end of file
diff --git a/src/lib/Others/AccountWarningComp.svelte b/src/lib/Others/AccountWarningComp.svelte
new file mode 100644
index 00000000..f7eed71e
--- /dev/null
+++ b/src/lib/Others/AccountWarningComp.svelte
@@ -0,0 +1,11 @@
+<script lang="ts">
+  import { AlertOctagon } from "lucide-svelte";
+  import { alertMd } from "src/ts/alert";
+  import { AccountWarning } from "src/ts/storage/accountStorage";
+
+</script>
+<button class="absolute top-2 right-2 z-10 text-white bg-red-800 hover:bg-red-600 p-2 rounded" on:click={() =>{
+    alertMd($AccountWarning)
+}}>
+    <AlertOctagon size={24} />
+</button>
\ No newline at end of file