fix: code block overflow in chat (#509) bump:patch

This commit is contained in:
Tuan Anh Nguyen Dang (Tadashi_Cin) 2024-11-20 16:08:31 +07:00 committed by GitHub
parent 747bff8ee0
commit 013f6f4103
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 129 additions and 40 deletions

View File

@ -9,6 +9,3 @@ developers in mind.
[User Guide](https://cinnamon.github.io/kotaemon/) | [User Guide](https://cinnamon.github.io/kotaemon/) |
[Developer Guide](https://cinnamon.github.io/kotaemon/development/) | [Developer Guide](https://cinnamon.github.io/kotaemon/development/) |
[Feedback](https://github.com/Cinnamon/kotaemon/issues) [Feedback](https://github.com/Cinnamon/kotaemon/issues)
[Dark Mode](?__theme=dark) |
[Light Mode](?__theme=light)

View File

@ -52,6 +52,14 @@ button.selected {
font-weight: bold; font-weight: bold;
} }
.message-row.bubble.bot-row{
overflow-x: auto;
}
.flex-wrap.bot {
overflow-x: inherit;
}
#chat-tab, #chat-tab,
#indices-tab, #indices-tab,
#settings-tab, #settings-tab,
@ -191,11 +199,11 @@ mark {
right: 15px; right: 15px;
} }
#new-conv-button > img { /* #new-conv-button > img {
position: relative; position: relative;
top: 0px; top: 0px;
right: -50%; right: -50%;
} } */
span.icon { span.icon {
color: #cecece; color: #cecece;
@ -271,3 +279,54 @@ pdfjs-viewer-element {
flex: 1; flex: 1;
overflow: auto; overflow: auto;
} }
/** Switch
-------------------------------------*/
#is-public-checkbox {
position: relative;
top: 4px;
}
.switch input {
position: absolute;
opacity: 0;
}
/**
* 1. Adjust this to size
*/
.switch {
display: inline-block;
/* 1 */
height: 1em;
width: 2em;
background: #8f8f8f;
border-radius: 1em;
position: relative;
top: 2px;
margin-right: 1em;
}
.switch div {
height: 1em;
width: 1em;
border-radius: 1em;
background: #FFF;
box-shadow: 0 0.1em 0.3em rgba(0, 0, 0, 0.3);
-webkit-transition: all 300ms;
-moz-transition: all 300ms;
transition: all 300ms;
}
.switch input:checked+div {
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
background: #12df9a;
}
.switch:has(> input:checked) {
background: #0c895f;
}

View File

