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

feat(storybook): Added `CommunityPermissionsSettingsPanel` 

- Added `CommunityPermissionsSettingsPanel`.

- Created panel item editor and basic panel editor layout for `CommunityPermissionsSettingsPanelPage`. Still not linked to a model.

- Added mocked data for collectibles and tokens.

- Created `ChannelsModel` mocked data.

- Added edit / duplicate / remove signals logs.
This commit is contained in:
Noelia 2022-11-24 17:23:54 +01:00 committed by Noelia
parent 1cbb3e2ad3
commit 1db0a0077d
12 changed files with 377 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
storybook/PagesModel.qml
View File

@ -37,6 +37,10 @@ ListModel {
title: "UserListPanel"
section: "Panels"
}
ListElement {
title: "CommunityPermissionsSettingsPanel"
section: "Panels"
}
ListElement {
title: "InviteFriendsToCommunityPopup"
section: "Popups"

5
storybook/figma.json
View File

@ -55,5 +55,10 @@
"StatusCommunityCard": [
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=8159%3A416159",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=8159%3A416160"
],
"CommunityPermissionsSettingsPanel": [
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2992%3A367890&t=IfHHp5GSPo1j9m5j-0",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A480020&t=IfHHp5GSPo1j9m5j-0",
"https://www.figma.com/file/17fc13UBFvInrLgNUKJJg5/Kuba%E2%8E%9CDesktop?node-id=2934%3A484715&t=IfHHp5GSPo1j9m5j-0"
]
}

109
storybook/pages/CommunityPermissionsSettingItemEditor.qml Normal file
View File

@ -0,0 +1,109 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import Storybook 1.0
import Models 1.0
ColumnLayout {
id: root
property string panelText
property string name
property url icon
property double amount
property bool isAmountVisible: false
property bool isENS
property bool isENSVisible: false
property bool isExpression: false
property bool isAnd: true
Label {
Layout.fillWidth: true
text: root.panelText
font.weight: Font.Bold
}
RowLayout {
Layout.fillWidth: true
Layout.preferredHeight: 50
Rectangle {
border.color: 'gray'
Layout.fillWidth: true
Layout.fillHeight: true
Image {
anchors.fill: parent
anchors.margins: 1
fillMode: Image.PreserveAspectFit
source: root.icon
}
MouseArea {
anchors.fill: parent
onClicked: iconSelector.open()
ImageSelectPopup {
id: iconSelector
parent: root
anchors.centerIn: parent
width: parent.width * 0.8
height: parent.height * 0.8
model: IconModel {}
onSelected: {
root.icon = icon
close()
}
}
}
}
}
ColumnLayout {
Label {
Layout.fillWidth: true
text: "Type"
}
TextField {
Layout.fillWidth: true
text: root.name
onTextChanged: root.name = text
}
}
ColumnLayout {
visible: root.isAmountVisible
Label {
Layout.fillWidth: true
text: "Amount"
}
TextField {
Layout.fillWidth: true
text: root.amount
onTextChanged: root.amount = text
}
}
CheckBox {
visible: root.isENSVisible
text: "Is ENS name"
checked: root.isENS
onToggled: root.isENS = checked
}
Switch {
visible: root.isExpression
text: "OR -- AND"
checked: root.isAnd
onToggled: root.isAnd = checked
}
Button {
Layout.fillWidth: true
text: "Add"
}
}

46
storybook/pages/CommunityPermissionsSettingsPanelEditor.qml Normal file
View File

@ -0,0 +1,46 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import Storybook 1.0
import Models 1.0
ScrollView {
id: root
property var model
ScrollBar.vertical: ScrollBar { x: root.width }
ColumnLayout {
spacing: 25
CommunityPermissionsSettingItemEditor {
panelText: "Who holds"
name: "Socks"
icon: ""
amount: 11.2
isAmountVisible: true
isENS: false
isENSVisible: true
isExpression: true
isAnd: true
}
CommunityPermissionsSettingItemEditor {
panelText: "Is allowed to"
name: "Moderate"
icon: ""
}
CommunityPermissionsSettingItemEditor {
panelText: "In"
name: "#general"
icon: ""
}
CheckBox {
text: "Permission is private"
checked: true//model.isPrivate
//onToggled: model.isPrivate = checked
}
}
}

