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

Merge pull request #174 from andzejsp/main

Browse Source 
Small fixes
This commit is contained in:
Saifeddine ALOUI 2023-05-11 09:03:54 +02:00 committed by GitHub
commit f6ece2a0f1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 86 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
web/dist/assets/default_user-17642e5a.svg → web/dist/assets/default_user-a2e0564e.svg vendored
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.5 KiB

After

Width:  |  Height:  |  Size: 7.5 KiB

1
web/dist/assets/index-71e7dde6.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

36
web/dist/assets/index-fe0dc431.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
web/dist/index.html vendored
View File

@ -6,8 +6,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GPT4All - WEBUI</title> <title>GPT4All - WEBUI</title>
<script type="module" crossorigin src="/assets/index-fd3ffd22.js"></script> <script type="module" crossorigin src="/assets/index-fd3ffd22.js"></script>
<link rel="stylesheet" href="/assets/index-de34f32f.css"> <link rel="stylesheet" href="/assets/index-de34f32f.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

39
web/src/components/MarkdownRenderer.vue
View File

@ -24,29 +24,23 @@ export default {
}, },
mounted() { mounted() {
const markdownIt = new MarkdownIt({ const markdownIt = new MarkdownIt({
html: false, // Enable HTML tags in source html: false,
xhtmlOut: true, // Use '/' to close single tags (<br />). xhtmlOut: true,
// This is only for full CommonMark compatibility. breaks: true,
breaks: true, // Convert '\n' in paragraphs into <br> linkify: true,
// langPrefix: 'language-', // CSS language prefix for fenced blocks. Can be
// useful for external highlighters.
linkify: true, // Autoconvert URL-like text to links
// Enable some language-neutral replacement + quotes beautification
// For the full list of replacements, see https://github.com/markdown-it/markdown-it/blob/master/lib/rules_core/replacements.js
typographer: true, typographer: true,
highlight: (str, lang) => { highlight: (str, lang) => {
if (lang && hljs.getLanguage(lang)) { if (lang && hljs.getLanguage(lang)) {
try { try {
return ( return (
'<pre class="hljs rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' + '<pre class="hljs p-4 overflow-x-auto rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' +
hljs.highlight(lang, str, true).value + hljs.highlight(lang, str, true).value +
'</code></pre>' '</code></pre>'
); );
} catch (__) { } } catch (__) { }
} }
return ( return (
'<pre class="hljs rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' + '<pre class="hljs p-4 overflow-x-auto rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' +
markdownIt.utils.escapeHtml(str) + markdownIt.utils.escapeHtml(str) +
'</code></pre>' '</code></pre>'
); );
@ -62,14 +56,14 @@ export default {
if (lang && hljs.getLanguage(lang)) { if (lang && hljs.getLanguage(lang)) {
try { try {
return ( return (
'<pre class="hljs rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' + '<pre class="hljs p-4 overflow-x-auto rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' +
hljs.highlight(lang, str, true).value + hljs.highlight(lang, str, true).value +
'</code></pre>' '</code></pre>'
); );
} catch (__) { } } catch (__) { }
} }
return ( return (
'<pre class="hljs rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' + '<pre class="hljs p-4 overflow-x-auto rounded-lg dark:bg-bg-dark-code-block bg-bg-light-code-block shadow-lg"><code>' +
markdownIt.utils.escapeHtml(str) + markdownIt.utils.escapeHtml(str) +
'</code></pre>' '</code></pre>'
); );
@ -82,20 +76,3 @@ export default {
}; };
</script> </script>
<style>
/* Add styles for code highlighting */
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
background: #f5f5f5;
}
.hljs code {
display: inline;
padding: 0;
border: none;
background: none;
}
</style>

27
web/src/components/Message.vue
View File

@ -13,9 +13,10 @@
</div> </div>
<div class="-mt-4 ml-10 mr-0 pt-1 px-2 "> <div class="-mt-4 ml-10 mr-0 pt-1 px-2 ">
<!-- CONTENT/MESSAGE --> <!-- CONTENT/MESSAGE -->
<MarkdownRenderer v-if="!editMsgMode" :markdown-text="message.content"></MarkdownRenderer> <MarkdownRenderer ref="mdRender" v-if="!editMsgMode" :markdown-text="message.content"></MarkdownRenderer>
<textarea v-if="editMsgMode" rows="4" <textarea v-if="editMsgMode" ref="mdTextarea" :rows="4"
class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 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="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 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"
:style="{minHeight:mdRenderHeight+`px`}"
placeholder="Enter message here..." v-model="new_message_content"></textarea> placeholder="Enter message here..." v-model="new_message_content"></textarea>
</div> </div>
<div class="invisible group-hover:visible flex flex-row mt-3 -mb-2"> <div class="invisible group-hover:visible flex flex-row mt-3 -mb-2">
@ -98,6 +99,7 @@ export default {
showConfirmation: false, showConfirmation: false,
editMsgMode: false, editMsgMode: false,
deleteMsgMode: false, deleteMsgMode: false,
mdRenderHeight:Number
} }
}, mounted() { }, mounted() {
@ -105,8 +107,12 @@ export default {
this.new_message_content = this.message.content this.new_message_content = this.message.content
nextTick(() => { nextTick(() => {
feather.replace() feather.replace()
this.mdRenderHeight=this.$refs.mdRender.$el.offsetHeight
}) })
}, methods: { }, methods: {
copyContentToClipboard() { copyContentToClipboard() {
this.$emit('copy', this.message.content) this.$emit('copy', this.message.content)
@ -145,17 +151,16 @@ export default {
showConfirmation() { showConfirmation() {
nextTick(() => { nextTick(() => {
feather.replace() feather.replace()
}) })
}, },
content(val) {
this.new_message_content = this.message.content
},
editMsgMode(val){ editMsgMode(val){
if(!val){ if(!val){
this.new_message_content = this.message.content this.new_message_content = this.message.content
} }
nextTick(() => { nextTick(() => {
feather.replace() feather.replace()
@ -167,12 +172,8 @@ export default {
}) })
}, },
},
computed: {
content() {
return this.message.content
}
} }
} }
</script> </script>

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

@ -3,32 +3,10 @@
class="overflow-y-scroll flex flex-col no-scrollbar shadow-lg min-w-[24rem] max-w-[24rem] bg-bg-light-tone dark:bg-bg-dark-tone"> class="overflow-y-scroll flex flex-col no-scrollbar shadow-lg min-w-[24rem] max-w-[24rem] bg-bg-light-tone dark:bg-bg-dark-tone">
<!-- LEFT SIDE PANEL --> <!-- LEFT SIDE PANEL -->
<div class="z-10 sticky top-0 flex-col bg-bg-light-tone dark:bg-bg-dark-tone shadow-md"> <div class="z-10 sticky top-0 flex-col bg-bg-light-tone dark:bg-bg-dark-tone shadow-md">
<!-- SEARCH BAR -->
<div class="flex-row pt-2 items-center gap-3 flex-0 w-full">
<div v-if="isSearch" class="px-4 pb-2 pt-2">
<div class="relative">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<div class="scale-75">
<i data-feather="search"></i>
</div>
</div>
<div class="absolute inset-y-0 right-0 flex items-center pr-3">
<div class="hover:text-secondary duration-75 active:scale-90"
:class="filterTitle ? 'visible' : 'invisible'" title="Clear" @click="filterTitle = ''">
<i data-feather="x"></i>
</div>
</div>
<input type="search" id="default-search"
class="block w-full p-2 pl-10 pr-10 text-sm border border-gray-300 rounded-lg bg-bg-light focus:ring-secondary focus:border-secondary dark:bg-bg-dark dark:border-gray-600 dark:placeholder-gray-400 dark:focus:ring-secondary dark:focus:border-secondary"
placeholder="Search..." title="Filter discussions by title" v-model="filterTitle"
@input="filterDiscussions()" />
</div>
</div>
</div>
<!-- CONTROL PANEL --> <!-- CONTROL PANEL -->
<div class="flex-row p-4 pt-2 flex items-center gap-3 flex-0"> <div class="flex-row p-4 flex items-center gap-3 flex-0">
<!-- MAIN BUTTONS --> <!-- MAIN BUTTONS -->
<button class="text-2xl hover:text-secondary duration-75 active:scale-90" title="Create new discussion" <button class="text-2xl hover:text-secondary duration-75 active:scale-90" title="Create new discussion"
@ -48,10 +26,33 @@
<i data-feather="database"></i> <i data-feather="database"></i>
</button> </button>
<button class="text-2xl hover:text-secondary duration-75 active:scale-90" title="Filter discussions" <button class="text-2xl hover:text-secondary duration-75 active:scale-90" title="Filter discussions"
type="button" @click="isSearch = !isSearch"> type="button" @click="isSearch = !isSearch" :class="isSearch ? 'text-secondary':''">
<i data-feather="search"></i> <i data-feather="search"></i>
</button> </button>
</div>
<!-- SEARCH BAR -->
<div class="flex-row items-center gap-3 flex-0 w-full">
<div v-if="isSearch" class="p-4 pt-2">
<div class="relative">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<div class="scale-75">
<i data-feather="search"></i>
</div>
</div>
<div class="absolute inset-y-0 right-0 flex items-center pr-3">
<div class="hover:text-secondary duration-75 active:scale-90"
:class="filterTitle ? 'visible' : 'invisible'" title="Clear" @click="filterTitle = ''">
<i data-feather="x"></i>
</div>
</div>
<input type="search" id="default-search"
class="block w-full p-2 pl-10 pr-10 text-sm border border-gray-300 rounded-lg bg-bg-light focus:ring-secondary focus:border-secondary dark:bg-bg-dark dark:border-gray-600 dark:placeholder-gray-400 dark:focus:ring-secondary dark:focus:border-secondary"
placeholder="Search..." title="Filter discussions by title" v-model="filterTitle"
@input="filterDiscussions()" />
</div>
</div>
</div> </div>
<hr v-if="isCheckbox" class="h-px bg-bg-light p-0 mb-4 px-4 mx-4 border-0 dark:bg-bg-dark"> <hr v-if="isCheckbox" class="h-px bg-bg-light p-0 mb-4 px-4 mx-4 border-0 dark:bg-bg-dark">
<div v-if="isCheckbox" class="flex flex-row flex-grow p-4 pt-0 items-center"> <div v-if="isCheckbox" class="flex flex-row flex-grow p-4 pt-0 items-center">