UIUX: Spectrum specific hint on TX overview if there are no transactions (#2246)

* add no_tx_hint method to standard and spectrum node
* add jinja files and include in tx-table (+ renaming there)
* fix cypress test
This commit is contained in:
Manolis Mandrapilias 2023-02-23 11:51:16 +01:00 committed by GitHub
parent ab0325ef0f
commit 6b22700b18
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 31 additions and 27 deletions

View file

@ -16,7 +16,6 @@ describe('Test the UI related to a blockchain rescan', () => {
it('Check that there is no button for a used wallet', () => {
// Only works if the ghost wallet was created with funded option
cy.selectWallet('Ghost wallet')
cy.get('#rescan-hint > p').should('not.be.visible')
cy.get('#rescan-hint > .btn').should('not.be.visible')
cy.get('[data-cy="no-tx-hint"]').should('not.be.visible')
})
})

View file

@ -672,6 +672,10 @@ class Node(AbstractNode):
logger.debug(f"Could not find any wallet file at: {path}")
return wallet_file_removed
def no_tx_hint(self):
"""Returns the path to a template with some basic html and and a hint text to be used in the Transactions tab if there are no transactions"""
return "node/components/no_tx_hint.jinja"
@property
def is_running(self):
if self._network_info["version"] == 999999:

View file

@ -157,27 +157,12 @@
display: flex;
justify-content: center;
}
.rescan-hint {
.no-tx-hint {
display: flex;
flex-direction: column;
align-items: center;
font-size: 1.1em;
}
.go-to-rescan-btn {
max-width: 175px;
margin: 0 0 5px 0;
border: 1px solid var(--cmap-border);
border-radius: 0.5em;
background-color: var(--cmap-border);
padding: 0.8em;
text-align: center;
font-weight: 250;
}
.go-to-rescan-btn:hover {
background-color: var(--cmap-border);
border: 1px solid var(--main-color);
text-decoration: none;
}
.empty-row {
display: table-row;
text-align: center;
@ -308,10 +293,7 @@
<thead id=""table-header>
<tr id="feedback-row" class="hidden">
<td id="feedback-row-content">
<div id="rescan-hint" class="hidden">
<p>{{_('Is this not a fresh wallet? Did you expect transactions here? Then click') }} &#128071; {{_('to find them') }}</p>
<a id="go-to-rescan-btn" href="{{ url_for('wallets_endpoint.settings', wallet_alias=wallet_alias, rescan_blockchain=True) }}" class="go-to-rescan-btn btn">Go to blockchain rescan</a>
</div>
{% include specter.node.no_tx_hint() %}
</td>
</tr>
<tr id="empty-row" class="hidden">
@ -372,7 +354,7 @@
// Feedback row
this.feedbackRow = clone.getElementById('feedback-row');
this.feedbackRowContent = clone.getElementById('feedback-row-content')
this.rescanHint = clone.getElementById('rescan-hint')
this.noTxHint = clone.getElementById('no-tx-hint')
// Empty row
this.emptyRow = clone.getElementById('empty-row')
@ -932,15 +914,15 @@
this.tableHeader.classList.add('hidden');
this.feedbackRow.classList.add('feedback-row');
this.feedbackRow.classList.remove('hidden');
this.rescanHint.classList.remove('hidden')
this.rescanHint.classList.add('rescan-hint')
this.noTxHint.classList.remove('hidden')
this.noTxHint.classList.add('no-tx-hint')
this.pageCount = 1;
} else {
this.tableHeader.classList.remove('hidden');
this.feedbackRow.classList.remove('feedback-row');
this.feedbackRow.classList.add('hidden');
this.rescanHint.classList.remove('rescan-hint')
this.rescanHint.classList.add('hidden');
this.noTxHint.classList.remove('no-tx-hint')
this.noTxHint.classList.add('hidden');
}
// If index is greater than the pages count fetch again for the last page

View file

@ -0,0 +1,8 @@
<div id="no-tx-hint" class="hidden" data-cy="no-tx-hint">
{% if specter.info.get("initialblockdownload") %}
{{_('Wait for your Bitcoin Core node to be fully synced. Check the progess by clicking on the connection.') }}
{% else %}
{{_('Is this not a fresh wallet? Did you expect transactions here? Then click') }} &#128071;
{{_('to find them') }}<a id="go-to-rescan-btn" href="{{ url_for('wallets_endpoint.settings', wallet_alias=wallet_alias, rescan_blockchain=True) }}" class="btn">Go to blockchain rescan</a>
{% endif %}
</div>

View file

@ -217,6 +217,10 @@ class SpectrumNode(AbstractNode):
def node_connection_template(self):
return "spectrum/components/spectrum_node_connection.jinja"
def no_tx_hint(self):
"""Returns the path to a template with some basic html and and a hint text to be used in the Transactions tab if there are no transactions"""
return "spectrum/components/spectrum_no_tx_hint.jinja"
@property
def taproot_support(self):
return False

View file

@ -0,0 +1,7 @@
<div id="no-tx-hint" class="hidden">
{% if specter.info.get("initialblockdownload") %}
{{_('Wait for Spectrum to be fully synced. Check the progess by clicking on the connection.') }}
{% else %}
{{_('No transactions yet') }}
{% endif %}
</div>