status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

chore(InDropdown): Adapt to flattened model for channels 

Closes: #9591
This commit is contained in:
Michał Cieślak 2023-02-27 12:38:05 +01:00 committed by Michał
parent bb2e03bd88
commit 702d355e89
3 changed files with 122 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
storybook/src/Models/ChannelsModel.qml
View File

@ -2,66 +2,84 @@ import QtQuick 2.14
ListModel { ListModel {
ListElement { ListElement {
itemId: 0 itemId: "1"
isCategory: false
categoryId: ""
name: "welcome" name: "welcome"
isCategory: false emoji: ""
color: "" color: ""
colorId: 1 colorId: 1
icon: ""
} }
ListElement { ListElement {
itemId: 1 itemId: "2"
isCategory: false
categoryId: ""
name: "announcements" name: "announcements"
emoji: ""
color: ""
colorId: 1
}
ListElement {
itemId: "0"
isCategory: true
categoryId: "1"
name: "discussion"
emoji: ""
color: ""
colorId: 1
}
ListElement {
itemId: "3"
isCategory: false isCategory: false
color: "" categoryId: "1"
colorId: 1
icon: ""
}
ListElement {
name: "Discussion"
isCategory: true
subItems: [
ListElement {
itemId: 2
name: "general" name: "general"
icon: ""
emoji: "👋" emoji: "👋"
},
ListElement {
itemId: 3
name: "help"
icon: ""
color: "" color: ""
colorId: 1 colorId: 1
}
ListElement {
itemId: "4"
isCategory: false
categoryId: "1"
name: "help"
emoji: "⚽" emoji: "⚽"
} color: ""
] colorId: 1
} }
ListElement { ListElement {
name: "Support" itemId: "0"
isCategory: true isCategory: true
categoryId: "2"
subItems: [ name: "support"
emoji: ""
color: ""
colorId: 1
}
ListElement { ListElement {
itemId: 4 itemId: "5"
isCategory: false
categoryId: "2"
name: "faq" name: "faq"
icon: "" emoji: ""
color: "" color: ""
colorId: 5 colorId: 5
}, }
ListElement { ListElement {
itemId: 5 itemId: "6"
isCategory: false
categoryId: "2"
name: "report-scam" name: "report-scam"
icon: "" emoji: ""
color: "" color: ""
colorId: 4 colorId: 4
} }
]
}
ListElement { ListElement {
name: "Empty" itemId: "0"
isCategory: true isCategory: true
subItems: [] categoryId: "3"
name: "faq"
emoji: ""
color: ""
colorId: 5
} }
} }

2
ui/app/AppLayouts/Chat/controls/community/CommunityListItem.qml
View File

@ -20,7 +20,7 @@ StatusListItem {
asset.isLetterIdenticon: true asset.isLetterIdenticon: true
asset.letterSize: 12 asset.letterSize: 12
asset.isImage: model.icon.includes("data") asset.isImage: asset.name.includes("data")
asset.width: 32 asset.width: 32
asset.height: 32 asset.height: 32

75
ui/app/AppLayouts/Chat/controls/community/InDropdown.qml
View File

@ -188,22 +188,44 @@ StatusDropdown {
sourceModel: root.model sourceModel: root.model
filters: AnyOf {
ValueFilter {
roleName: "categoryId"
value: ""
}
ValueFilter {
roleName: "isCategory"
value: true
}
}
sorters: [ sorters: [
RoleSorter { roleName: "isCategory" }, RoleSorter {
RoleSorter { roleName: "position" } roleName: "categoryPosition"
priority: 2 // Higher number === higher priority
},
RoleSorter {
roleName: "position"
priority: 1
}
] ]
} }
ColumnLayout { ColumnLayout {
id: column id: column
Layout.fillWidth: true
spacing: 0
readonly property var topModel: model readonly property var topModel: model
readonly property alias checkBox: loader.item readonly property alias checkBox: loader.item
property int checkedCount: 0 property int checkedCount: 0
readonly property bool isCategory: model.isCategory
readonly property string categoryId: model.categoryId
Layout.fillWidth: true
spacing: 0
visible: { visible: {
if (!model.isCategory) if (!isCategory)
return d.search(model.name, searcher.text) return d.search(model.name, searcher.text)
|| checkBox.checked || checkBox.checked
@ -224,8 +246,8 @@ StatusDropdown {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: d.itemStandardHeight Layout.preferredHeight: d.itemStandardHeight
Layout.topMargin: model.isCategory ? d.defaultVMargin : 0 Layout.topMargin: isCategory ? d.defaultVMargin : 0
sourceComponent: model.isCategory sourceComponent: isCategory
? communityCategoryDelegate ? communityCategoryDelegate
: communityDelegate : communityDelegate
@ -236,7 +258,6 @@ StatusDropdown {
const checkBox = loader.item.checkBox const checkBox = loader.item.checkBox
checkBox.checked = false checkBox.checked = false
checkBox.onToggled() checkBox.onToggled()
} }
} }
@ -248,7 +269,7 @@ StatusDropdown {
title: "#" + model.name title: "#" + model.name
asset.name: model.icon asset.name: model.icon ?? ""
asset.emoji: d.resolveEmoji(model.emoji) asset.emoji: d.resolveEmoji(model.emoji)
asset.color: d.resolveColor(model.color, asset.color: d.resolveColor(model.color,
model.colorId) model.colorId)
@ -283,7 +304,7 @@ StatusDropdown {
title: model.name title: model.name
checkState: { checkState: {
if (checkedCount === model.subItems.count) if (checkedCount === subItems.count)
return Qt.Checked return Qt.Checked
else if (checkedCount === 0) else if (checkedCount === 0)
return Qt.Unchecked return Qt.Unchecked
@ -301,12 +322,31 @@ StatusDropdown {
} }
} }
SortFilterProxyModel {
id: subItems
sourceModel: isCategory ? root.model : null
filters: AllOf {
ValueFilter {
roleName: "categoryId"
value: column.categoryId
}
ValueFilter {
roleName: "isCategory"
value: false
}
}
sorters: RoleSorter {
roleName: "position"
}
}
Repeater { Repeater {
id: subItemsRepeater id: subItemsRepeater
model: SortFilterProxyModel {
sourceModel: topModel.isCategory ? topModel.subItems : null model: subItems
sorters: RoleSorter { roleName: "position" }
}
function setAll(checkState) { function setAll(checkState) {
const subItemsCount = count const subItemsCount = count
@ -319,15 +359,16 @@ StatusDropdown {
CommunityListItem { CommunityListItem {
id: communitySubItem id: communitySubItem
readonly property bool show:
d.search(model.name, searcher.text) || checked
Layout.fillWidth: true Layout.fillWidth: true
readonly property bool show: d.search(model.name, searcher.text)
|| checked
visible: show visible: show
title: "#" + model.name title: "#" + model.name
asset.name: model.icon asset.name: model.icon ?? ""
asset.emoji: d.resolveEmoji(model.emoji) asset.emoji: d.resolveEmoji(model.emoji)
asset.color: d.resolveColor(model.color, asset.color: d.resolveColor(model.color,
model.colorId) model.colorId)