[feat] persona import/export
This commit is contained in:
@@ -1,12 +1,14 @@
|
||||
<script lang="ts">
|
||||
import { language } from "src/lang";
|
||||
import BaseRoundedButton from "src/lib/UI/BaseRoundedButton.svelte";
|
||||
import TextAreaInput from "src/lib/UI/GUI/TextAreaInput.svelte";
|
||||
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
|
||||
import { alertConfirm, alertError } from "src/ts/alert";
|
||||
import { changeUserPersona, getCharImage, saveUserPersona, selectUserImg } from "src/ts/characters";
|
||||
import BaseRoundedButton from "src/lib/UI/BaseRoundedButton.svelte";
|
||||
import Button from "src/lib/UI/GUI/Button.svelte";
|
||||
import TextAreaInput from "src/lib/UI/GUI/TextAreaInput.svelte";
|
||||
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
|
||||
import { alertConfirm, alertError, alertSelect } from "src/ts/alert";
|
||||
import { getCharImage } from "src/ts/characters";
|
||||
import { changeUserPersona, exportUserPersona, importUserPersona, saveUserPersona, selectUserImg } from "src/ts/persona";
|
||||
import { DataBase, setDatabase } from "src/ts/storage/database";
|
||||
import { get } from "svelte/store";
|
||||
import { get } from "svelte/store";
|
||||
|
||||
</script>
|
||||
<h2 class="mb-2 text-2xl font-bold mt-2">{language.persona}</h2>
|
||||
@@ -29,7 +31,11 @@
|
||||
{/each}
|
||||
<div class="flex justify-center items-center ml-2 mr-2">
|
||||
<BaseRoundedButton
|
||||
onClick={() => {
|
||||
onClick={async () => {
|
||||
const sel = parseInt(await alertSelect([language.createfromScratch, language.importCharacter]))
|
||||
if(sel === 1){
|
||||
return
|
||||
}
|
||||
let db = get(DataBase)
|
||||
db.personas.push({
|
||||
name: 'New Persona',
|
||||
@@ -57,8 +63,8 @@
|
||||
<div class="mt-4 mb-4 border-y-1 border-y-selected">
|
||||
</div>
|
||||
|
||||
<div class="flex w-full items-starts rounded-md bg-darkbg p-4">
|
||||
<div class="flex flex-col mt-4">
|
||||
<div class="flex w-full items-starts rounded-md bg-darkbg p-4 max-w-full flex-wrap">
|
||||
<div class="flex flex-col mt-4 mr-4">
|
||||
<button on:click={() => {selectUserImg()}}>
|
||||
{#if $DataBase.userIcon === ''}
|
||||
<div class="rounded-md h-28 w-28 shadow-lg bg-textcolor2 cursor-pointer hover:text-green-500" />
|
||||
@@ -71,13 +77,16 @@
|
||||
{/if}
|
||||
</button>
|
||||
</div>
|
||||
<div class="flex flex-grow flex-col p-2 ml-4">
|
||||
<div class="flex flex-grow flex-col p-2 max-w-full">
|
||||
<span class="text-sm text-textcolor2">{language.name}</span>
|
||||
<TextInput marginBottom size="lg" placeholder="User" bind:value={$DataBase.username} />
|
||||
<span class="text-sm text-textcolor2">{language.description}</span>
|
||||
<TextAreaInput height="32" autocomplete="off" bind:value={$DataBase.personaPrompt} placeholder={`Put the description of this persona here.\nExample: [<user> is a 20 year old girl.]`} />
|
||||
<div>
|
||||
<button class="float-right rounded-md border border-red-700 p-2 hover:bg-red-700 transition-colors mt-4 text-sm" on:click={async () => {
|
||||
<div class="flex gap-2 mt-4 max-w-full flex-wrap">
|
||||
<Button on:click={exportUserPersona}>{language.export}</Button>
|
||||
<Button on:click={importUserPersona}>{language.import}</Button>
|
||||
|
||||
<Button styled="danger" on:click={async () => {
|
||||
if($DataBase.personas.length === 1){
|
||||
return
|
||||
}
|
||||
@@ -89,9 +98,7 @@
|
||||
$DataBase.personas = personas
|
||||
changeUserPersona(0, 'noSave')
|
||||
}
|
||||
}}>
|
||||
{language.remove}
|
||||
</button>
|
||||
}}>{language.remove}</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user