AI/gpt4all
1
0
Fork 0
mirror of https://github.com/nomic-ai/gpt4all.git synced 2024-10-01 01:06:10 -04:00
Code Issues Packages Projects Releases Wiki Activity

ChatDrawer: make chat name editing more obvious (#2507)

Browse Source 
Signed-off-by: Jared Van Bortel <jared@nomic.ai>
This commit is contained in:
Jared Van Bortel 2024-07-01 18:24:04 -04:00 committed by GitHub
parent 67fd391c8f
commit 3d496f4648
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 134 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
gpt4all-chat/CMakeLists.txt
View File

@ -175,49 +175,50 @@ qt_add_qml_module(chat
icons/antenna_1.svg
icons/antenna_2.svg
icons/antenna_3.svg
icons/send_message.svg
icons/stop_generating.svg
icons/recycle.svg
icons/regenerate.svg
icons/caret_down.svg
icons/caret_right.svg
icons/chat.svg
icons/changelog.svg
icons/chat.svg
icons/check.svg
icons/close.svg
icons/copy.svg
icons/db.svg
icons/discord.svg
icons/download.svg
icons/settings.svg
icons/eject.svg
icons/edit.svg
icons/eject.svg
icons/email.svg
icons/file.svg
icons/file-md.svg
icons/file-pdf.svg
icons/file-txt.svg
icons/file.svg
icons/github.svg
icons/globe.svg
icons/gpt4all-32.png
icons/gpt4all-48.png
icons/gpt4all.svg
icons/gpt4all_transparent.svg
icons/home.svg
icons/image.svg
icons/info.svg
icons/local-docs.svg
icons/models.svg
icons/nomic_logo.svg
icons/notes.svg
icons/search.svg
icons/trash.svg
icons/network.svg
icons/thumbs_up.svg
icons/thumbs_down.svg
icons/twitter.svg
icons/up_down.svg
icons/left_panel_closed.svg
icons/left_panel_open.svg
icons/gpt4all.svg
icons/gpt4all_transparent.svg
icons/gpt4all-32.png
icons/gpt4all-48.png
icons/local-docs.svg
icons/models.svg
icons/network.svg
icons/nomic_logo.svg
icons/notes.svg
icons/recycle.svg
icons/regenerate.svg
icons/search.svg
icons/send_message.svg
icons/settings.svg
icons/stop_generating.svg
icons/thumbs_down.svg
icons/thumbs_up.svg
icons/trash.svg
icons/twitter.svg
icons/up_down.svg
icons/you.svg
)

1
gpt4all-chat/icons/check.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M229.66,77.66l-128,128a8,8,0,0,1-11.32,0l-56-56a8,8,0,0,1,11.32-11.32L96,188.69,218.34,66.34a8,8,0,0,1,11.32,11.32Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 239 B

170
gpt4all-chat/qml/ChatDrawer.qml
View File

@ -122,7 +122,7 @@ Rectangle {
delegate: Rectangle {
id: chatRectangle
width: conversationList.width
height: chatName.height
height: chatNameBox.height + 20
property bool isCurrent: ChatListModel.currentChat === ChatListModel.get(index)
property bool isServer: ChatListModel.get(index) && ChatListModel.get(index).isServer
property bool trashQuestionDisplayed: false
@ -133,97 +133,125 @@ Rectangle {
border.color: theme.dividerColor
radius: 10
TextField {
id: chatName
Rectangle {
id: chatNameBox
height: chatName.height
anchors.left: parent.left
anchors.right: buttons.left
color: theme.styledTextColor
topPadding: 15
bottomPadding: 15
focus: false
readOnly: true
wrapMode: Text.NoWrap
hoverEnabled: false // Disable hover events on the TextArea
selectByMouse: false // Disable text selection in the TextArea
font.pixelSize: theme.fontSizeLarge
font.bold: true
text: readOnly ? metrics.elidedText : name
horizontalAlignment: TextInput.AlignLeft
opacity: trashQuestionDisplayed ? 0.5 : 1.0
TextMetrics {
id: metrics
font: chatName.font
text: name
elide: Text.ElideRight
elideWidth: chatName.width - 15
}
background: Rectangle {
color: "transparent"
}
onEditingFinished: {
// Work around a bug in qml where we're losing focus when the whole window
// goes out of focus even though this textfield should be marked as not
// having focus
if (chatName.readOnly)
return;
Network.trackChatEvent("rename_chat")
changeName();
}
function changeName() {
ChatListModel.get(index).name = chatName.text
chatName.focus = false
chatName.readOnly = true
chatName.selectByMouse = false
}
TapHandler {
onTapped: {
if (isCurrent)
return;
ChatListModel.currentChat = ChatListModel.get(index);
anchors.right: trashButton.left
anchors.verticalCenter: chatRectangle.verticalCenter
anchors.leftMargin: 5
anchors.rightMargin: 5
radius: 5
color: chatName.readOnly ? "transparent" : theme.chatNameEditBgColor
TextField {
id: chatName
anchors.left: parent.left
anchors.right: editButton.left
anchors.verticalCenter: chatNameBox.verticalCenter
topPadding: 5
bottomPadding: 5
color: theme.styledTextColor
focus: false
readOnly: true
wrapMode: Text.NoWrap
hoverEnabled: false // Disable hover events on the TextArea
selectByMouse: false // Disable text selection in the TextArea
font.pixelSize: theme.fontSizeLarge
font.bold: true
text: readOnly ? metrics.elidedText : name
horizontalAlignment: TextInput.AlignLeft
opacity: trashQuestionDisplayed ? 0.5 : 1.0
TextMetrics {
id: metrics
font: chatName.font
text: name
elide: Text.ElideRight
elideWidth: chatName.width - 15
}
background: Rectangle {
color: "transparent"
}
onEditingFinished: {
// Work around a bug in qml where we're losing focus when the whole window
// goes out of focus even though this textfield should be marked as not
// having focus
console.log("onEditingFinished in");
if (chatName.readOnly)
return;
console.log("onEditingFinished changeName");
changeName();
}
function changeName() {
Network.trackChatEvent("rename_chat");
ChatListModel.get(index).name = chatName.text;
chatName.focus = false;
chatName.readOnly = true;
chatName.selectByMouse = false;
}
TapHandler {
onTapped: {
if (isCurrent)
return;
ChatListModel.currentChat = ChatListModel.get(index);
}
}
Accessible.role: Accessible.Button
Accessible.name: text
Accessible.description: qsTr("Select the current chat or edit the chat when in edit mode")
}
Accessible.role: Accessible.Button
Accessible.name: text
Accessible.description: qsTr("Select the current chat or edit the chat when in edit mode")
}
Row {
id: buttons
anchors.verticalCenter: chatName.verticalCenter
anchors.right: chatRectangle.right
anchors.rightMargin: 10
spacing: 5
MyToolButton {
id: editButton
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 5
imageWidth: 24
imageHeight: 24
visible: isCurrent && !isServer
visible: isCurrent && !isServer && chatName.readOnly
opacity: trashQuestionDisplayed ? 0.5 : 1.0
source: "qrc:/gpt4all/icons/edit.svg"
onClicked: {
chatName.focus = true
chatName.readOnly = false
chatName.selectByMouse = true
chatName.focus = true;
chatName.readOnly = false;
chatName.selectByMouse = true;
}
Accessible.name: qsTr("Edit chat name")
}
MyToolButton {
id: trashButton
id: okButton
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: 5
imageWidth: 24
imageHeight: 24
visible: isCurrent && !isServer
source: "qrc:/gpt4all/icons/trash.svg"
onClicked: {
trashQuestionDisplayed = true
timer.start()
}
Accessible.name: qsTr("Delete chat")
visible: isCurrent && !isServer && !chatName.readOnly
opacity: trashQuestionDisplayed ? 0.5 : 1.0
source: "qrc:/gpt4all/icons/check.svg"
onClicked: chatName.changeName()
Accessible.name: qsTr("Save chat name")
}
}
MyToolButton {
id: trashButton
anchors.verticalCenter: chatNameBox.verticalCenter
anchors.right: chatRectangle.right
anchors.rightMargin: 10
imageWidth: 24
imageHeight: 24
visible: isCurrent && !isServer
source: "qrc:/gpt4all/icons/trash.svg"
onClicked: {
trashQuestionDisplayed = true
timer.start()
}
Accessible.name: qsTr("Delete chat")
}
Rectangle {
id: trashSureQuestion
anchors.top: buttons.bottom
anchors.top: trashButton.bottom
anchors.topMargin: 10
anchors.right: buttons.right
anchors.right: trashButton.right
width: childrenRect.width
height: childrenRect.height
color: chatRectangle.color

10
gpt4all-chat/qml/Theme.qml
View File

@ -1154,6 +1154,16 @@ QtObject {
}
}
property color chatNameEditBgColor: {
switch (MySettings.chatTheme) {
case "LegacyDark":
case "Dark":
return controlBackground;
default:
return gray100;
}
}
property real fontScale: MySettings.fontSize === "Small" ? 1 :
MySettings.fontSize === "Medium" ? 1.3 :
/* "Large" */ 1.8