mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-19 04:17:52 +00:00
Merge branch 'main' of https://github.com/ParisNeo/lollms-webui into main
This commit is contained in:
saloui
commit
5d4e455092
@ -167,7 +167,11 @@ class LoLLMsAPPI():
|
||||
model_url = data["model_url"]
|
||||
signature = f"{model_name}_{binding_folder}_{model_url}"
|
||||
self.download_infos[signature]["cancel"]=True
|
||||
|
||||
self.socketio.emit('canceled', {
|
||||
'status': True
|
||||
},
|
||||
room=self.current_room_id
|
||||
)
|
||||
|
||||
@socketio.on('install_model')
|
||||
def install_model(data):
|
||||
@ -263,6 +267,7 @@ class LoLLMsAPPI():
|
||||
|
||||
if self.download_infos[signature]["cancel"]:
|
||||
raise Exception("canceled")
|
||||
|
||||
|
||||
if hasattr(self.binding, "download_model"):
|
||||
try:
|
||||
|
||||
@ -58,4 +58,20 @@ Let's select a 4 bits quantization which is a good ratio between size and perfor
|
||||
Press install and wait for it to download the model. You can install multiple models simultaniously. Make sure you have enough disk space as some of those models are very big.
|
||||
Now let's take a look at the new personalities system.
|
||||
The new system allows us to mount multiple personalities in the same session. This means that we can create a multipersonalities discussion.
|
||||
There are many categories for english language. I will probably create more languages in the future and translate those personality files.
|
||||
There are in total over 260 personalities in different fields and sorts. You can checkout the Job category where you cvan find multiple personalities.
|
||||
We can activate personalities like shoping in a mall. Those personalities will be loaded at startup and will be easily accessible in the mounted personalities list.
|
||||
Most personalities just have a yaml conditioning file and a logo in the assets folder. But some other personalities are more advanted with behavior and configuration parameters. Here we are going to show simple conversational personalities.
|
||||
You can either use the personalities category organization or the search bar.
|
||||
Once you finish mounting personalities, you can start a conversation. Here we talk to Einstein.
|
||||
Let's ask it to teach us relativity.
|
||||
To select another personality to interact with Einstein, just go to the settings page and select the personality you want to use. We are developing fast access to personalities in the main discussion page, it should be out in few days from now.
|
||||
Let's select Jack Sparrow.
|
||||
To trigger generation, just press the refresh button from previous message and the tool will use your active personality to generate the next mesasge. you can go on doing this and exploring possible interactions between AI-s.
|
||||
|
||||
Few days have passed and now the personality system has been enhanced. Let's start by mounting personalities to use in a multipersonalities conversation.
|
||||
|
||||
|
||||
Let's talk to empror Napoleon Bonaparte and ask it about his plans after conquering Egypt.Now, as you can see, you have a new module in the ui that shows the current personality icon. When we press the + button, we can select the personality to talk to.
|
||||
|
||||
With this, we can make personalities talk to each other by selecting next personality and pressing the regenerate answer button. This will be refined in the future. It is still a work in progress but the feature is pretty much usable right now. You can explore impossible discussions between personalities that never lived in the same era, never spoken the same language and sometimes the discussions get really interesting. Be aware that the quality of the discussions depend heavily on the model you use. You can view which model was used to generate each message as well as time needed to generate the answer. Feel free to explore these things and share your findings on internet.
|
||||
@ -86,13 +86,16 @@
|
||||
|
||||
</button>
|
||||
</div>
|
||||
<div v-if="showPersonalities" class="container">
|
||||
<MountedPersonalitiesList ref="mountedPersList" :on-mount-unmount="onMountUnmountFun" />
|
||||
</div>
|
||||
<!-- CHAT BOX -->
|
||||
<div class="flex flex-row flex-grow items-center gap-2 ">
|
||||
<!-- <div class="w-24">
|
||||
<MountedPersonalities @click.stop=""/>
|
||||
<div class="flex flex-row flex-grow items-center gap-2 overflow-visible">
|
||||
<div class="w-fit">
|
||||
<MountedPersonalities ref="mountedPers" :onShowPersList="onShowPersListFun" />
|
||||
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
|
||||
|
||||
<div class="relative grow">
|
||||
<textarea id="chat" rows="1" v-model="message" title="Hold SHIFT + ENTER to add new line"
|
||||
@ -175,6 +178,7 @@ import { nextTick, TransitionGroup } from 'vue'
|
||||
import feather from 'feather-icons'
|
||||
import filesize from '../plugins/filesize'
|
||||
import MountedPersonalities from './MountedPersonalities.vue'
|
||||
import MountedPersonalitiesList from './MountedPersonalitiesList.vue'
|
||||
export default {
|
||||
name: 'ChatBox',
|
||||
emits: ["messageSentEvent", "stopGenerating"],
|
||||
@ -184,7 +188,8 @@ export default {
|
||||
|
||||
},
|
||||
components: {
|
||||
MountedPersonalities
|
||||
MountedPersonalities,
|
||||
MountedPersonalitiesList
|
||||
},
|
||||
setup() {
|
||||
|
||||
@ -195,10 +200,19 @@ export default {
|
||||
return {
|
||||
message: "",
|
||||
fileList: [],
|
||||
totalSize: 0
|
||||
totalSize: 0,
|
||||
showPersonalities: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onShowPersListFun(comp) {
|
||||
this.showPersonalities = comp.show
|
||||
|
||||
},
|
||||
onMountUnmountFun(comp) {
|
||||
console.log('mountunmount chat')
|
||||
this.$refs.mountedPers.constructor()
|
||||
},
|
||||
computedFileSize(size) {
|
||||
nextTick(() => {
|
||||
feather.replace()
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="break-all">
|
||||
<div v-html="renderedMarkdown" class=""></div>
|
||||
<div v-html="renderedMarkdown" class="markdown-content"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -82,6 +82,7 @@ const markdownIt = new MarkdownIt('commonmark', {
|
||||
'</div>';
|
||||
return codeString;
|
||||
},
|
||||
bulletListMarker: '•',
|
||||
}).use(emoji).use(attrs); // Add attrs plugin for adding attributes to elements
|
||||
|
||||
markdownIt.renderer.rules.link_open = (tokens, idx, options, env, self) => {
|
||||
@ -161,4 +162,11 @@ export default {
|
||||
|
||||
<style>
|
||||
/* Include any additional styles you need */
|
||||
ul {
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,11 +1,35 @@
|
||||
<template>
|
||||
<div
|
||||
class="group rounded-lg m-2 shadow-lg hover:border-primary dark:hover:border-primary hover:border-solid hover:border-2 border-2 border-transparent even:bg-bg-light-discussion-odd dark:even:bg-bg-dark-discussion-odd flex flex-col flex-grow flex-wrap overflow-x-hidden p-4 pb-2">
|
||||
class="relative group rounded-lg m-2 shadow-lg hover:border-primary dark:hover:border-primary hover:border-solid hover:border-2 border-2 border-transparent even:bg-bg-light-discussion-odd dark:even:bg-bg-dark-discussion-odd flex flex-col flex-grow flex-wrap overflow-visible p-4 pb-2 ">
|
||||
<div class="flex flex-row gap-2 ">
|
||||
<div class="flex-shrink-0 ">
|
||||
<div class=" flex-shrink-0">
|
||||
<!-- AVATAR -->
|
||||
<img :src="getImgUrl()" @error="defaultImg($event)" class="w-10 h-10 rounded-full object-fill text-red-700">
|
||||
<div class="group/avatar " >
|
||||
<img :src="getImgUrl()" @error="defaultImg($event)" :data-popover-target="'avatar' + message.id" data-popover-placement="bottom"
|
||||
class="w-10 h-10 rounded-full object-fill text-red-700">
|
||||
|
||||
<!-- ADDITIONAL INFO -->
|
||||
<!-- <div data-popper :id="'avatar' + message.id" role="tooltip"
|
||||
class=" -mx-2 absolute invisible rounded-lg bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel block m-2 p-1 opacity-0 z-10 transition-opacity ease-in-out duration-500 group-hover/avatar:visible group-hover/avatar:opacity-100 ">
|
||||
|
||||
<div class="relative flex flex-row items-start">
|
||||
|
||||
<img :src="getImgUrl()" @error="defaultImg($event)" class=" border-2 border-primary p-1 rounded-lg w-60 h-60" />
|
||||
|
||||
<div class="flex flex-col justify-between p-4 leading-normal">
|
||||
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">Noteworthy
|
||||
technology acquisitions 2021</h5>
|
||||
<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">Here are the biggest enterprise
|
||||
technology acquisitions of 2021 so far, in reverse chronological order.</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col w-full flex-grow-0 ">
|
||||
@ -325,17 +349,17 @@ export default {
|
||||
const endTime = new Date(Date.parse(this.message.finished_generating_at))
|
||||
//const spentTime = new Date(endTime - startTime)
|
||||
const same = endTime.getTime() === startTime.getTime();
|
||||
if(same){
|
||||
|
||||
if (same) {
|
||||
|
||||
return undefined
|
||||
}
|
||||
|
||||
if(!endTime.getTime()){
|
||||
return undefined
|
||||
if (!endTime.getTime()) {
|
||||
return undefined
|
||||
}
|
||||
let timeDiff = endTime.getTime() - startTime.getTime();
|
||||
|
||||
|
||||
|
||||
const hours = Math.floor(timeDiff / (1000 * 60 * 60));
|
||||
|
||||
timeDiff -= hours * (1000 * 60 * 60);
|
||||
@ -364,8 +388,8 @@ export default {
|
||||
// let m = addZero(spentTime.getMinutes());
|
||||
// let s = addZero(spentTime.getSeconds());
|
||||
const time = addZero(hours) + "h:" + addZero(mins) + "m:" + addZero(secs) + 's';
|
||||
|
||||
|
||||
|
||||
|
||||
return time
|
||||
|
||||
|
||||
|
||||
@ -1,37 +1,24 @@
|
||||
<template>
|
||||
<!-- LIST OF MOUNTED PERSONALITIES -->
|
||||
<div
|
||||
class=" text-base font-semibold cursor-pointer select-none items-center flex flex-row overflow-visible overflow-x-auto scrollbar-thin scrollbar-track-bg-light scrollbar-thumb-bg-light-tone hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark dark:scrollbar-thumb-bg-dark-tone dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary">
|
||||
<!-- LIST -->
|
||||
<div class="flex -space-x-4 items-center ">
|
||||
<!-- ITEM -->
|
||||
<div class="relative hover:-translate-y-2 duration-300 hover:z-10 shrink-0 "
|
||||
v-for="(item, index) in mountedPersArr" :key="index + '-' + item.name">
|
||||
<div class="group items-center flex flex-row">
|
||||
<button @click.stop="onPersonalitySelected(item)">
|
||||
|
||||
<img :src="bUrl + item.avatar" @error="personalityImgPlacehodler"
|
||||
class="w-8 h-8 rounded-full object-fill text-red-700 border-2 active:scale-90 group-hover:border-secondary "
|
||||
:class="configFile.active_personality_id == configFile.personalities.indexOf(item.full_path) ? 'border-secondary' : 'border-transparent z-0'"
|
||||
:title="item.name">
|
||||
</button>
|
||||
<button @click.stop="onPersonalityMounted(item)">
|
||||
|
||||
<span
|
||||
class="hidden group-hover:block top-0 left-7 absolute active:scale-90 bg-bg-light dark:bg-bg-dark rounded-full border-2 border-transparent"
|
||||
title="Unmount personality">
|
||||
<!-- UNMOUNT BUTTON -->
|
||||
<svg aria-hidden="true" class="w-4 h-4 text-red-600 hover:text-red-500 " fill="currentColor"
|
||||
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd"
|
||||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
<div class="w-fit select-none">
|
||||
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex -space-x-4 " v-if="mountedPersArr.length > 1">
|
||||
|
||||
|
||||
<img :src="bUrl + mountedPers.avatar" @error="personalityImgPlacehodler"
|
||||
class="w-8 h-8 rounded-full object-fill text-red-700 border-2 active:scale-90 group-hover:border-secondary border-secondary"
|
||||
:title="mountedPers.name" >
|
||||
|
||||
<div class="flex items-center justify-center w-8 h-8 cursor-pointer text-xs font-medium text-white bg-gray-700 border-2 border-white rounded-full hover:bg-gray-600 dark:border-gray-800"
|
||||
@click.stop="toggleShowPersList" title="Click to show more">+{{ mountedPersArr.length - 1 }}</div>
|
||||
</div>
|
||||
<div class="flex -space-x-4 " v-if="mountedPersArr.length == 1">
|
||||
<img :src="bUrl + mountedPers.avatar" @error="personalityImgPlacehodler"
|
||||
class="w-8 h-8 rounded-full object-fill text-red-700 border-2 active:scale-90 group-hover:border-secondary cursor-pointer border-secondary"
|
||||
:title="mountedPers.name" @click.stop="toggleShowPersList" >
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -40,12 +27,16 @@
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import defaultPersonalityImgPlaceholder from "../assets/logo.svg"
|
||||
import { nextTick } from "vue";
|
||||
|
||||
const bUrl = import.meta.env.VITE_GPT4ALL_API_BASEURL
|
||||
axios.defaults.baseURL = import.meta.env.VITE_GPT4ALL_API_BASEURL
|
||||
export default {
|
||||
name: 'MountedPersonalities',
|
||||
setup() {
|
||||
props: {
|
||||
onShowPersList: Function,
|
||||
},
|
||||
data() {
|
||||
|
||||
|
||||
return {
|
||||
@ -54,7 +45,9 @@ export default {
|
||||
personalities: [],
|
||||
bUrl: bUrl,
|
||||
isMounted: false,
|
||||
isLoading:false
|
||||
mountedPers: {},
|
||||
show: false
|
||||
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
@ -68,17 +61,21 @@ export default {
|
||||
|
||||
},
|
||||
methods: {
|
||||
toggleShowPersList() {
|
||||
this.show = !this.show
|
||||
this.onShowPersList(this)
|
||||
},
|
||||
async constructor() {
|
||||
|
||||
this.configFile = await this.api_get_req("get_config")
|
||||
this.getPersonalitiesArr()
|
||||
let personality_path_infos = await this.api_get_req("get_current_personality_path_infos")
|
||||
this.configFile.personality_language = personality_path_infos["personality_language"]
|
||||
this.configFile.personality_category = personality_path_infos["personality_category"]
|
||||
this.configFile.personality_folder = personality_path_infos["personality_name"]
|
||||
|
||||
await this.getPersonalitiesArr().then(() => {
|
||||
this.getMountedPersonalities()
|
||||
this.$forceUpdate()
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
async api_get_req(endpoint) {
|
||||
try {
|
||||
@ -97,7 +94,7 @@ export default {
|
||||
|
||||
},
|
||||
async getPersonalitiesArr() {
|
||||
this.isLoading = true
|
||||
|
||||
this.personalities = []
|
||||
const dictionary = await this.api_get_req("get_all_personalities")
|
||||
const config = await this.api_get_req("get_config")
|
||||
@ -140,10 +137,13 @@ export default {
|
||||
}
|
||||
|
||||
this.personalities.sort((a, b) => a.name.localeCompare(b.name))
|
||||
this.personalitiesFiltered = this.personalities.filter((item) => item.category === this.configFile.personality_category && item.language === this.configFile.personality_language)
|
||||
this.personalitiesFiltered.sort()
|
||||
|
||||
this.isLoading = false
|
||||
|
||||
|
||||
this.getMountedPersonalities()
|
||||
nextTick(()=>{
|
||||
|
||||
})
|
||||
|
||||
},
|
||||
personalityImgPlacehodler(event) {
|
||||
@ -168,14 +168,14 @@ export default {
|
||||
|
||||
}
|
||||
|
||||
this.isLoading = true
|
||||
|
||||
},
|
||||
async onPersonalitySelected(pers) {
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
if (this.isLoading) {
|
||||
this.$refs.toast.showToast("Loading... please wait", 4, false)
|
||||
}
|
||||
this.isLoading = true
|
||||
|
||||
console.log('ppa', pers)
|
||||
if (pers) {
|
||||
|
||||
@ -204,7 +204,7 @@ export default {
|
||||
}
|
||||
|
||||
|
||||
this.isLoading = false
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
@ -241,9 +241,9 @@ export default {
|
||||
|
||||
|
||||
try {
|
||||
this.isLoading = true
|
||||
|
||||
const res = await axios.post('/unmount_personality', obj);
|
||||
this.isLoading = false
|
||||
|
||||
|
||||
if (res) {
|
||||
return res.data
|
||||
@ -283,7 +283,7 @@ export default {
|
||||
|
||||
},
|
||||
async mountPersonality(pers) {
|
||||
this.isLoading = true
|
||||
|
||||
console.log('mount pers', pers)
|
||||
if (!pers) { return }
|
||||
|
||||
@ -310,11 +310,11 @@ export default {
|
||||
pers.isMounted = false
|
||||
this.$refs.toast.showToast("Could not mount personality\nError: " + res.error, 4, false)
|
||||
}
|
||||
this.isLoading = false
|
||||
|
||||
|
||||
},
|
||||
async unmountPersonality(pers) {
|
||||
this.isLoading = true
|
||||
|
||||
if (!pers) { return }
|
||||
|
||||
const res = await this.unmount_personality(pers.personality || pers)
|
||||
@ -359,7 +359,7 @@ export default {
|
||||
this.$refs.toast.showToast("Could not unmount personality\nError: " + res.error, 4, false)
|
||||
}
|
||||
|
||||
this.isLoading = false
|
||||
|
||||
},
|
||||
getMountedPersonalities() {
|
||||
|
||||
@ -382,7 +382,9 @@ export default {
|
||||
this.mountedPersArr = mountedPersArr
|
||||
//this.mountedPersArr = mountedPersArr
|
||||
console.log('getMountedPersonalities', mountedPersArr)
|
||||
console.log('fig', this.configFile.personality_category)
|
||||
console.log('fig', this)
|
||||
|
||||
this.mountedPers = this.personalities[this.personalities.findIndex(item => item.full_path == this.configFile.personalities[this.configFile.active_personality_id])]
|
||||
|
||||
},
|
||||
}
|
||||
|
||||
473
web/src/components/MountedPersonalitiesList.vue
Normal file
473
web/src/components/MountedPersonalitiesList.vue
Normal file
@ -0,0 +1,473 @@
|
||||
<template>
|
||||
<!-- LIST OF MOUNTED PERSONALITIES -->
|
||||
<div
|
||||
class="text-left overflow-visible text-base font-semibold cursor-pointer select-none items-center flex flex-row overflow-x-auto -my-2 pr-2 scrollbar-thin scrollbar-track-bg-light scrollbar-thumb-bg-light-tone hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark dark:scrollbar-thumb-bg-dark-tone dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary">
|
||||
<!-- LIST -->
|
||||
<div v-if="mountedPersArr.length > 0" class="m-2">
|
||||
<label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
Mounted Personalities: ({{ mountedPersArr.length }})
|
||||
</label>
|
||||
<div class="overflow-y-auto no-scrollbar p-2 pb-0 grid lg:grid-cols-1 md:grid-cols-1 gap-4 max-h-96">
|
||||
<TransitionGroup name="bounce">
|
||||
<personality-entry ref="personalitiesZoo" v-for="(pers, index) in mountedPersArr"
|
||||
:key="'index-' + index + '-' + pers.name" :personality="pers" :full_path="pers.full_path"
|
||||
:selected="configFile.personalities[configFile.active_personality_id] === pers.full_path"
|
||||
:on-selected="onPersonalitySelected" :on-mounted="onPersonalityMounted"
|
||||
:on-settings="onSettingsPersonality" />
|
||||
</TransitionGroup>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<Toast ref="toast">
|
||||
</Toast>
|
||||
<UniversalForm ref="universalForm" class="z-20" />
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.bounce-enter-active {
|
||||
animation: bounce-in 0.5s;
|
||||
}
|
||||
|
||||
.bounce-leave-active {
|
||||
animation: bounce-in 0.5s reverse;
|
||||
}
|
||||
|
||||
@keyframes bounce-in {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.25);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script >
|
||||
import defaultPersonalityImgPlaceholder from "../assets/logo.svg"
|
||||
import PersonalityEntry from './PersonalityEntry.vue'
|
||||
import Toast from './Toast.vue'
|
||||
import UniversalForm from './UniversalForm.vue';
|
||||
|
||||
|
||||
import axios from "axios";
|
||||
|
||||
const bUrl = import.meta.env.VITE_GPT4ALL_API_BASEURL
|
||||
axios.defaults.baseURL = import.meta.env.VITE_GPT4ALL_API_BASEURL
|
||||
export default {
|
||||
props: {
|
||||
onMountUnmount: Function
|
||||
|
||||
|
||||
},
|
||||
components: {
|
||||
PersonalityEntry,
|
||||
Toast,
|
||||
UniversalForm,
|
||||
},
|
||||
name: 'MountedPersonalitiesList',
|
||||
data() {
|
||||
|
||||
|
||||
return {
|
||||
configFile: {},
|
||||
mountedPersArr: [],
|
||||
personalities: [],
|
||||
bUrl: bUrl,
|
||||
isMounted: false,
|
||||
isLoading: false
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
await this.constructor()
|
||||
this.isMounted = true
|
||||
},
|
||||
async activated() {
|
||||
if (this.isMounted) {
|
||||
await this.constructor()
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
toggleMountUnmount() {
|
||||
console.log('moununmoun pers list')
|
||||
this.onMountUnmount(this)
|
||||
},
|
||||
async constructor() {
|
||||
|
||||
this.configFile = await this.api_get_req("get_config")
|
||||
this.getPersonalitiesArr()
|
||||
let personality_path_infos = await this.api_get_req("get_current_personality_path_infos")
|
||||
this.configFile.personality_language = personality_path_infos["personality_language"]
|
||||
this.configFile.personality_category = personality_path_infos["personality_category"]
|
||||
this.configFile.personality_folder = personality_path_infos["personality_name"]
|
||||
|
||||
|
||||
},
|
||||
async api_get_req(endpoint) {
|
||||
try {
|
||||
const res = await axios.get("/" + endpoint);
|
||||
|
||||
if (res) {
|
||||
|
||||
return res.data
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.message, 'api_get_req - mountedPersonalities')
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
async getPersonalitiesArr() {
|
||||
|
||||
this.personalities = []
|
||||
const dictionary = await this.api_get_req("get_all_personalities")
|
||||
const config = await this.api_get_req("get_config")
|
||||
//this.configFile=config
|
||||
//console.log('asdas',config)
|
||||
// console.log("all_personalities")
|
||||
// console.log(dictionary)
|
||||
const langkeys = Object.keys(dictionary); // returns languages folder names
|
||||
for (let i = 0; i < langkeys.length; i++) {
|
||||
const langkey = langkeys[i];
|
||||
const catdictionary = dictionary[langkey];
|
||||
const catkeys = Object.keys(catdictionary); // returns categories
|
||||
|
||||
for (let j = 0; j < catkeys.length; j++) {
|
||||
const catkey = catkeys[j];
|
||||
const personalitiesArray = catdictionary[catkey];
|
||||
const modPersArr = personalitiesArray.map((item) => {
|
||||
|
||||
const isMounted = config.personalities.includes(langkey + '/' + catkey + '/' + item.folder)
|
||||
// if (isMounted) {
|
||||
// console.log(item)
|
||||
// }
|
||||
let newItem = {}
|
||||
newItem = item
|
||||
newItem.category = catkey // add new props to items
|
||||
newItem.language = langkey // add new props to items
|
||||
newItem.full_path = langkey + '/' + catkey + '/' + item.folder // add new props to items
|
||||
newItem.isMounted = isMounted // add new props to items
|
||||
return newItem
|
||||
})
|
||||
|
||||
|
||||
if (this.personalities.length == 0) {
|
||||
this.personalities = modPersArr
|
||||
} else {
|
||||
this.personalities = this.personalities.concat(modPersArr)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.personalities.sort((a, b) => a.name.localeCompare(b.name))
|
||||
// this.personalitiesFiltered = this.personalities.filter((item) => item.category === this.configFile.personality_category && item.language === this.configFile.personality_language)
|
||||
// this.personalitiesFiltered.sort()
|
||||
|
||||
|
||||
|
||||
this.getMountedPersonalities()
|
||||
|
||||
|
||||
},
|
||||
personalityImgPlacehodler(event) {
|
||||
event.target.src = defaultPersonalityImgPlaceholder
|
||||
},
|
||||
onPersonalityMounted(persItem) {
|
||||
|
||||
if (this.configFile.personalities.includes(persItem.full_path)) {
|
||||
//this.$refs.toast.showToast("Personality already mounted", 4, false)
|
||||
//return
|
||||
//persItem.ismounted = false
|
||||
if (this.configFile.personalities.length == 1) {
|
||||
this.$refs.toast.showToast("Can't unmount last personality", 4, false)
|
||||
|
||||
} else {
|
||||
this.unmountPersonality(persItem)
|
||||
|
||||
}
|
||||
} else {
|
||||
//persItem.ismounted = true
|
||||
this.mountPersonality(persItem)
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
async onPersonalitySelected(pers) {
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
|
||||
console.log('ppa', pers)
|
||||
if (pers) {
|
||||
|
||||
if (pers.selected) {
|
||||
this.$refs.toast.showToast("Personality already selected", 4, true)
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
if (pers.isMounted) {
|
||||
|
||||
const res = await this.select_personality(pers)
|
||||
if (res) {
|
||||
if (res.status) {
|
||||
await this.constructor()
|
||||
|
||||
this.$refs.toast.showToast("Selected personality:\n" + pers.name, 4, true)
|
||||
console.log('ssss', this.configFile)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
this.onPersonalityMounted(pers)
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
onSettingsPersonality(persEntry) {
|
||||
try {
|
||||
|
||||
axios.get('/get_active_personality_settings').then(res => {
|
||||
|
||||
if (res) {
|
||||
|
||||
console.log('pers sett', res)
|
||||
if (res.data && Object.keys(res.data).length > 0) {
|
||||
|
||||
this.$refs.universalForm.showForm(res.data, "Personality settings - " + persEntry.personality.name, "Save changes", "Cancel").then(res => {
|
||||
|
||||
// send new data
|
||||
try {
|
||||
axios.post('/set_active_personality_settings',
|
||||
res).then(response => {
|
||||
|
||||
if (response && response.data) {
|
||||
console.log('personality set with new settings', response.data)
|
||||
this.$refs.toast.showToast("Personality settings updated successfully!", 4, true)
|
||||
|
||||
} else {
|
||||
this.$refs.toast.showToast("Did not get Personality settings responses.\n" + response, 4, false)
|
||||
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
} catch (error) {
|
||||
this.$refs.toast.showToast("Did not get Personality settings responses.\n Endpoint error: " + error.message, 4, false)
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
} else {
|
||||
this.$refs.toast.showToast("Personality has no settings", 4, false)
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
} catch (error) {
|
||||
|
||||
this.$refs.toast.showToast("Could not open personality settings. Endpoint error: " + error.message, 4, false)
|
||||
}
|
||||
|
||||
},
|
||||
async mount_personality(pers) {
|
||||
if (!pers) { return { 'status': false, 'error': 'no personality - mount_personality' } }
|
||||
|
||||
try {
|
||||
const obj = {
|
||||
language: pers.language,
|
||||
category: pers.category,
|
||||
folder: pers.folder
|
||||
}
|
||||
const res = await axios.post('/mount_personality', obj);
|
||||
|
||||
if (res) {
|
||||
|
||||
return res.data
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.message, 'mount_personality - settings')
|
||||
return
|
||||
}
|
||||
|
||||
},
|
||||
async unmount_personality(pers) {
|
||||
if (!pers) { return { 'status': false, 'error': 'no personality - unmount_personality' } }
|
||||
|
||||
const obj = {
|
||||
language: pers.language,
|
||||
category: pers.category,
|
||||
folder: pers.folder
|
||||
}
|
||||
|
||||
|
||||
try {
|
||||
|
||||
const res = await axios.post('/unmount_personality', obj);
|
||||
|
||||
|
||||
if (res) {
|
||||
|
||||
return res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.message, 'unmount_personality - settings')
|
||||
return
|
||||
}
|
||||
|
||||
},
|
||||
async select_personality(pers) {
|
||||
if (!pers) { return { 'status': false, 'error': 'no personality - select_personality' } }
|
||||
console.log('select pers', pers)
|
||||
const id = this.configFile.personalities.findIndex(item => item === pers.full_path)
|
||||
|
||||
const obj = {
|
||||
id: id
|
||||
}
|
||||
|
||||
|
||||
try {
|
||||
const res = await axios.post('/select_personality', obj);
|
||||
|
||||
if (res) {
|
||||
this.toggleMountUnmount()
|
||||
this.configFile = await this.api_get_req("get_config")
|
||||
let personality_path_infos = await this.api_get_req("get_current_personality_path_infos")
|
||||
this.configFile.personality_language = personality_path_infos["personality_language"]
|
||||
this.configFile.personality_category = personality_path_infos["personality_category"]
|
||||
this.configFile.personality_folder = personality_path_infos["personality_name"]
|
||||
|
||||
return res.data
|
||||
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error, 'select_personality - settings')
|
||||
return
|
||||
}
|
||||
|
||||
},
|
||||
async mountPersonality(pers) {
|
||||
|
||||
console.log('mount pers', pers)
|
||||
if (!pers) { return }
|
||||
|
||||
if (this.configFile.personalities.includes(pers.personality.full_path)) {
|
||||
this.$refs.toast.showToast("Personality already mounted", 4, false)
|
||||
return
|
||||
}
|
||||
|
||||
const res = await this.mount_personality(pers.personality)
|
||||
console.log('mount_personality res', res)
|
||||
|
||||
if (res.status) {
|
||||
this.configFile.personalities = res.personalities
|
||||
this.$refs.toast.showToast("Personality mounted", 4, true)
|
||||
pers.isMounted = true
|
||||
this.toggleMountUnmount()
|
||||
const res2 = await this.select_personality(pers.personality)
|
||||
if (res2.status) {
|
||||
this.$refs.toast.showToast("Selected personality:\n" + pers.personality.name, 4, true)
|
||||
|
||||
}
|
||||
this.getMountedPersonalities()
|
||||
} else {
|
||||
pers.isMounted = false
|
||||
this.$refs.toast.showToast("Could not mount personality\nError: " + res.error, 4, false)
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
async unmountPersonality(pers) {
|
||||
|
||||
if (!pers) { return }
|
||||
|
||||
const res = await this.unmount_personality(pers.personality || pers)
|
||||
|
||||
|
||||
if (res.status) {
|
||||
this.toggleMountUnmount()
|
||||
console.log('unmount response', res)
|
||||
this.configFile.active_personality_id = res.active_personality_id
|
||||
this.configFile.personalities = res.personalities
|
||||
this.$refs.toast.showToast("Personality unmounted", 4, true)
|
||||
|
||||
const activePersPath = this.configFile.personalities[this.configFile.active_personality_id]
|
||||
|
||||
console.log()
|
||||
const persId = this.personalities.findIndex(item => item.full_path == activePersPath)
|
||||
//const persFilteredId = this.personalitiesFiltered.findIndex(item => item.full_path == pers.full_path)
|
||||
//const persIdZoo = this.$refs.personalitiesZoo.findIndex(item => item.full_path == pers.full_path)
|
||||
console.log('ppp', this.personalities[persId])
|
||||
const activePers = this.personalities[persId]
|
||||
activePers.isMounted = false
|
||||
activePers.selected = true
|
||||
//this.$refs.personalitiesZoo[persIdZoo].isMounted = false
|
||||
|
||||
|
||||
|
||||
//pers.isMounted = false
|
||||
this.getMountedPersonalities()
|
||||
// Select some other personality
|
||||
//const lastPers = this.mountedPersArr[this.mountedPersArr.length - 1]
|
||||
|
||||
//console.log(lastPers, this.mountedPersArr.length)
|
||||
// const res2 = await this.select_personality(lastPers.personality)
|
||||
const res2 = await this.select_personality(activePers)
|
||||
if (res2.status) {
|
||||
this.$refs.toast.showToast("Selected personality:\n" + activePers.name, 4, true)
|
||||
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
this.$refs.toast.showToast("Could not unmount personality\nError: " + res.error, 4, false)
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
getMountedPersonalities() {
|
||||
|
||||
let mountedPersArr = []
|
||||
console.log(this.configFile.personalities.length)
|
||||
// console.log('perrs listo',this.personalities)
|
||||
for (let i = 0; i < this.configFile.personalities.length; i++) {
|
||||
const full_path_item = this.configFile.personalities[i]
|
||||
const index = this.personalities.findIndex(item => item.full_path == full_path_item)
|
||||
|
||||
const pers = this.personalities[index]
|
||||
if (pers) {
|
||||
mountedPersArr.push(pers)
|
||||
}
|
||||
else {
|
||||
mountedPersArr.push(this.personalities[this.personalities.findIndex(item => item.full_path == "english/generic/lollms")])
|
||||
}
|
||||
}
|
||||
this.mountedPersArr = []
|
||||
this.mountedPersArr = mountedPersArr
|
||||
//this.mountedPersArr = mountedPersArr
|
||||
console.log('getMountedPersonalities', mountedPersArr)
|
||||
console.log('fig', this.configFile)
|
||||
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div
|
||||
class=" items-start p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer active:scale-95 duration-75 select-none"
|
||||
@click.stop="toggleSelected" :class="selected ? 'border-primary-light' : 'border-transparent'"
|
||||
class=" min-w-96 items-start p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer active:scale-95 duration-75 select-none"
|
||||
@click.stop="toggleSelected" :class="selected_computed ? 'border-primary-light' : 'border-transparent'"
|
||||
:title="!personality.installed ? 'Not installed' : ''">
|
||||
|
||||
<div :class="!personality.installed ? 'opacity-50' : ''">
|
||||
@ -24,7 +24,7 @@
|
||||
<i data-feather="slash" class="w-5"></i>
|
||||
<span class="sr-only">Not installed</span>
|
||||
</button>
|
||||
<button v-if="selected" type="button" title="Settings"
|
||||
<button v-if="selected_computed" type="button" title="Settings"
|
||||
class="hover:text-secondary duration-75 active:scale-90 font-medium rounded-lg text-sm p-2 text-center inline-flex items-center "
|
||||
@click.stop="toggleSettings">
|
||||
<i data-feather="sliders" class="w-5"></i>
|
||||
@ -112,7 +112,9 @@ export default {
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
|
||||
selected_computed(){
|
||||
return this.selected
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getImgUrl() {
|
||||
|
||||
@ -12,7 +12,7 @@ const store = createStore({
|
||||
state () {
|
||||
return {
|
||||
// count: 0,
|
||||
mountedPersonalities: {},
|
||||
mountedPersonalities: [],
|
||||
settingsChanged:false
|
||||
}
|
||||
},
|
||||
|
||||
@ -189,7 +189,7 @@
|
||||
|
||||
</div>
|
||||
<div class=" bottom-0 container flex flex-row items-center justify-center " v-if="currentDiscussion.id">
|
||||
<ChatBox ref="chatBox" @messageSentEvent="sendMsg" :loading="isGenerating" @stopGenerating="stopGenerating">
|
||||
<ChatBox ref="chatBox" @messageSentEvent="sendMsg" :loading="isGenerating" :discussionList="list" @stopGenerating="stopGenerating">
|
||||
</ChatBox>
|
||||
</div>
|
||||
<!-- CAN ADD FOOTER PANEL HERE -->
|
||||
@ -625,7 +625,7 @@ export default {
|
||||
// "message":message,#markdown.markdown(message),
|
||||
// "user_message_id": self.current_user_message_id,
|
||||
// "ai_message_id": self.current_ai_message_id,
|
||||
console.log(msgObj);
|
||||
console.log('create bot', msgObj);
|
||||
if (msgObj["status"] == "generation_started") {
|
||||
this.updateLastUserMsg(msgObj)
|
||||
// Create response message
|
||||
@ -706,7 +706,7 @@ export default {
|
||||
},
|
||||
streamMessageContent(msgObj) {
|
||||
// Streams response message content from binding
|
||||
//console.log('stream msg',msgObj)
|
||||
console.log('stream msg',msgObj)
|
||||
const parent = msgObj.user_message_id
|
||||
const discussion_id = msgObj.discussion_id
|
||||
this.setDiscussionLoading(discussion_id, true);
|
||||
|
||||
@ -1291,7 +1291,7 @@ export default {
|
||||
if (pers.isMounted && this.configFile.personalities.includes(pers.personality.full_path)) {
|
||||
|
||||
const res = await this.select_personality(pers)
|
||||
|
||||
console.log('pers is mounted',res)
|
||||
if (res && res.status && res.active_personality_id > -1) {
|
||||
this.$refs.toast.showToast("Selected personality:\n" + pers.name, 4, true)
|
||||
|
||||
@ -1301,6 +1301,7 @@ export default {
|
||||
this.isLoading = false
|
||||
|
||||
} else {
|
||||
console.log('mounting pers')
|
||||
this.onPersonalityMounted(pers)
|
||||
|
||||
}
|
||||
@ -1361,7 +1362,7 @@ export default {
|
||||
onCancelInstall() {
|
||||
|
||||
const modelEntry = this.addModel
|
||||
|
||||
console.log('cancel install', modelEntry)
|
||||
// const keys = Object.keys(this.addModel)
|
||||
// if (keys.includes('url')) {
|
||||
// return
|
||||
@ -1383,12 +1384,14 @@ export default {
|
||||
let path = model_object.path;
|
||||
this.showProgress = true;
|
||||
this.progress = 0;
|
||||
console.log("installing...");
|
||||
|
||||
this.addModel={ model_name: model_object.model.title, binding_folder: this.configFile.binding_name, model_url: model_object.path }
|
||||
console.log("installing...", this.addModel);
|
||||
|
||||
// Use an arrow function for progressListener
|
||||
const progressListener = (response) => {
|
||||
console.log("received something");
|
||||
if (response.status && response.progress <= 100) {
|
||||
this.addModel=response
|
||||
console.log(`Progress`, response);
|
||||
model_object.progress = response.progress
|
||||
model_object.speed = response.speed
|
||||
|
||||
Loading…
Reference in New Issue
Block a user