54
storybook/pages/CommunityPermissionsSettingsPanelPage.qml Normal file
View File

@ -0,0 +1,54 @@
import QtQuick 2.14
import QtQuick.Controls 2.14
import AppLayouts.Chat.panels.communities 1.0
import AppLayouts.Chat.stores 1.0
import Storybook 1.0
import Models 1.0
SplitView {
Logs { id: logs }
SplitView {
orientation: Qt.Vertical
SplitView.fillWidth: true
Item {
SplitView.fillWidth: true
SplitView.fillHeight: true
CommunityPermissionsSettingsPanel {
anchors {
fill: parent
topMargin: 50
}
store: CommunitiesStore {
tokensModel: TokensModel {}
collectiblesModel: CollectiblesModel {}
channelsModel: ChannelsModel {}
function editPermission(index) {
logs.logEvent("CommunitiesStore::editPermission - index: " + index)
}
function duplicatePermission(index) {
logs.logEvent("CommunitiesStore::duplicatePermission - index: " + index)
}
function removePermission(index) {
logs.logEvent("CommunitiesStore::removePermission - index: " + index)
}
}
}
}
LogsAndControlsPanel {
id: logsAndControlsPanel
SplitView.minimumHeight: 100
SplitView.preferredHeight: 150
logsView.logText: logs.logText
}
}
}

17
storybook/src/Models/ChannelsModel.qml Normal file
View File

@ -0,0 +1,17 @@
import QtQuick 2.0
ListModel {
Component.onCompleted:
append([
{
key: "wellcome",
iconSource: ModelsData.tokens.inch,
name: "#wellcome"
},
{
key: "general",
iconSource: ModelsData.tokens.inch,
name: "#general"
}
])
}

63
storybook/src/Models/CollectiblesModel.qml Normal file
View File

@ -0,0 +1,63 @@
import QtQuick 2.0
ListModel {
Component.onCompleted:
append([
{
key: "Anniversary",
iconSource: ModelsData.collectibles.anniversary,
name: "Anniversary",
category: "Community collectibles"
},
{
key: "CryptoKitties",
iconSource: ModelsData.collectibles.cryptoKitties,
name: "CryptoKitties",
category: "Your collectibles",
subItems: [
{
key: "Kitty1",
iconSource: ModelsData.collectibles.kitty1,
imageSource: ModelsData.collectibles.kitty1Big,
name: "Furbeard"
},
{
key: "Kitty2",
iconSource: ModelsData.collectibles.kitty2,
imageSource: ModelsData.collectibles.kitty2Big,
name: "Magicat"
},
{
key: "Kitty3",
iconSource: ModelsData.collectibles.kitty3,
imageSource: ModelsData.collectibles.kitty3Big,
name: "Happy Meow"
},
{
key: "Kitty4",
iconSource: ModelsData.collectibles.kitty4,
imageSource: ModelsData.collectibles.kitty4Big,
name: "Furbeard-2"
},
{
key: "Kitty5",
iconSource: ModelsData.collectibles.kitty5,
imageSource: ModelsData.collectibles.kitty5Big,
name: "Magicat-3"
}
]
},
{
key: "SuperRare",
iconSource: ModelsData.collectibles.superRare,
name: "SuperRare",
category: "Your collectibles"
},
{
key: "Custom",
iconSource: ModelsData.collectibles.custom,
name: "Custom Collectible",
category: "All collectibles"
}
])
}

31
storybook/src/Models/ModelsData.qml
View File

