mirror of
https://github.com/nomic-ai/gpt4all.git
synced 2024-08-17 01:00:28 +03:00
ChatDrawer: make chat name editing more obvious (#2507)
Signed-off-by: Jared Van Bortel <jared@nomic.ai>
This commit is contained in:
Jared Van Bortel
GitHub
parent
67fd391c8f
commit
3d496f4648
@ -175,49 +175,50 @@ qt_add_qml_module(chat
|
|||||||
icons/antenna_1.svg
|
icons/antenna_1.svg
|
||||||
icons/antenna_2.svg
|
icons/antenna_2.svg
|
||||||
icons/antenna_3.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_down.svg
|
||||||
icons/caret_right.svg
|
icons/caret_right.svg
|
||||||
icons/chat.svg
|
|
||||||
icons/changelog.svg
|
icons/changelog.svg
|
||||||
|
icons/chat.svg
|
||||||
|
icons/check.svg
|
||||||
icons/close.svg
|
icons/close.svg
|
||||||
icons/copy.svg
|
icons/copy.svg
|
||||||
icons/db.svg
|
icons/db.svg
|
||||||
icons/discord.svg
|
icons/discord.svg
|
||||||
icons/download.svg
|
icons/download.svg
|
||||||
icons/settings.svg
|
|
||||||
icons/eject.svg
|
|
||||||
icons/edit.svg
|
icons/edit.svg
|
||||||
|
icons/eject.svg
|
||||||
icons/email.svg
|
icons/email.svg
|
||||||
icons/file.svg
|
|
||||||
icons/file-md.svg
|
icons/file-md.svg
|
||||||
icons/file-pdf.svg
|
icons/file-pdf.svg
|
||||||
icons/file-txt.svg
|
icons/file-txt.svg
|
||||||
|
icons/file.svg
|
||||||
icons/github.svg
|
icons/github.svg
|
||||||
icons/globe.svg
|
icons/globe.svg
|
||||||
|
icons/gpt4all-32.png
|
||||||
|
icons/gpt4all-48.png
|
||||||
|
icons/gpt4all.svg
|
||||||
|
icons/gpt4all_transparent.svg
|
||||||
icons/home.svg
|
icons/home.svg
|
||||||
icons/image.svg
|
icons/image.svg
|
||||||
icons/info.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_closed.svg
|
||||||
icons/left_panel_open.svg
|
icons/left_panel_open.svg
|
||||||
icons/gpt4all.svg
|
icons/local-docs.svg
|
||||||
icons/gpt4all_transparent.svg
|
icons/models.svg
|
||||||
icons/gpt4all-32.png
|
icons/network.svg
|
||||||
icons/gpt4all-48.png
|
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
|
icons/you.svg
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|||||||
1
gpt4all-chat/icons/check.svg
Normal file
1
gpt4all-chat/icons/check.svg
Normal 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>
|
||||||
|
After Width: | Height: | Size: 239 B |
@ -122,7 +122,7 @@ Rectangle {
|
|||||||
delegate: Rectangle {
|
delegate: Rectangle {
|
||||||
id: chatRectangle
|
id: chatRectangle
|
||||||
width: conversationList.width
|
width: conversationList.width
|
||||||
height: chatName.height
|
height: chatNameBox.height + 20
|
||||||
property bool isCurrent: ChatListModel.currentChat === ChatListModel.get(index)
|
property bool isCurrent: ChatListModel.currentChat === ChatListModel.get(index)
|
||||||
property bool isServer: ChatListModel.get(index) && ChatListModel.get(index).isServer
|
property bool isServer: ChatListModel.get(index) && ChatListModel.get(index).isServer
|
||||||
property bool trashQuestionDisplayed: false
|
property bool trashQuestionDisplayed: false
|
||||||
@ -133,97 +133,125 @@ Rectangle {
|
|||||||
border.color: theme.dividerColor
|
border.color: theme.dividerColor
|
||||||
radius: 10
|
radius: 10
|
||||||
|
|
||||||
TextField {
|
Rectangle {
|
||||||
id: chatName
|
id: chatNameBox
|
||||||
|
height: chatName.height
|
||||||
anchors.left: parent.left
|
anchors.left: parent.left
|
||||||
anchors.right: buttons.left
|
anchors.right: trashButton.left
|
||||||
color: theme.styledTextColor
|
anchors.verticalCenter: chatRectangle.verticalCenter
|
||||||
topPadding: 15
|
anchors.leftMargin: 5
|
||||||
bottomPadding: 15
|
anchors.rightMargin: 5
|
||||||
focus: false
|
radius: 5
|
||||||
readOnly: true
|
color: chatName.readOnly ? "transparent" : theme.chatNameEditBgColor
|
||||||
wrapMode: Text.NoWrap
|
|
||||||
hoverEnabled: false // Disable hover events on the TextArea
|
TextField {
|
||||||
selectByMouse: false // Disable text selection in the TextArea
|
id: chatName
|
||||||
font.pixelSize: theme.fontSizeLarge
|
anchors.left: parent.left
|
||||||
font.bold: true
|
anchors.right: editButton.left
|
||||||
text: readOnly ? metrics.elidedText : name
|
anchors.verticalCenter: chatNameBox.verticalCenter
|
||||||
horizontalAlignment: TextInput.AlignLeft
|
topPadding: 5
|
||||||
opacity: trashQuestionDisplayed ? 0.5 : 1.0
|
bottomPadding: 5
|
||||||
TextMetrics {
|
color: theme.styledTextColor
|
||||||
id: metrics
|
focus: false
|
||||||
font: chatName.font
|
readOnly: true
|
||||||
text: name
|
wrapMode: Text.NoWrap
|
||||||
elide: Text.ElideRight
|
hoverEnabled: false // Disable hover events on the TextArea
|
||||||
elideWidth: chatName.width - 15
|
selectByMouse: false // Disable text selection in the TextArea
|
||||||
}
|
font.pixelSize: theme.fontSizeLarge
|
||||||
background: Rectangle {
|
font.bold: true
|
||||||
color: "transparent"
|
text: readOnly ? metrics.elidedText : name
|
||||||
}
|
horizontalAlignment: TextInput.AlignLeft
|
||||||
onEditingFinished: {
|
opacity: trashQuestionDisplayed ? 0.5 : 1.0
|
||||||
// Work around a bug in qml where we're losing focus when the whole window
|
TextMetrics {
|
||||||
// goes out of focus even though this textfield should be marked as not
|
id: metrics
|
||||||
// having focus
|
font: chatName.font
|
||||||
if (chatName.readOnly)
|
text: name
|
||||||
return;
|
elide: Text.ElideRight
|
||||||
Network.trackChatEvent("rename_chat")
|
elideWidth: chatName.width - 15
|
||||||
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);
|
|
||||||
}
|
}
|
||||||
|
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 {
|
MyToolButton {
|
||||||
id: editButton
|
id: editButton
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.rightMargin: 5
|
||||||
imageWidth: 24
|
imageWidth: 24
|
||||||
imageHeight: 24
|
imageHeight: 24
|
||||||
visible: isCurrent && !isServer
|
visible: isCurrent && !isServer && chatName.readOnly
|
||||||
opacity: trashQuestionDisplayed ? 0.5 : 1.0
|
opacity: trashQuestionDisplayed ? 0.5 : 1.0
|
||||||
source: "qrc:/gpt4all/icons/edit.svg"
|
source: "qrc:/gpt4all/icons/edit.svg"
|
||||||
onClicked: {
|
onClicked: {
|
||||||
chatName.focus = true
|
chatName.focus = true;
|
||||||
chatName.readOnly = false
|
chatName.readOnly = false;
|
||||||
chatName.selectByMouse = true
|
chatName.selectByMouse = true;
|
||||||
}
|
}
|
||||||
Accessible.name: qsTr("Edit chat name")
|
Accessible.name: qsTr("Edit chat name")
|
||||||
}
|
}
|
||||||
MyToolButton {
|
MyToolButton {
|
||||||
id: trashButton
|
id: okButton
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.rightMargin: 5
|
||||||
imageWidth: 24
|
imageWidth: 24
|
||||||
imageHeight: 24
|
imageHeight: 24
|
||||||
visible: isCurrent && !isServer
|
visible: isCurrent && !isServer && !chatName.readOnly
|
||||||
source: "qrc:/gpt4all/icons/trash.svg"
|
opacity: trashQuestionDisplayed ? 0.5 : 1.0
|
||||||
onClicked: {
|
source: "qrc:/gpt4all/icons/check.svg"
|
||||||
trashQuestionDisplayed = true
|
onClicked: chatName.changeName()
|
||||||
timer.start()
|
Accessible.name: qsTr("Save chat name")
|
||||||
}
|
|
||||||
Accessible.name: qsTr("Delete chat")
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
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 {
|
Rectangle {
|
||||||
id: trashSureQuestion
|
id: trashSureQuestion
|
||||||
anchors.top: buttons.bottom
|
anchors.top: trashButton.bottom
|
||||||
anchors.topMargin: 10
|
anchors.topMargin: 10
|
||||||
anchors.right: buttons.right
|
anchors.right: trashButton.right
|
||||||
width: childrenRect.width
|
width: childrenRect.width
|
||||||
height: childrenRect.height
|
height: childrenRect.height
|
||||||
color: chatRectangle.color
|
color: chatRectangle.color
|
||||||
|
|||||||
@ -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 :
|
property real fontScale: MySettings.fontSize === "Small" ? 1 :
|
||||||
MySettings.fontSize === "Medium" ? 1.3 :
|
MySettings.fontSize === "Medium" ? 1.3 :
|
||||||
/* "Large" */ 1.8
|
/* "Large" */ 1.8
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user