Add persona and preset hotkey

src/App.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import Sidebar from './lib/SideBars/Sidebar.svelte';
-    import { DynamicGUI, settingsOpen, sideBarStore, ShowRealmFrameStore } from './ts/stores';
+    import { DynamicGUI, settingsOpen, sideBarStore, ShowRealmFrameStore, openPresetList, openPersonaList } from './ts/stores';
     import { DataBase, loadedStore } from './ts/storage/database';
     import ChatScreen from './lib/ChatScreens/ChatScreen.svelte';
     import AlertComp from './lib/Others/AlertComp.svelte';
@@ -15,6 +15,8 @@
     import AccountWarningComp from './lib/Others/AccountWarningComp.svelte';
   import { isLite } from './ts/lite';
   import LiteMain from './LiteMain.svelte';
+  import Botpreset from './lib/Setting/botpreset.svelte';
+  import ListedPersona from './lib/Setting/listedPersona.svelte';
 
     let didFirstSetup: boolean  = false
     let gridOpen = false
@@ -73,4 +75,10 @@
     {#if $AccountWarning}
         <AccountWarningComp />
     {/if}
+    {#if $openPresetList}
+        <Botpreset close={() => {$openPresetList = false}} />
+    {/if}
+    {#if $openPersonaList}
+        <ListedPersona close={() => {$openPersonaList = false}} />
+    {/if}
 </main>

src/lib/Setting/Pages/BotSettings.svelte

@@ -25,6 +25,7 @@
     import OpenrouterSettings from "./OpenrouterSettings.svelte";
     import ChatFormatSettings from "./ChatFormatSettings.svelte";
   import PromptSettings from "./PromptSettings.svelte";
+  import { openPresetList } from "src/ts/stores";
 
     let tokens = {
         mainPrompt: 0,
@@ -32,7 +33,6 @@
         globalNote: 0,
     }
 
-    export let openPresetList =false
     export let goPromptTemplate = () => {}
 
     async function loadTokenize(){
@@ -564,7 +564,7 @@
         {/if}
     </Arcodion>
     {#if submenu !== -1}
-        <Button on:click={() => {openPresetList = true}} className="mt-4">{language.presets}</Button>
+        <Button on:click={() => {$openPresetList = true}} className="mt-4">{language.presets}</Button>
     {/if}
 {/if}
 
@@ -596,5 +596,5 @@
     </div>
 {/if}
 {#if submenu === -1}
-    <Button on:click={() => {openPresetList = true}} className="mt-4">{language.presets}</Button>
+    <Button on:click={() => {$openPresetList = true}} className="mt-4">{language.presets}</Button>
 {/if}

src/lib/Setting/Settings.svelte

@@ -21,7 +21,6 @@
     import ThanksPage from "./Pages/ThanksPage.svelte";
     import ModuleSettings from "./Pages/Module/ModuleSettings.svelte";
 
-    let openPresetList = false
     let openLoreList = false
     if(window.innerWidth >= 900 && $SettingsMenuIndex === -1){
         $SettingsMenuIndex = 1
@@ -146,7 +145,7 @@
                     {#if $SettingsMenuIndex === 0}
                         <UserSettings />
                     {:else if $SettingsMenuIndex === 1}
-                        <BotSettings bind:openPresetList goPromptTemplate={() => {
+                        <BotSettings goPromptTemplate={() => {
                             $SettingsMenuIndex = 13
                         }} />
                     {:else if $SettingsMenuIndex === 2}
@@ -195,9 +194,6 @@
         {/if}
     </div>
 </div>
-{#if openPresetList}
-    <Botpreset close={() => {openPresetList = false}} />
-{/if}
 {#if openLoreList}
     <Lorepreset close={() => {openLoreList = false}} />
 {/if}

src/lib/Setting/listedPersona.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+    import { XIcon } from "lucide-svelte";
+    import { language } from "../../lang";
+    import { DataBase } from "../../ts/storage/database";
+    import { changeUserPersona } from "src/ts/persona";
+
+
+    export let close = () => {}
+
+</script>
+
+<div class="absolute w-full h-full z-40 bg-black bg-opacity-50 flex justify-center items-center">
+    <div class="bg-darkbg p-4 break-any rounded-md flex flex-col max-w-3xl w-96 max-h-full overflow-y-auto">
+        <div class="flex items-center text-textcolor mb-4">
+            <h2 class="mt-0 mb-0">{language.persona}</h2>
+            <div class="flex-grow flex justify-end">
+                <button class="text-textcolor2 hover:text-green-500 mr-2 cursor-pointer items-center" on:click={close}>
+                    <XIcon size={24}/>
+                </button>
+            </div>
+        </div>
+        {#each $DataBase.personas as persona, i}
+            <button on:click={() => {
+                changeUserPersona(i)
+                close()
+            }} class="flex items-center text-textcolor border-t-1 border-solid border-0 border-darkborderc p-2 cursor-pointer" class:bg-selected={i === $DataBase.selectedPersona}>
+                <span>{persona.name}</span>
+            </button>
+        {/each}
+    </div>
+</div>
+
+<style>
+    .break-any{
+        word-break: normal;
+        overflow-wrap: anywhere;
+    }
+</style>

src/lib/SideBars/Sidebar.svelte

@@ -52,7 +52,6 @@
     import SideChatList from "./SideChatList.svelte";
     import { joinMultiuserRoom } from "src/ts/sync/multiuser";
   import { sideBarSize } from "src/ts/gui/guisize";
-  let openPresetList = false;
   let sideBarMode = 0;
   let editMode = false;
   let menuMode = 0;
@@ -703,14 +702,6 @@
   {/if}
 </div>
 
-{#if openPresetList}
-  <Botpreset
-    close={() => {
-      openPresetList = false;
-    }}
-  />
-{/if}
-
 {#if $DynamicGUI}
     <div class="flex-grow h-full min-w-12" class:hidden={hidden} on:click={() => {
       if($sideBarClosing){

src/ts/hotkey.ts

@@ -1,7 +1,7 @@
 import { get } from "svelte/store"
 import { alertToast, doingAlert } from "./alert"
 import { DataBase, changeToPreset as changeToPreset2  } from "./storage/database"
-import { selectedCharID, settingsOpen } from "./stores"
+import { openPersonaList, openPresetList, selectedCharID, settingsOpen } from "./stores"
 
 export function initHotkey(){
     document.addEventListener('keydown', (ev) => {
@@ -73,6 +73,18 @@ export function initHotkey(){
                     ev.stopPropagation()
                     break
                 }
+                case 'p':{
+                    openPresetList.set(!get(openPresetList))
+                    ev.preventDefault()
+                    ev.stopPropagation()
+                    break
+                }
+                case 'e':{
+                    openPersonaList.set(!get(openPersonaList))
+                    ev.preventDefault()
+                    ev.stopPropagation()
+                    break
+                }
             }
         }
         if(ev.key === 'Escape'){

src/ts/stores.ts

@@ -26,7 +26,8 @@ export const ViewBoxsize = writable({ width: 12 * 16, height: 12 * 16 }); // Def
 export const settingsOpen = writable(false)
 export const botMakerMode = writable(false)
 export const moduleBackgroundEmbedding = writable('')
-
+export const openPresetList = writable(false)
+export const openPersonaList = writable(false)
 //optimization
 
 export const CurrentCharacter = writable(null) as Writable<character | groupChat>