Add Chat playground

This commit is contained in:
kwaroran
2024-04-24 22:42:27 +09:00
parent 430c162af1
commit f50e5fcd69
5 changed files with 86 additions and 28 deletions

View File

@@ -1,5 +1,5 @@
<script lang="ts">
import { ArrowLeft, ArrowRight, PencilIcon, LanguagesIcon, RefreshCcwIcon, TrashIcon, CopyIcon, Volume2Icon, BotIcon } from "lucide-svelte";
import { ArrowLeft, ArrowRight, PencilIcon, LanguagesIcon, RefreshCcwIcon, TrashIcon, CopyIcon, Volume2Icon, BotIcon, ArrowLeftRightIcon } from "lucide-svelte";
import { ParseMarkdown, type simpleCharacterArgument } from "../../ts/parser";
import AutoresizeArea from "../UI/GUI/TextAreaResizable.svelte";
import { alertConfirm, alertError, alertRequestData } from "../../ts/alert";
@@ -142,7 +142,17 @@
{/await}
<span class="flex flex-col ml-4 w-full max-w-full min-w-0">
<div class="flexium items-center chat">
<span class="chat text-xl unmargin">{name}</span>
{#if $CurrentCharacter.chaId === "§playground"}
<span class="chat text-xl border-darkborderc flex items-center">
<span>{name === 'assistant' ? 'Assistant' : 'User'}</span>
<button class="ml-2 text-textcolor2 hover:text-textcolor" on:click={() => {
$CurrentChat.message[idx].role = $CurrentChat.message[idx].role === 'char' ? 'user' : 'char'
$CurrentChat = $CurrentChat
}}><ArrowLeftRightIcon size="18" /></button>
</span>
{:else}
<span class="chat text-xl unmargin">{name}</span>
{/if}
<div class="flex-grow flex items-center justify-end text-textcolor2">
<span class="text-xs">{statusMessage}</span>
{#if $DataBase.useChatCopy}

View File

@@ -1,7 +1,7 @@
<script lang="ts">
import Suggestion from './Suggestion.svelte';
import AdvancedChatEditor from './AdvancedChatEditor.svelte';
import { CameraIcon, DatabaseIcon, DicesIcon, GlobeIcon, ImagePlusIcon, LanguagesIcon, Laugh, MenuIcon, MicOffIcon, PackageIcon, RefreshCcwIcon, ReplyIcon, Send, StepForwardIcon } from "lucide-svelte";
import { CameraIcon, DatabaseIcon, DicesIcon, GlobeIcon, ImagePlusIcon, LanguagesIcon, Laugh, MenuIcon, MicOffIcon, PackageIcon, Plus, RefreshCcwIcon, ReplyIcon, Send, StepForwardIcon } from "lucide-svelte";
import { CurrentCharacter, CurrentChat, CurrentUsername, selectedCharID, CurrentUserIcon, CurrentShowMemoryLimit,CurrentSimpleCharacter, PlaygroundStore } from "../../ts/stores";
import Chat from "./Chat.svelte";
import { DataBase, type Message, type character, type groupChat } from "../../ts/storage/database";
@@ -452,14 +452,26 @@
class="mr-2 bg-textcolor2 flex justify-center items-center text-gray-100 w-12 h-12 rounded-md hover:bg-green-500 transition-colors"><Send />
</div>
{/if}
{#if $CurrentCharacter.chaId !== '§playground'}
<div on:click={(e) => {
openMenu = !openMenu
e.stopPropagation()
}}
class="mr-2 bg-textcolor2 flex justify-center items-center text-gray-100 w-12 h-12 rounded-md hover:bg-green-500 transition-colors"><MenuIcon />
</div>
{:else}
<div on:click={(e) => {
$CurrentChat.message.push({
role: 'char',
data: ''
})
$CurrentChat = $CurrentChat
}}
class="mr-2 bg-textcolor2 flex justify-center items-center text-gray-100 w-12 h-12 rounded-md hover:bg-green-500 transition-colors"><Plus />
</div>
{/if}
</div>
{#if $DataBase.useAutoTranslateInput && !$DataBase.useAdvancedEditor}
{#if $DataBase.useAutoTranslateInput && !$DataBase.useAdvancedEditor && $CurrentCharacter.chaId !== '§playground'}
<div class="flex items-center mt-2 mb-2">
<label for='messageInputTranslate' class="text-textcolor ml-4">
<LanguagesIcon />
@@ -567,7 +579,7 @@
{/if}
{/each}
{#if $CurrentChat.message.length <= loadPages}
{#if $CurrentCharacter.type !== 'group'}
{#if $CurrentCharacter.type !== 'group' && $CurrentCharacter.chaId !== '§playground'}
<Chat
character={$CurrentSimpleCharacter}
name={$CurrentCharacter.name}