status-desktop/ui/app/AppLayouts/CommunitiesPortal/views/CommunitiesGridView.qml

121 lines
2.8 KiB
QML
Raw Normal View History

import QtQuick 2.13
import QtQuick.Layouts 1.13
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import utils 1.0
import SortFilterProxyModel 0.2
StatusScrollView {
id: root
property var locale
property var model
property bool searchLayout: false
signal cardClicked(string communityId)
clip: false
QtObject {
id: d
// values from the design
readonly property int scrollViewTopMargin: 20
readonly property int subtitlePixelSize: 17
}
SortFilterProxyModel {
id: featuredModel
sourceModel: root.model
filters: ValueFilter {
roleName: "featured"
value: true
}
}
SortFilterProxyModel {
id: popularModel
sourceModel: root.model
filters: ValueFilter {
roleName: "featured"
value: false
}
}
Component {
id: communityCardDelegate
StatusCommunityCard {
locale: root.locale
communityId: model.communityId
loaded: model.available
logo: model.icon
banner: model.banner
name: model.name
description: model.description
members: model.members
popularity: model.popularity
// <out of scope> categories: model.categories
onClicked: root.cardClicked(communityId)
}
}
ColumnLayout {
id: contentColumn
StatusBaseText {
id: featuredLabel
visible: !root.searchLayout
Layout.topMargin: d.scrollViewTopMargin
text: qsTr("Featured")
font.weight: Font.Bold
font.pixelSize: d.subtitlePixelSize
color: Theme.palette.directColor1
}
GridLayout {
Layout.topMargin: root.searchLayout
? featuredLabel.height + contentColumn.spacing + featuredLabel.Layout.topMargin
: 0
columns: 3
columnSpacing: Style.current.padding
rowSpacing: Style.current.padding
Repeater {
model: root.searchLayout ? root.model : featuredModel
delegate: communityCardDelegate
}
}
StatusBaseText {
visible: !root.searchLayout
Layout.topMargin: 20
text: qsTr("Popular")
font.weight: Font.Bold
font.pixelSize: d.subtitlePixelSize
color: Theme.palette.directColor1
}
GridLayout {
visible: !root.searchLayout
columns: 3
columnSpacing: Style.current.padding
rowSpacing: Style.current.padding
Repeater {
model: popularModel
delegate: communityCardDelegate
}
}
}
}