mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[feat] new model selection screen

Browse Source
This commit is contained in:
kwaroran
2023-05-26 20:23:45 +09:00
parent cf9ae31a26
commit 4903a88131
7 changed files with 123 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/lib/Setting/Settings.svelte
View File

@@ -13,9 +13,9 @@
import Communities from "./Pages/Communities.svelte";
import GlobalLoreBookSettings from "./Pages/GlobalLoreBookSettings.svelte";
import Lorepreset from "./lorepreset.svelte";
import GlobalRegex from "./Pages/GlobalRegex.svelte";
import LanguageSettings from "./Pages/LanguageSettings.svelte";
import AccessibilitySettings from "./Pages/AccessibilitySettings.svelte";
import GlobalRegex from "./Pages/GlobalRegex.svelte";
import LanguageSettings from "./Pages/LanguageSettings.svelte";
import AccessibilitySettings from "./Pages/AccessibilitySettings.svelte";
let selected = -1
let openPresetList = false
let openLoreList = false

15
src/lib/UI/Arcodion.svelte Normal file
View File

@@ -0,0 +1,15 @@
<script lang="ts">
export let name = ""
let open = false
</script>
<div class="flex flex-col">
<button class="hover:bg-selected px-6 py-2 text-lg" class:bg-selected={open} on:click={() => {
open = !open
}}>{name}</button>
{#if open}
<div class="flex flex-col bg-darkbg">
<slot></slot>
</div>
{/if}
</div>

88
src/lib/UI/ModelList.svelte
View File

@@ -1,32 +1,74 @@
<script lang="ts">
import { DataBase } from "src/ts/database";
import { isTauri } from "src/ts/globalApi";
import { getHordeModels } from "src/ts/horde/getModels";
import Arcodion from "./Arcodion.svelte";
import { language } from "src/lang";
export let value = ""
let openOptions = false
function getModelName(name:string){
switch(name){
case "gpt35":
return "GPT-3.5 Turbo"
case "gpt4":
return "GPT-4"
case "palm2":
return "PaLM2"
case "textgen_webui":
return "Oobabooga WebUI"
case "kobold":
return "Kobold"
case "custom":
return "Plugin"
default:
if(name.startsWith("horde:::")){
return name.replace(":::", " ")
}
return ''
}
}
function changeModel(name:string){
value = name
openOptions = false
}
</script>
{#await getHordeModels()}
<select class="bg-transparent input-text mt-2 mb-2 text-gray-200 appearance-none text-sm" value="">
<option value="" class="bg-darkbg appearance-none">Loading...</option>
</select>
{:then models}
<select class="bg-transparent input-text mt-2 mb-2 text-gray-200 appearance-none text-sm" bind:value>
<optgroup class="bg-darkbg appearance-none" label="OpenAI">
<option value="gpt35" class="bg-darkbg appearance-none">OpenAI GPT-3.5</option>
<option value="gpt4" class="bg-darkbg appearance-none">OpenAI GPT-4</option>
</optgroup>
<optgroup class="bg-darkbg appearance-none" label="Other Providers">
<option value="palm2" class="bg-darkbg appearance-none">Google Palm2</option>
<option value="textgen_webui" class="bg-darkbg appearance-none">Text Generation WebUI</option>
{#if openOptions}
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="fixed top-0 w-full h-full left-0 bg-black bg-opacity-50 z-50 flex justify-center items-center" on:click={() => {
openOptions = false
}}>
<div class="w-96 max-w-full max-h-full overflow-y-auto overflow-x-hidden bg-bgcolor p-4 flex flex-col" on:click|stopPropagation>
<h1 class="font-bold text-xl">{language.model}</h1>
<div class="border-t-1 border-y-selected mt-1 mb-1"></div>
<Arcodion name="OpenAI GPT">
<button class="p-2 hover:text-green-500" on:click={() => {changeModel('gpt35')}}>GPT-3.5 Turbo</button>
<button class="p-2 hover:text-green-500" on:click={() => {changeModel('gpt4')}}>GPT-4</button>
</Arcodion>
<button class="hover:bg-selected px-6 py-2 text-lg" on:click={() => {changeModel('textgen_webui')}}>Oobabooga WebUI</button>
<button class="hover:bg-selected px-6 py-2 text-lg" on:click={() => {changeModel('palm2')}}>Google PaLM2</button>
<button class="hover:bg-selected px-6 py-2 text-lg" on:click={() => {changeModel('kobold')}}>Kobold</button>
<Arcodion name="Horde">
{#await getHordeModels()}
<button class="p-2">Loading...</button>
{:then models}
{#each models as model}
<button on:click={() => {changeModel("horde:::" + model)}} class="p-2 hover:text-green-500">{model.trim()}</button>
{/each}
{/await}
</Arcodion>
{#if $DataBase.plugins.length > 0}
<option value="custom" class="bg-darkbg appearance-none">Plugin</option>
<button on:click={() => {changeModel('plugin')}} class="hover:bg-selected px-6 py-2 text-lg" >Plugin</button>
{/if}
</optgroup>
<optgroup class="bg-darkbg appearance-none" label="Horde">
{#each models as model}
<option value={"horde:::" + model} class="bg-darkbg appearance-none">{model}</option>
{/each}
</optgroup>
</select>
{/await}
</div>
</div>
{/if}
<button on:click={() => {openOptions = true}}
class="mt-4 drop-shadow-lg p-3 flex justify-center items-center ml-2 mr-2 rounded-lg bg-selected mb-4">
{getModelName(value)}
</button>