Skip to content

Commit

Permalink
feat: refine UI and add go to chat btn (#500) bump:minor
Browse files Browse the repository at this point in the history
  • Loading branch information
taprosoft authored Nov 18, 2024
1 parent d42b477 commit 7412432
Show file tree
Hide file tree
Showing 3 changed files with 104 additions and 30 deletions.
14 changes: 13 additions & 1 deletion libs/ktem/ktem/assets/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,19 @@ mark {
#toggle-dark-button {
position: fixed;
top: 6px;
right: 40px;
right: 60px;
}

#info-expand-button {
position: fixed;
top: 6px;
right: 85px;
}

#new-conv-button > img {
position: relative;
top: 0px;
right: -50%;
}

.upload-button {
Expand Down
83 changes: 71 additions & 12 deletions libs/ktem/ktem/index/file/ui.py
Original file line number Diff line number Diff line change
Expand Up @@ -135,20 +135,25 @@ def render_file_list(self):
)

with gr.Row():
self.deselect_button = gr.Button(
"Close",

self.chat_button = gr.Button(
"Go to Chat",
visible=False,
)
self.is_zipped_state = gr.State(value=False)
self.download_single_button = gr.DownloadButton(
"Download file",
"Download",
visible=False,
)
self.delete_button = gr.Button(
"Delete",
variant="stop",
visible=False,
)
self.deselect_button = gr.Button(
"Close",
visible=False,
)

with gr.Row() as self.selection_info:
self.selected_file_id = gr.State(value=None)
Expand Down Expand Up @@ -192,15 +197,19 @@ def render_group_list(self):
"Add",
variant="primary",
)
self.group_close_button = gr.Button(
"Close",
self.group_chat_button = gr.Button(
"Go to Chat",
visible=False,
)
self.group_delete_button = gr.Button(
"Delete",
variant="stop",
visible=False,
)
self.group_close_button = gr.Button(
"Close",
visible=False,
)

with gr.Column(visible=False) as self._group_info_panel:
self.group_label = gr.Markdown()
Expand Down Expand Up @@ -375,6 +384,7 @@ def file_selected(self, file_id):
gr.update(visible=file_id is not None),
gr.update(visible=file_id is not None),
gr.update(visible=file_id is not None),
gr.update(visible=file_id is not None),
)

def delete_event(self, file_id):
Expand Down Expand Up @@ -475,6 +485,9 @@ def delete_all_files(self, file_list):
for file_id in file_list.id.values:
self.delete_event(file_id)

def set_file_id_selector(self, selected_file_id):
return [selected_file_id, "select", gr.Tabs(selected="chat-tab")]

def show_delete_all_confirm(self, file_list):
# when the list of files is empty it shows a single line with id equal to -
if len(file_list) == 0 or (
Expand Down Expand Up @@ -520,6 +533,7 @@ def on_register_events(self):
self.deselect_button,
self.delete_button,
self.download_single_button,
self.chat_button,
],
show_progress="hidden",
)
Expand All @@ -540,10 +554,21 @@ def on_register_events(self):
self.deselect_button,
self.delete_button,
self.download_single_button,
self.chat_button,
],
show_progress="hidden",
)

self.chat_button.click(
fn=self.set_file_id_selector,
inputs=[self.selected_file_id],
outputs=[
self._index.get_selector_component_ui().selector,
self._index.get_selector_component_ui().mode,
self._app.tabs,
],
)

self.download_all_button.click(
fn=self.download_all_files,
inputs=[],
Expand Down Expand Up @@ -713,6 +738,7 @@ def on_register_events(self):
self.deselect_button,
self.delete_button,
self.download_single_button,
self.chat_button,
],
show_progress="hidden",
)
Expand All @@ -728,12 +754,14 @@ def on_register_events(self):
gr.update(visible=False),
gr.update(visible=True),
gr.update(visible=True),
gr.update(visible=True),
),
outputs=[
self._group_info_panel,
self.group_add_button,
self.group_close_button,
self.group_delete_button,
self.group_chat_button,
],
)

Expand Down Expand Up @@ -761,26 +789,45 @@ def on_register_events(self):
],
)

onGroupSaved = self.group_save_button.click(
fn=self.save_group,
inputs=[self.group_name, self.group_files, self._app.user_id],
).then(
self.list_group,
inputs=[self._app.user_id, self.file_list_state],
outputs=[self.group_list_state, self.group_list],
self.group_chat_button.click(
fn=self.set_group_id_selector,
inputs=[self.group_name],
outputs=[
self._index.get_selector_component_ui().selector,
self._index.get_selector_component_ui().mode,
self._app.tabs,
],
)

onGroupSaved = (
self.group_save_button.click(
fn=self.save_group,
inputs=[self.group_name, self.group_files, self._app.user_id],
)
.then(
self.list_group,
inputs=[self._app.user_id, self.file_list_state],
outputs=[self.group_list_state, self.group_list],
)
.then(
fn=lambda: gr.update(visible=False),
outputs=[self._group_info_panel],
)
)
self.group_close_button.click(
fn=lambda: [
gr.update(visible=True),
gr.update(visible=False),
gr.update(visible=False),
gr.update(visible=False),
gr.update(visible=False),
],
outputs=[
self.group_add_button,
self._group_info_panel,
self.group_close_button,
self.group_delete_button,
self.group_chat_button,
],
)
onGroupDeleted = self.group_delete_button.click(
Expand Down Expand Up @@ -1158,6 +1205,18 @@ def list_group(self, user_id, file_list):

return results, group_list

def set_group_id_selector(self, selected_group_name):
FileGroup = self._index._resources["FileGroup"]

# check if group_name exist
with Session(engine) as session:
current_group = (
session.query(FileGroup).filter_by(name=selected_group_name).first()
)

file_ids = [json.dumps(current_group.data["files"])]
return [file_ids, "select", gr.Tabs(selected="chat-tab")]

def save_group(self, group_name, group_files, user_id):
FileGroup = self._index._resources["FileGroup"]
current_group = None
Expand Down
37 changes: 20 additions & 17 deletions libs/ktem/ktem/pages/chat/control.py
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,15 @@ def __init__(self, app):
def on_building_ui(self):
with gr.Row():
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(
value="",
icon=f"{ASSETS_DIR}/dark_mode.svg",
Expand All @@ -48,6 +57,16 @@ def on_building_ui(self):
elem_classes=["no-background", "body-text-color"],
elem_id="toggle-dark-button",
)
self.btn_info_expand = gr.Button(
value="",
icon=f"{ASSETS_DIR}/sidebar.svg",
min_width=2,
scale=1,
size="sm",
elem_classes=["no-background", "body-text-color"],
elem_id="info-expand-button",
)

self.btn_toggle_dark_mode.click(
None,
js="""
Expand All @@ -68,14 +87,6 @@ def on_building_ui(self):
)

with gr.Row() as self._new_delete:
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"],
)
self.btn_del = gr.Button(
value="",
icon=f"{ASSETS_DIR}/delete.svg",
Expand All @@ -92,16 +103,8 @@ def on_building_ui(self):
size="sm",
elem_classes=["no-background", "body-text-color"],
)
self.btn_info_expand = gr.Button(
value="",
icon=f"{ASSETS_DIR}/sidebar.svg",
min_width=2,
scale=1,
size="sm",
elem_classes=["no-background", "body-text-color"],
)
self.cb_is_public = gr.Checkbox(
value=False, label="Shared", min_width=10, scale=4
value=False, label="Share conversation", min_width=10, scale=6
)

with gr.Row(visible=False) as self._delete_confirm:
Expand Down

0 comments on commit 7412432

Please sign in to comment.