ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2025-02-22 01:46:37 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #219 from andzejsp/small-fixes

Browse Source 
Small fixes
This commit is contained in:
Saifeddine ALOUI 2023-05-24 17:10:06 +02:00 committed by GitHub
commit 12663daca5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 158 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/package-lock.json generated
View File

@ -8,7 +8,6 @@
"name": "gpt4all-ui-vue", "name": "gpt4all-ui-vue",
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"@tailwindcss/line-clamp": "^0.4.4",
"axios": "^1.3.6", "axios": "^1.3.6",
"feather-icons": "^4.29.0", "feather-icons": "^4.29.0",
"flowbite": "^1.6.5", "flowbite": "^1.6.5",
@ -599,14 +598,6 @@
"resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz", "resolved": "https://registry.npmjs.org/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz",
"integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==" "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg=="
}, },
"node_modules/@tailwindcss/line-clamp": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/line-clamp/-/line-clamp-0.4.4.tgz",
"integrity": "sha512-5U6SY5z8N42VtrCrKlsTAA35gy2VSyYtHWCsg1H87NU1SXnEfekTVlrga9fzUDrrHcGi2Lb5KenUWb4lRQT5/g==",
"peerDependencies": {
"tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
}
},
"node_modules/@types/web-bluetooth": { "node_modules/@types/web-bluetooth": {
"version": "0.0.15", "version": "0.0.15",
"resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz", "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.15.tgz",

1
web/package.json
View File

@ -10,7 +10,6 @@
"format": "prettier --write src/" "format": "prettier --write src/"
}, },
"dependencies": { "dependencies": {
"@tailwindcss/line-clamp": "^0.4.4",
"axios": "^1.3.6", "axios": "^1.3.6",
"feather-icons": "^4.29.0", "feather-icons": "^4.29.0",
"flowbite": "^1.6.5", "flowbite": "^1.6.5",

111
web/src/components/ModelEntry.vue
View File

@ -1,62 +1,69 @@
<template> <template>
<div class="flex items-center p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer" @click.stop="toggleSelected" :class="selected?' border-primary-light':'border-transparent'"> <div class="flex items-center p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer"
@click.stop="toggleSelected" :class="selected ? ' border-primary-light' : 'border-transparent'">
<div class="flex-shrink-0"> <div class="flex-shrink-0">
<i :class="`fas ${icon} text-xl`"></i> <i :class="`fas ${icon} text-xl`"></i>
</div> </div>
<div class="flex-1"> <div v-if="model.isCustomModel">
<h3 class="font-bold font-large text-lg"> <h3 class="font-bold font-large text-lg">
{{ title }} {{ title }}
</h3> </h3>
<div class="flex flex-shrink-0">
<b>Manual download:&nbsp;</b> </div>
<a :href="path" @click.stop <div class="flex-1" v-if="!model.isCustomModel">
class="flex hover:text-secondary duration-75 active:scale-90" <h3 class="font-bold font-large text-lg">
title="Download this manually (faster) and put it in the models/<your backend> folder then refresh"> {{ title }}
<i data-feather="link" class="w-5 p-1"></i> </h3>
{{ title }}
</a> <div class="flex flex-shrink-0">
</div> <b>Manual download:&nbsp;</b>
<div class="flex flex-shrink-0"> <a :href="path" @click.stop class="flex hover:text-secondary duration-75 active:scale-90"
<b>License:&nbsp;</b> title="Download this manually (faster) and put it in the models/<your backend> folder then refresh">
<i data-feather="link" class="w-5 p-1"></i>
{{ title }}
</a>
</div>
<div class="flex flex-shrink-0">
<b>License:&nbsp;</b>
{{ license }} {{ license }}
</div>
<div class="flex flex-shrink-0">
<b>Owner:&nbsp;</b>
<a :href="owner_link" target="_blank" @click.stop class="flex hover:text-secondary duration-75 active:scale-90"
title="Owner's profile">
<i data-feather="link" class="w-5 p-1"></i>
{{ owner }}
</a>
</div>
<b>Description:&nbsp;</b><br>
<p class="opacity-80">{{ description }}</p>
</div> </div>
<div class="flex flex-shrink-0"> <div class="flex-shrink-0" v-if="!model.isCustomModel">
<b>Owner:&nbsp;</b> <button class="px-4 py-2 rounded-md text-white font-bold transition-colors duration-300"
<a :href="owner_link" target="_blank" @click.stop :class="[isInstalled ? 'bg-red-500 hover:bg-red-600' : 'bg-green-500 hover:bg-green-600']"
class="flex hover:text-secondary duration-75 active:scale-90" :disabled="installing || uninstalling" @click.stop="toggleInstall">
title="Owner's profile"> <template v-if="installing">
<i data-feather="link" class="w-5 p-1"></i> <div class="flex items-center space-x-2">
{{ owner }} <div class="h-2 w-20 bg-gray-300 rounded">
</a> <div :style="{ width: progress + '%' }" class="h-full bg-red-500 rounded"></div>
</div> </div>
<b>Description:&nbsp;</b><br> <span>Installing...{{ Math.floor(progress) }}%</span>
<p class="opacity-80">{{ description }}</p>
</div>
<div class="flex-shrink-0">
<button class="px-4 py-2 rounded-md text-white font-bold transition-colors duration-300"
:class="[isInstalled ? 'bg-red-500 hover:bg-red-600' : 'bg-green-500 hover:bg-green-600']"
:disabled="installing || uninstalling" @click.stop="toggleInstall">
<template v-if="installing">
<div class="flex items-center space-x-2">
<div class="h-2 w-20 bg-gray-300 rounded">
<div :style="{ width: progress + '%' }" class="h-full bg-red-500 rounded"></div>
</div> </div>
<span>Installing...{{ Math.floor(progress) }}%</span> </template>
</div> <template v-else-if="uninstalling">
</template> <div class="flex items-center space-x-2">
<template v-else-if="uninstalling"> <div class="h-2 w-20 bg-gray-300 rounded">
<div class="flex items-center space-x-2"> <div :style="{ width: progress + '%' }" class="h-full bg-green-500"></div>
<div class="h-2 w-20 bg-gray-300 rounded"> </div>
<div :style="{ width: progress + '%' }" class="h-full bg-green-500"></div> <span>Uninstalling...</span>
</div> </div>
<span>Uninstalling...</span> </template>
</div> <template v-else>
</template> {{ isInstalled ? 'Uninstall' : 'Install' }}
<template v-else> </template>
{{ isInstalled ? 'Uninstall' : 'Install' }} </button>
</template> </div>
</button>
</div>
</div> </div>
</template> </template>
@ -76,13 +83,15 @@ export default {
onInstall: Function, onInstall: Function,
onUninstall: Function, onUninstall: Function,
onSelected: Function, onSelected: Function,
selected: Boolean selected: Boolean,
model: Object
}, },
data() { data() {
return { return {
progress: 0, progress: 0,
installing: false, installing: false,
uninstalling: false uninstalling: false,
failedToLoad:false
}; };
}, },
mounted() { mounted() {
@ -104,7 +113,7 @@ export default {
} }
}, },
toggleSelected(){ toggleSelected() {
this.onSelected(this) this.onSelected(this)
}, },
handleSelection() { handleSelection() {

52
web/src/components/PersonalityEntry.vue
View File

@ -1,32 +1,32 @@
<template> <template>
<div class=" items-start p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer" <div class=" items-start p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer"
@click.stop="toggleSelected" :class="selected ? ' border-primary-light' : 'border-transparent'"> @click.stop="toggleSelected" :class="selected ? ' border-primary-light' : 'border-transparent'">
<h3 class="font-bold font-large text-lg">
{{ personality.name }}
</h3>
<div class="flex flex-row items-center flex-shrink-0 gap-3"> <div class="flex flex-row items-center flex-shrink-0 gap-3">
<img :src="getImgUrl()" class="w-14 h-14 rounded-full object-fill text-red-700"> <img :src="getImgUrl()" @error="defaultImg($event)" class="w-10 h-10 rounded-full object-fill text-red-700">
<h3 class="font-bold font-large text-lg line-clamp-3">
{{ personality.name }}
<div class=""> </h3>
<div class="">
<b>Author:&nbsp;</b>
{{ personality.author }}
</div>
<div class="">
<b>Language:&nbsp;</b>
{{ personality.language }}
</div>
<div class="">
<b>Category:&nbsp;</b>
{{ personality.category }}
</div>
</div> </div>
</div>
<div class=""> <div class="">
<div class="">
<div class="">
<b>Author:&nbsp;</b>
{{ personality.author }}
</div>
<div class="">
<b>Language:&nbsp;</b>
{{ personality.language }}
</div>
<div class="">
<b>Category:&nbsp;</b>
{{ personality.category }}
</div>
</div>
<b>Description:&nbsp;</b><br> <b>Description:&nbsp;</b><br>
<p class="opacity-80 line-clamp-3" :title="personality.description">{{ personality.description }}</p> <p class="opacity-80 line-clamp-3" :title="personality.description">{{ personality.description }}</p>
@ -63,12 +63,10 @@ export default {
}, },
methods: { methods: {
getImgUrl() { getImgUrl() {
return bUrl + this.personality.avatar
if (this.personality.avatar) { },
return bUrl+this.personality.avatar defaultImg(event) {
event.target.src = botImgPlaceholder
}
return botImgPlaceholder;
}, },
toggleSelected() { toggleSelected() {
this.onSelected(this) this.onSelected(this)

2
web/src/views/DiscussionsView.vue
View File

@ -343,7 +343,7 @@ export default {
try { try {
if (discussionIdArr.length > 0) { if (discussionIdArr.length > 0) {
const res = await axios.post('/export_multiple_discussions', { const res = await axios.post('/export_multiple_discussions', {
discussions: discussionIdArr discussion_ids: discussionIdArr
}) })
if (res) { if (res) {

142
web/src/views/SettingsView.vue
View File

@ -29,6 +29,7 @@
<i data-feather="list"></i> <i data-feather="list"></i>
</button> </button>
</div> </div>
<div class="flex gap-3 flex-1 items-center justify-end"> <div class="flex gap-3 flex-1 items-center justify-end">
@ -56,50 +57,15 @@
</svg> </svg>
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
<!-- <button @click="applyConfiguration" class="bg-primary text-white py-1 px-4 rounded">
Apply Configuration
<div v-if="isLoading" class="loader"></div> v-if="settingsChanged"
</button> -->
</div> </div>
</div> </div>
</div> </div>
<!-- BACKEND -->
<!-- DISABLED FOR NOW --> <div :class="isLoading ? 'pointer-events-none opacity-30':''">
<!-- <div
class="flex flex-col mb-2 p-3 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
<div class="flex flex-row "> <!-- MODELS ZOO -->
<button @click.stop="bec_collapsed = !bec_collapsed"
class="text-2xl hover:text-primary duration-75 p-2 -m-2 w-full text-left active:translate-y-1 flex items-center">
<i :data-feather="mzc_collapsed ? 'chevron-right' : 'chevron-down'" class="mr-2"></i>
<h3 class="text-lg font-semibold cursor-pointer select-none">
Backend Configuration</h3>
</button>
</div>
<div :class="{ 'hidden': bec_collapsed }" class="flex flex-col mb-2 p-2">
<div class="m-2">
<label for="backend" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Backend:
</label>
<select id="backend" @change="update_backend($event.target.value)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
<option v-for="item in backendsArr" :selected="item === configFile.backend">{{ item }}</option>
</select>
</div>
<div class="m-2">
<label for="model" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Model:
</label>
<select id="model" @change="update_model($event.target.value)"
@mouseup="update_model($event.target.value)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
<option v-for="item in modelsArr" :selected="item === configFile.model">{{ item }}</option>
</select>
</div>
</div>
</div> -->
<div <div
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg"> class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
<div class="flex flex-row p-3"> <div class="flex flex-row p-3">
@ -113,7 +79,7 @@
<div :class="{ 'hidden': mzc_collapsed }" class="flex flex-col mb-2 px-3 pb-0"> <div :class="{ 'hidden': mzc_collapsed }" class="flex flex-col mb-2 px-3 pb-0">
<div class="mx-2 mb-4"> <div class="mx-2 mb-4">
<label for="backend" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white"> <label for="backend" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Backend: Backend: ({{ backendsArr.length }})
</label> </label>
<select id="backend" @change="update_backend($event.target.value)" <select id="backend" @change="update_backend($event.target.value)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"> class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
@ -123,15 +89,15 @@
</div> </div>
<div v-if="models.length > 0" class="mb-2"> <div v-if="models.length > 0" class="mb-2">
<label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white"> <label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white">
Models: Models: ({{ models.length }})
</label> </label>
<div ref="modelZoo" class="overflow-y-auto no-scrollbar p-2 pb-0" <div ref="modelZoo" class="overflow-y-auto no-scrollbar p-2 pb-0 "
:class="mzl_collapsed ? '' : 'max-h-96'"> :class="mzl_collapsed ? '' : 'max-h-96'">
<model-entry v-for="(model, index) in models" :key="index" :title="model.title" :icon="model.icon" <model-entry v-for="(model, index) in models" :key="index" :title="model.title" :icon="model.icon"
:path="model.path" :owner="model.owner" :owner_link="model.owner_link" :license="model.license" :path="model.path" :owner="model.owner" :owner_link="model.owner_link" :license="model.license"
:description="model.description" :is-installed="model.isInstalled" :on-install="onInstall" :description="model.description" :is-installed="model.isInstalled" :on-install="onInstall"
:on-uninstall="onUninstall" :on-selected="onSelected" :on-uninstall="onUninstall" :on-selected="onSelected"
:selected="model.title === configFile.model" /> :selected="model.title === configFile.model" :model="model" />
</div> </div>
</div> </div>
<!-- EXPAND / COLLAPSE BUTTON --> <!-- EXPAND / COLLAPSE BUTTON -->
@ -162,7 +128,7 @@
<div :class="{ 'hidden': pc_collapsed }" class="flex flex-col mb-2 p-2"> <div :class="{ 'hidden': pc_collapsed }" class="flex flex-col mb-2 p-2">
<div class="m-2"> <div class="m-2">
<label for="persLang" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white"> <label for="persLang" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Personalities Languages: Personalities Languages: ({{ persLangArr.length }})
</label> </label>
<select id="persLang" @change="update_setting('personality_language', $event.target.value, refresh)" <select id="persLang" @change="update_setting('personality_language', $event.target.value, refresh)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"> class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
@ -175,7 +141,7 @@
</div> </div>
<div class="m-2"> <div class="m-2">
<label for="persCat" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white"> <label for="persCat" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Personalities Category: Personalities Category: ({{ persLangArr.length }})
</label> </label>
<select id="persCat" @change="update_setting('personality_category', $event.target.value, refresh)" <select id="persCat" @change="update_setting('personality_category', $event.target.value, refresh)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"> class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
@ -206,8 +172,11 @@
</div> </div>
</div> </div>
<!-- PERSONALITY ZOO -->
<div <div
class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg"> class="flex flex-col mb-2 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
<div class="flex flex-row p-3"> <div class="flex flex-row p-3">
<button @click.stop="pzc_collapsed = !pzc_collapsed" <button @click.stop="pzc_collapsed = !pzc_collapsed"
class="text-2xl hover:text-primary duration-75 p-2 -m-2 w-full text-left active:translate-y-1 flex items-center"> class="text-2xl hover:text-primary duration-75 p-2 -m-2 w-full text-left active:translate-y-1 flex items-center">
@ -217,11 +186,38 @@
</button> </button>
</div> </div>
<div :class="{ 'hidden': pzc_collapsed }" class="flex flex-col mb-2 px-3 pb-0"> <div :class="{ 'hidden': pzc_collapsed }" class="flex flex-col mb-2 px-3 pb-0">
<div class="mx-2 mb-4">
<label for="persLang" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Personalities Languages: ({{ persLangArr.length }})
</label>
<select id="persLang" @change="update_setting('personality_language', $event.target.value, refresh)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
<option v-for="item in persLangArr" :selected="item === configFile.personality_language">{{ item }}
</option>
</select>
</div>
<div class="mx-2 mb-4">
<label for="persCat" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
Personalities Category: ({{ persCatgArr.length }})
</label>
<select id="persCat" @change="update_setting('personality_category', $event.target.value, refresh)"
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
<option v-for="item in persCatgArr" :selected="item === configFile.personality_category">{{ item }}
</option>
</select>
</div>
<div v-if="personalities.length > 0" class="mb-2"> <div v-if="personalities.length > 0" class="mb-2">
<label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white"> <label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white">
Personalities: Personalities: ({{ personalities.length }})
</label> </label>
<div ref="personalitiesZoo" class="overflow-y-auto no-scrollbar p-2 pb-0 grid grid-cols-4 gap-4" <div ref="personalitiesZoo" class="overflow-y-auto no-scrollbar p-2 pb-0 grid lg:grid-cols-3 md:grid-cols-2 gap-4"
:class="pzl_collapsed ? '' : 'max-h-96'"> :class="pzl_collapsed ? '' : 'max-h-96'">
<personality-entry v-for="(pers, index) in personalities" :key="index" :personality="pers" /> <personality-entry v-for="(pers, index) in personalities" :key="index" :personality="pers" />
</div> </div>
@ -240,28 +236,7 @@
</div> </div>
</div> </div>
<!-- <div
class="flex flex-col mb-2 p-3 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
<div class="flex flex-row ">
<button @click.stop="pzc_collapsed = !pzc_collapsed"
class="text-2xl hover:text-primary duration-75 p-2 -m-2 w-full text-left active:translate-y-1 flex items-center">
<i :data-feather="mc_collapsed ? 'chevron-right' : 'chevron-down'" class="mr-2"></i>
<h3 class="text-lg font-semibold cursor-pointer select-none">
Personalities zoo
</h3>
</button>
</div>
<div :class="{ 'hidden': pzc_collapsed }" class="flex flex-col mb-2 p-2">
<div v-if="models.length > 0" class="my-2">
<label for="model" class="block ml-2 mb-2 text-sm font-medium text-gray-900 dark:text-white">
Install more models:
</label>
<div class="overflow-y-auto max-h-96 no-scrollbar p-2">
</div>
</div>
</div>
</div> -->
<!-- MODEL --> <!-- MODEL -->
<div <div
class="flex flex-col mb-2 p-3 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg"> class="flex flex-col mb-2 p-3 rounded-lg bg-bg-light-tone dark:bg-bg-dark-tone hover:bg-bg-light-tone-panel hover:dark:bg-bg-dark-tone-panel duration-150 shadow-lg">
@ -409,7 +384,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
@ -490,6 +465,31 @@ export default {
//console.log(`Models list recovered successfuly: ${JSON.stringify(response.data)}`) //console.log(`Models list recovered successfuly: ${JSON.stringify(response.data)}`)
console.log(" models",response.data.length) console.log(" models",response.data.length)
this.models = response.data; this.models = response.data;
this.fetchCustomModels()
})
.catch(error => {
console.log(error);
});
},
fetchCustomModels() {
console.log("Fetching Custom models")
axios.get('/list_models')
.then(response => {
// Returns array of model filenames which are = to title of models zoo entry
for (let i = 0; i < response.data.length; i++) {
const customModel = response.data[i]
const index = this.models.findIndex(x => x.title == customModel)
console.log("model-ccc", customModel, index)
if (index==-1){
let newModelEntry = {}
newModelEntry.title = customModel
newModelEntry.isCustomModel = true
newModelEntry.isInstalled = true
this.models.push(newModelEntry)
}
}
}) })
.catch(error => { .catch(error => {
console.log(error); console.log(error);

2
web/tailwind.config.js
View File

@ -35,7 +35,7 @@ module.exports = {
plugins: [ plugins: [
require('flowbite/plugin'), require('flowbite/plugin'),
require('tailwind-scrollbar'), require('tailwind-scrollbar'),
require('@tailwindcss/line-clamp')
] ]
} }