Browse Source

change condition to hide item instead of full comp

qchat-updates
Phillip Lang Martinez 2 years ago
parent
commit
cdca394684
  1. 19
      qortal-ui-core/src/components/sidenav-menu.js
  2. 3
      qortal-ui-core/src/functional-components/side-menu-item-style.js
  3. 5
      qortal-ui-core/src/functional-components/side-menu-item.js

19
qortal-ui-core/src/components/sidenav-menu.js

@ -74,7 +74,7 @@ class SidenavMenu extends connect(store)(LitElement) {
async getNodeType() { async getNodeType() {
const myNode = const myNode =
store.getState().app.nodeConfig.knownNodes[ store.getState().app.nodeConfig.knownNodes[
store.getState().app.nodeConfig.node store.getState().app.nodeConfig.node
]; ];
const nodeUrl = const nodeUrl =
myNode.protocol + '://' + myNode.domain + ':' + myNode.port; myNode.protocol + '://' + myNode.domain + ':' + myNode.port;
@ -132,28 +132,29 @@ class SidenavMenu extends connect(store)(LitElement) {
expanded expanded
> >
<vaadin-icon icon="vaadin:info-circle" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:info-circle" slot="icon"></vaadin-icon>
${isMinter <side-menu-item
? html`<side-menu-item
label="${translate('sidemenu.mintingdetails')}" label="${translate('sidemenu.mintingdetails')}"
href="/app/minting" href="/app/minting"
?hide=${!isMinter}
> >
<vaadin-icon icon="vaadin:info-circle" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:info-circle" slot="icon"></vaadin-icon>
</side-menu-item>` </side-menu-item>
: html`<side-menu-item <side-menu-item
label="${translate('sidemenu.becomeAMinter')}" label="${translate('sidemenu.becomeAMinter')}"
href="/app/become-minter" href="/app/become-minter"
?hide=${isMinter}
> >
<vaadin-icon icon="vaadin:thumbs-up" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:thumbs-up" slot="icon"></vaadin-icon>
</side-menu-item>` </side-menu-item>
}
${isSponsor ? html`
<side-menu-item <side-menu-item
label="${translate('mintingpage.mchange35')}" label="${translate('mintingpage.mchange35')}"
href="/app/sponsorship-list" href="/app/sponsorship-list"
?hide=${!isSponsor}
> >
<vaadin-icon icon="vaadin:list-ol" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:list-ol" slot="icon"></vaadin-icon>
</side-menu-item> </side-menu-item>
` : ''}
</side-menu-item> </side-menu-item>
<side-menu-item <side-menu-item
label="${translate('sidemenu.wallets')}" label="${translate('sidemenu.wallets')}"

3
qortal-ui-core/src/functional-components/side-menu-item-style.js

@ -47,6 +47,9 @@ export const sideMenuItemStyle = css`
border-bottom: 1px solid var(--item-border-color); border-bottom: 1px solid var(--item-border-color);
text-transform: uppercase; text-transform: uppercase;
} }
.hideItem {
display: none !important;
}
#itemLink:hover { #itemLink:hover {
background-color: var(--item-color-hover); background-color: var(--item-color-hover);

5
qortal-ui-core/src/functional-components/side-menu-item.js

@ -13,7 +13,8 @@ export class SideMenuItem extends LitElement {
expanded: { type: Boolean, reflect: true }, expanded: { type: Boolean, reflect: true },
compact: { type: Boolean, reflect: true }, compact: { type: Boolean, reflect: true },
href: { type: String, reflect: true }, href: { type: String, reflect: true },
target: { type: String, reflect: true } target: { type: String, reflect: true },
hide: { type: Boolean }
} }
} }
@ -27,6 +28,7 @@ export class SideMenuItem extends LitElement {
super() super()
this.selected = false this.selected = false
this.expanded = false this.expanded = false
this.hide = false
} }
render() { render() {
@ -53,6 +55,7 @@ export class SideMenuItem extends LitElement {
href=${this.href || '#!'} href=${this.href || '#!'}
@click="${(e) => this._onClick(e)}" @click="${(e) => this._onClick(e)}"
target=${ifDefined(this.target)} target=${ifDefined(this.target)}
class=${this.hide ? 'hideItem' : ''}
> >
<slot class="icon" name="icon"></slot> <slot class="icon" name="icon"></slot>
<div id ="content"> <div id ="content">

Loading…
Cancel
Save