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: style account button if connected

This commit is contained in:
Jonathan Rainville 2020-10-19 16:26:16 -04:00 committed by Iuri Matias
parent 4d2a845eda
commit b4425322ac
4 changed files with 87 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
ui/app/AppLayouts/Browser/BrowserConnectionModal.qml
View File

@ -8,6 +8,7 @@ Popup {
property var currentTab
property var request: ({"hostname": "", "title": "", "permission": ""})
property string currentAddress: ""
property bool interactedWith: false
id: root
modal: true
@ -24,16 +25,20 @@ Popup {
padding: 0
function postMessage(isAllowed){
interactedWith = true
request.isAllowed = isAllowed;
currentTabConnected = isAllowed
provider.web3Response(web3Provider.postMessage(JSON.stringify(request)));
}
onClosed: {
if(!interactedWith){
currentTabConnected = false
postMessage(false);
}
root.destroy();
}
// TODO: design required
ColumnLayout {
anchors.left: parent.left
anchors.leftMargin: Style.current.smallPadding
@ -84,7 +89,7 @@ Popup {
source: "../../img/walletIcon.svg"
iconHeight: 18
iconWidth: 18
iconColor: Style.current.primary // TODO use wallet color
iconColor: accountSelector.selectedAccount.iconColor || Style.current.primary
color: Style.current.background
width: logoHeader.imgSize
height: logoHeader.imgSize
@ -141,9 +146,9 @@ Popup {
id: infoText
text: {
switch(request.permission){
case Constants.permission_web3: return qsTr("Allowing authorizes this DApp to retrieve your wallet address and enable Web3");
case Constants.permission_contactCode: return qsTr("Granting access authorizes this DApp to retrieve your chat key");
default: return qsTr("Unknown permission: " + request.permission);
case Constants.permission_web3: return qsTr("Allowing authorizes this DApp to retrieve your wallet address and enable Web3");
case Constants.permission_contactCode: return qsTr("Granting access authorizes this DApp to retrieve your chat key");
default: return qsTr("Unknown permission: " + request.permission);
}
}
Layout.fillWidth: true

53
ui/app/AppLayouts/Browser/BrowserHeader.qml
View File

@ -130,19 +130,50 @@ Rectangle {
x: parent.width - width - Style.current.halfPadding
}
StatusIconButton {
id: accountBtn
icon.name: "walletIcon"
onClicked: {
if (browserWalletMenu.opened) {
browserWalletMenu.close()
} else {
browserWalletMenu.open()
Loader {
active: true
sourceComponent: currentTabConnected ? connectedBtnComponent : notConnectedBtnCompoent
}
Component {
id: notConnectedBtnCompoent
StatusIconButton {
id: accountBtn
icon.name: "walletIcon"
onClicked: {
if (browserWalletMenu.opened) {
browserWalletMenu.close()
} else {
browserWalletMenu.open()
}
}
width: 24
height: 24
padding: 6
}
}
Component {
id: connectedBtnComponent
StatusButton {
id: accountBtnConnected
icon.source: "../../img/walletIcon.svg"
icon.width: 18
icon.height: 18
icon.color: walletModel.currentAccount.iconColor
text: walletModel.currentAccount.name
implicitHeight: 32
type: "secondary"
onClicked: {
if (browserWalletMenu.opened) {
browserWalletMenu.close()
} else {
browserWalletMenu.open()
}
}
}
width: 24
height: 24
padding: 6
}
Menu {

4
ui/app/AppLayouts/Browser/BrowserLayout.qml
View File

@ -25,6 +25,7 @@ Rectangle {
property Component browserDialogComponent: BrowserDialog {
onClosing: destroy()
}
property bool currentTabConnected: false
Layout.fillHeight: true
@ -91,10 +92,12 @@ Rectangle {
if (request.type === Constants.api_request) {
if (!_web3Provider.hasPermission(request.hostname, request.permission)) {
browserWindow.currentTabConnected = false
var dialog = accessDialogComponent.createObject(browserWindow);
dialog.request = request;
dialog.open();
} else {
browserWindow.currentTabConnected = true
request.isAllowed = true;
web3Response(_web3Provider.postMessage(JSON.stringify(request)));
}
@ -373,7 +376,6 @@ Rectangle {
BrowserHeader {
id: browserHeader
anchors.top: parent.top
// TODO Replace with tab height
anchors.topMargin: tabs.tabHeight + tabs.anchors.topMargin
z: 52
}

32
ui/shared/status/StatusButton.qml
View File

@ -1,6 +1,7 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQml 2.14
import QtGraphicalEffects 1.13
import "../../imports"
import "../../shared"
@ -9,16 +10,45 @@ Button {
property string size: "large"
property string state: "default"
property color color: Style.current.buttonForegroundColor
property int iconRotation: 0
id: control
font.pixelSize: size === "small" ? 13 : 15
font.weight: Font.Medium
implicitHeight: size === "small" ? 38 : 44
implicitWidth: buttonLabel.implicitWidth + 2 * Style.current.padding
implicitWidth: buttonLabel.implicitWidth + 2 * Style.current.padding +
(iconLoader.active ? iconLoader.width : 0)
enabled: state === "default"
contentItem: Item {
anchors.fill: parent
Loader {
id: iconLoader
active: !!control.icon && !!control.icon.source
anchors.left: parent.left
anchors.leftMargin: Style.current.halfPadding
anchors.verticalCenter: parent.verticalCenter
sourceComponent: SVGImage {
id: iconImg
source: control.icon.source
height: control.icon.height
width: control.icon.width
fillMode: Image.PreserveAspectFit
rotation: control.iconRotation
ColorOverlay {
anchors.fill: iconImg
source: iconImg
color: control.icon.color
antialiasing: true
smooth: true
rotation: control.iconRotation
}
}
}
Text {
id: buttonLabel
text: control.text