GlcoinCore/specter-desktop
1
0
Fork 0
mirror of https://github.com/cryptoadvance/specter-desktop.git synced 2026-08-13 12:33:29 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

UIUX: change rbf popup if spectrum connection is used (#2203)

Browse source
This commit is contained in:
Manolis Mandrapilias 2023-02-14 18:49:33 +01:00 • committed by GitHub
parent 5f6d1bcada
commit 995e8ab7f0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 35 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

62
src/cryptoadvance/specter/templates/includes/tx-row.html
View file

@ -410,34 +410,42 @@
}
// TODO: get fee diff from specter
newFee += 2;
txDataPopup.innerHTML = `
<div class="bg-dark-800 p-4 rounded-lg">
<form action="${url}" method="POST">
<h1>${rbfType == 'cancel' ? '{{ _("Cancel") }}' : '{{ _("Speed up transaction") }}'}</h1>
<p>{{ _("You can") }} ${rbfType == 'cancel' ? `{{ _("cancel") }}` : `{{ _("speed up") }}`} {{ _("the transaction by increasing its fee rate") }}${rbfType == 'cancel' ? ` {{ _("and sending the funds back to yourself") }}` : ''}:</p>
<input type="hidden" name="rbf_tx_id" value='${this.tx.txid}' />
<input type="number" min="${newFee}" value="${newFee}" class="fee_rate" name="rbf_fee_rate" id="rbf_fee_rate" min="1" step="any" autocomplete="off" required> sat/vbyte
<input type="hidden" class="csrf-token" name="csrf_token" value="{{ csrf_token() }}"/>
<button class="button mt-2 bg-accent" type="submit" name="action" value="${rbfType == 'cancel' ? 'rbf_cancel' : 'rbf'}" ${rbfType == 'cancel' ? 'danger' : ''}">${rbfType == 'cancel' ? `{{ _("Cancel transaction") }}` : `{{ _("Speed up!") }}`}</button>
<span class="toggle_advanced_rbf cursor-pointer">{{ _("Advanced") }} {% if show_advanced_settings %}&#9660;{% else %}&#9654;{% endif %}</span>
<div class="advanced_rbf hidden warning flex flex-col">
<button class="button mt-2" type="submit" name="action" value="rbf_edit">{{ _("Fully edit the transaction") }}</button>
</div>
</form>
</div>
`;
txDataPopup.querySelector('.toggle_advanced_rbf').onclick = () => {
let advancedButton = txDataPopup.querySelector('.toggle_advanced_rbf')
let advancedSettings = txDataPopup.querySelector('.advanced_rbf')
if (advancedSettings.classList.contains('hidden')) {
advancedSettings.classList.remove('hidden')
advancedButton.innerHTML = `{{ _("Advanced") }} &#9660;`;
} else {
advancedSettings.classList.add('hidden')
advancedButton.innerHTML = `{{ _("Advanced") }} &#9654;`;
txDataPopup.innerHTML =
`{% if specter.node.alias == "spectrum_node" %}
<div class="bg-dark-800 p-4 rounded-lg">
<h1>RBF not supported yet with Spectrum</h1>
<p>If you have to use RBF, you still can. Your transactions have the RBF flag and you can use Specter with Bitcoin Core to speed up or cancel.</p>
</div>
{% else %}
<div class="bg-dark-800 p-4 rounded-lg">
<form action="${url}" method="POST">
<h1>${rbfType == 'cancel' ? '{{ _("Cancel") }}' : '{{ _("Speed up transaction") }}'}</h1>
<p>{{ _("You can") }} ${rbfType == 'cancel' ? `{{ _("cancel") }}` : `{{ _("speed up") }}`} {{ _("the transaction by increasing its fee rate") }}${rbfType == 'cancel' ? ` {{ _("and sending the funds back to yourself") }}` : ''}:</p>
<input type="hidden" name="rbf_tx_id" value='${this.tx.txid}' />
<input type="number" min="${newFee}" value="${newFee}" class="fee_rate" name="rbf_fee_rate" id="rbf_fee_rate" min="1" step="any" autocomplete="off" required> sat/vbyte
<input type="hidden" class="csrf-token" name="csrf_token" value="{{ csrf_token() }}"/>
<button class="button mt-2 bg-accent" type="submit" name="action" value="${rbfType == 'cancel' ? 'rbf_cancel' : 'rbf'}" ${rbfType == 'cancel' ? 'danger' : ''}">${rbfType == 'cancel' ? `{{ _("Cancel transaction") }}` : `{{ _("Speed up!") }}`}</button>
<span class="toggle_advanced_rbf cursor-pointer">{{ _("Advanced") }} {% if show_advanced_settings %}&#9660;{% else %}&#9654;{% endif %}</span>
<div class="advanced_rbf hidden warning flex flex-col">
<button class="button mt-2" type="submit" name="action" value="rbf_edit">{{ _("Fully edit the transaction") }}</button>
</div>
</form>
</div>
{% endif %}`;
let advanceToggle = txDataPopup.querySelector('.toggle_advanced_rbf')
if (advanceToggle) {
txDataPopup.querySelector('.toggle_advanced_rbf').onclick = () => {
let advancedButton = txDataPopup.querySelector('.toggle_advanced_rbf')
let advancedSettings = txDataPopup.querySelector('.advanced_rbf')
if (advancedSettings.classList.contains('hidden')) {
advancedSettings.classList.remove('hidden')
advancedButton.innerHTML = `{{ _("Advanced") }} &#9660;`;
} else {
advancedSettings.classList.add('hidden')
advancedButton.innerHTML = `{{ _("Advanced") }} &#9654;`;
}
}
}
}
showPageOverlay('tx-popup');
}