@ -1,6 +1,7 @@
pragma Singleton
import QtQuick 2.14
import utils 1.0
QtObject {
readonly property QtObject icons: QtObject {
@ -30,4 +31,34 @@ QtObject {
"Health":"🧠","Hobby":"📐","Innovation":"🧪","Language":"📜","Lifestyle":"✨","Local":"📍","Love":"❤️","Markets":"💎","Movies & TV":"🎞","Music":"🎶","NFT":"🖼","NSFW":"🍆",
"News":"🗞","Non-profit":"🙏","Org":"🏢","Pets":"🐶","Play":"🎲","Podcast":"🎙️","Politics":"🗳️","Privacy":"👻","Product":"🍱","Psyche":"🍁","Security":"🔒","Social":"☕",
"Software dev":"👩‍💻","Sports":"⚽️","Tech":"📱","Travel":"🗺","Vehicles":"🚕","Web3":"🌐"})
readonly property QtObject tokens: QtObject {
readonly property string socks: Style.png("tokens/SOCKS")
readonly property string zrx: Style.png("tokens/ZRX")
readonly property string inch: Style.png("tokens/CUSTOM-TOKEN")
readonly property string aave: Style.png("tokens/CUSTOM-TOKEN")
readonly property string amp: Style.png("tokens/CUSTOM-TOKEN")
}
readonly property QtObject collectibles: QtObject {
readonly property string anniversary: Style.png("collectibles/Anniversary")
readonly property string cryptoKitties: Style.png("collectibles/CryptoKitties")
readonly property string kitty1: Style.png("collectibles/Furbeard")
readonly property string kitty1Big: Style.png("collectibles/FurbeardBig")
readonly property string kitty2: Style.png("collectibles/Magicat")
readonly property string kitty2Big: Style.png("collectibles/MagicatBig")
readonly property string kitty3: Style.png("collectibles/HappyMeow")
readonly property string kitty3Big: Style.png("collectibles/HappyMeowBig")
readonly property string kitty4: Style.png("collectibles/Furbeard")
readonly property string kitty4Big: Style.png("collectibles/FurbeardBig")
readonly property string kitty5: Style.png("collectibles/Magicat")
readonly property string kitty5Big: Style.png("collectibles/MagicatBig")
readonly property string superRare: Style.png("collectibles/SuperRare")
readonly property string custom: Style.png("collectibles/SNT")
}
}

42
storybook/src/Models/TokensModel.qml Normal file
View File

@ -0,0 +1,42 @@
import QtQuick 2.0
ListModel {
Component.onCompleted:
append([
{
key: "socks",
iconSource: ModelsData.tokens.socks,
name: "Unisocks",
shortName: "SOCKS",
category: "Community tokens"
},
{
key: "zrx",
iconSource: ModelsData.tokens.zrx,
name: "Ox",
shortName: "ZRX",
category: "Listed tokens"
},
{
key: "1inch",
iconSource: ModelsData.tokens.inch,
name: "1inch",
shortName: "ZRX",
category: "Listed tokens"
},
{
key: "Aave",
iconSource: ModelsData.tokens.aave,
name: "Aave",
shortName: "AAVE",
category: "Listed tokens"
},
{
key: "Amp",
iconSource: ModelsData.tokens.amp,
name: "Amp",
shortName: "AMP",
category: "Listed tokens"
}
])
}

3
storybook/src/Models/qmldir
View File

@ -2,3 +2,6 @@ singleton ModelsData 1.0 ModelsData.qml
IconModel 1.0 IconModel.qml
BannerModel 1.0 BannerModel.qml
UsersModel 1.0 UsersModel.qml
TokensModel 1.0 TokensModel.qml
CollectiblesModel 1.0 CollectiblesModel.qml
ChannelsModel 1.0 ChannelsModel.qml

1
ui/app/AppLayouts/Chat/panels/communities/qmldir
View File

@ -1,2 +1,3 @@
CommunityProfilePopupInviteFriendsPanel 1.0 CommunityProfilePopupInviteFriendsPanel.qml
CommunityProfilePopupInviteMessagePanel 1.0 CommunityProfilePopupInviteMessagePanel.qml
CommunityPermissionsSettingsPanel 1.0 CommunityPermissionsSettingsPanel.qml

3
ui/app/AppLayouts/Chat/stores/qmldir
View File

@ -1,3 +1,4 @@
StickerData 1.0 StickerData.qml
StickerPackData 1.0 StickerPackData.qml
StickersStore 1.0 StickersStore.qml
StickersStore 1.0 StickersStore.qml
CommunitiesStore 1.0 CommunitiesStore.qml