@ -16,6 +16,16 @@ function run() {
let chat_info_panel = document.getElementById("info-expand"); let chat_info_panel = document.getElementById("info-expand");
chat_info_panel.insertBefore(info_expand_button, chat_info_panel.childNodes[2]); chat_info_panel.insertBefore(info_expand_button, chat_info_panel.childNodes[2]);
// create slider toggle
const is_public_checkbox = document.getElementById("is-public-checkbox");
const label_element = is_public_checkbox.getElementsByTagName("label")[0];
const checkbox_span = is_public_checkbox.getElementsByTagName("span")[0];
new_div = document.createElement("div");
label_element.classList.add("switch");
is_public_checkbox.appendChild(checkbox_span);
label_element.appendChild(new_div)
// clpse // clpse
globalThis.clpseFn = (id) => { globalThis.clpseFn = (id) => {
var obj = document.getElementById('clpse-btn-' + id); var obj = document.getElementById('clpse-btn-' + id);

View File

@ -8,6 +8,3 @@ An open-source tool for you to chat with your documents.
[User Guide](https://cinnamon.github.io/kotaemon/) | [User Guide](https://cinnamon.github.io/kotaemon/) |
[Developer Guide](https://cinnamon.github.io/kotaemon/development/) | [Developer Guide](https://cinnamon.github.io/kotaemon/development/) |
[Feedback](https://github.com/Cinnamon/kotaemon/issues) [Feedback](https://github.com/Cinnamon/kotaemon/issues)
[Dark Mode](?__theme=dark)
[Night Mode](?__theme=light)

View File

@ -76,7 +76,6 @@ class ChatPage(BasePage):
self._preview_links = gr.State(value=None) self._preview_links = gr.State(value=None)
self._reasoning_type = gr.State(value=None) self._reasoning_type = gr.State(value=None)
self._llm_type = gr.State(value=None)
self._conversation_renamed = gr.State(value=False) self._conversation_renamed = gr.State(value=False)
self._suggestion_updated = gr.State(value=False) self._suggestion_updated = gr.State(value=False)
self._info_panel_expanded = gr.State(value=True) self._info_panel_expanded = gr.State(value=True)
@ -142,6 +141,7 @@ class ChatPage(BasePage):
with gr.Row(): with gr.Row():
gr.HTML("Reasoning method") gr.HTML("Reasoning method")
gr.HTML("Model") gr.HTML("Model")
gr.HTML("Generate mindmap")
with gr.Row(): with gr.Row():
reasoning_type_values = [ reasoning_type_values = [
@ -149,13 +149,13 @@ class ChatPage(BasePage):
] + self._app.default_settings.reasoning.settings[ ] + self._app.default_settings.reasoning.settings[
"use" "use"
].choices ].choices
self.reasoning_types = gr.Dropdown( self.reasoning_type = gr.Dropdown(
choices=reasoning_type_values, choices=reasoning_type_values,
value=DEFAULT_SETTING, value=DEFAULT_SETTING,
container=False, container=False,
show_label=False, show_label=False,
) )
self.model_types = gr.Dropdown( self.model_type = gr.Dropdown(
choices=self._app.default_settings.reasoning.options[ choices=self._app.default_settings.reasoning.options[
"simple" "simple"
] ]
@ -165,6 +165,17 @@ class ChatPage(BasePage):
container=False, container=False,
show_label=False, show_label=False,
) )
binary_default_choices = [
(DEFAULT_SETTING, DEFAULT_SETTING),
("Enable", True),
("Disable", False),
]
self.use_mindmap = gr.Dropdown(
value=DEFAULT_SETTING,
choices=binary_default_choices,
container=False,
show_label=False,
)
with gr.Column( with gr.Column(
scale=INFO_PANEL_SCALES[False], elem_id="chat-info-panel" scale=INFO_PANEL_SCALES[False], elem_id="chat-info-panel"
@ -222,7 +233,8 @@ class ChatPage(BasePage):
self.chat_panel.chatbot, self.chat_panel.chatbot,
self._app.settings_state, self._app.settings_state,
self._reasoning_type, self._reasoning_type,
self._llm_type, self.model_type,
self.use_mindmap,
self.state_chat, self.state_chat,
self._app.user_id, self._app.user_id,
] ]
@ -489,16 +501,11 @@ class ChatPage(BasePage):
+ self._indices_input, + self._indices_input,
outputs=None, outputs=None,
) )
self.reasoning_types.change( self.reasoning_type.change(
self.reasoning_changed, self.reasoning_changed,
inputs=[self.reasoning_types], inputs=[self.reasoning_type],
outputs=[self._reasoning_type], outputs=[self._reasoning_type],
) )
self.model_types.change(
lambda x: x,
inputs=[self.model_types],
outputs=[self._llm_type],
)
self.chat_control.conversation_id.change( self.chat_control.conversation_id.change(
lambda: gr.update(visible=False), lambda: gr.update(visible=False),
outputs=self.plot_panel, outputs=self.plot_panel,
@ -714,6 +721,7 @@ class ChatPage(BasePage):
settings: dict, settings: dict,
session_reasoning_type: str, session_reasoning_type: str,
session_llm: str, session_llm: str,
session_use_mindmap: bool | str,
state: dict, state: dict,
user_id: int, user_id: int,
*selecteds, *selecteds,
@ -730,7 +738,12 @@ class ChatPage(BasePage):
- the pipeline objects - the pipeline objects
""" """
# override reasoning_mode by temporary chat page state # override reasoning_mode by temporary chat page state
print("Session reasoning type", session_reasoning_type) print(
"Session reasoning type",
session_reasoning_type,
"use mindmap",
session_use_mindmap,
)
print("Session LLM", session_llm) print("Session LLM", session_llm)
reasoning_mode = ( reasoning_mode = (
settings["reasoning.use"] settings["reasoning.use"]
@ -743,9 +756,16 @@ class ChatPage(BasePage):
settings = deepcopy(settings) settings = deepcopy(settings)
llm_setting_key = f"reasoning.options.{reasoning_id}.llm" llm_setting_key = f"reasoning.options.{reasoning_id}.llm"
if llm_setting_key in settings and session_llm not in (DEFAULT_SETTING, None): if llm_setting_key in settings and session_llm not in (
DEFAULT_SETTING,
None,
"",
):
settings[llm_setting_key] = session_llm settings[llm_setting_key] = session_llm
if session_use_mindmap not in (DEFAULT_SETTING, None):
settings["reasoning.options.simple.create_mindmap"] = session_use_mindmap
# get retrievers # get retrievers
retrievers = [] retrievers = []
for index in self._app.index_manager.indices: for index in self._app.index_manager.indices:
@ -777,6 +797,7 @@ class ChatPage(BasePage):
settings, settings,
reasoning_type, reasoning_type,
llm_type, llm_type,
use_mind_map,
state, state,
user_id, user_id,
*selecteds, *selecteds,
@ -793,7 +814,7 @@ class ChatPage(BasePage):
# construct the pipeline # construct the pipeline
pipeline, reasoning_state = self.create_pipeline( pipeline, reasoning_state = self.create_pipeline(
settings, reasoning_type, llm_type, state, user_id, *selecteds settings, reasoning_type, llm_type, use_mind_map, state, user_id, *selecteds
) )
print("Reasoning state", reasoning_state) print("Reasoning state", reasoning_state)
pipeline.set_output_queue(queue) pipeline.set_output_queue(queue)

View File

@ -40,15 +40,6 @@ class ConversationControl(BasePage):
def on_building_ui(self): def on_building_ui(self):
with gr.Row(): with gr.Row():
gr.Markdown("## Conversations") gr.Markdown("## Conversations")
self.btn_new = gr.Button(
value="",
icon=f"{ASSETS_DIR}/new.svg",
min_width=2,
scale=1,
size="sm",
elem_classes=["no-background", "body-text-color"],
elem_id="new-conv-button",
)
self.btn_toggle_dark_mode = gr.Button( self.btn_toggle_dark_mode = gr.Button(
value="", value="",
icon=f"{ASSETS_DIR}/dark_mode.svg", icon=f"{ASSETS_DIR}/dark_mode.svg",
@ -87,13 +78,13 @@ class ConversationControl(BasePage):
) )
with gr.Row() as self._new_delete: with gr.Row() as self._new_delete:
self.btn_del = gr.Button( self.cb_is_public = gr.Checkbox(
value="", value=False,
icon=f"{ASSETS_DIR}/delete.svg", label="Shared",
min_width=2, min_width=10,
scale=1, scale=4,
size="sm", elem_id="is-public-checkbox",
elem_classes=["no-background", "body-text-color"], container=False,
) )
self.btn_conversation_rn = gr.Button( self.btn_conversation_rn = gr.Button(
value="", value="",
@ -103,8 +94,22 @@ class ConversationControl(BasePage):
size="sm", size="sm",
elem_classes=["no-background", "body-text-color"], elem_classes=["no-background", "body-text-color"],
) )
self.cb_is_public = gr.Checkbox( self.btn_del = gr.Button(
value=False, label="Share conversation", min_width=10, scale=6 value="",
icon=f"{ASSETS_DIR}/delete.svg",
min_width=2,
scale=1,
size="sm",
elem_classes=["no-background", "body-text-color"],
)
self.btn_new = gr.Button(
value="",
icon=f"{ASSETS_DIR}/new.svg",
min_width=2,
scale=1,
size="sm",
elem_classes=["no-background", "body-text-color"],
elem_id="new-conv-button",
) )
with gr.Row(visible=False) as self._delete_confirm: with gr.Row(visible=False) as self._delete_confirm: