Add "Buy BSQ" button next to trade fee selector #5055

Jakub-CZ · 2021-01-04T23:53:43Z

New button is added in the CREATE OFFER and TAKE OFFER tabs. When clicked, it shows a popup and then brings the user to the Sell Offer Book (SELL BITCOIN), with BSQ preselected in the currency filter.

The button is visible only when the fee currency toggles are visible (relevant in the CREATE OFFER tab).

Screenshots

start creating or take any offer ->

-> click "BUY BSQ" ->

-> click "BUY BSQ" in popup ->

Situations when the button is clicked (unchecked are still buggy):

user is creating/taking offer to BUY BTC, and under SELL BTC the tab "CREATE OFFER" is not active (it may be open but not selected);
user is creating/taking offer to BUY BTC, and under SELL BTC the active tab is "CREATE OFFER";
user is creating offer to SELL BTC;
user is taking offer to SELL BTC.

TODOs from discussion below:

close the current tab instead of just navigating away from it to the Offer Book;
don't display the button when the BSQ balance is already high enough.

Known bug:

Certain combination of the source and destination views may cause the "Filter by currency" combo box to receive focus, clearing it as a result. At that point, the value "BSQ" is still in effect, but any user action after that clears the filter. (More on that in the comments below.)

Discussion:

If CREATE OFFER to SELL BTC is already open, user will be unable to create an offer, as the button CREATE NEW OFFER TO BUY BSQ will be disabled. There is no indication why. A tooltip explaining why it's disabled may be helpful.
Should the popup include the "don't remind me again" option?
Should we hide the button when we're creating/taking an offer to trade BTC for BSQ already?
Having to create an altcoin account for BSQ seems like an unnecessary step. Can we have a built-in BSQ account, ideally one that will update the address to the next unused one dynamically?

Conza88 · 2021-01-05T00:43:02Z

Can we please add link to wiki on bsq etc?
So folks can easily see trading value of purchasing etc

Jakub-CZ · 2021-01-05T00:55:15Z

I've been trying to resolve the combo box focus issue for a long time, with not much success. I tried the following:

disable the combo box temporarily,
disable the focus listener of the combo box temporarily, or setFocusTraversable(false),
requestFocus() on another element, right around the time the tab switching takes place (this resolved only some cases, mostly the 2nd item in my checkbox list above),
and much more.

These either had no effect, or caused the combo box not to reflect sellScreenCurrencyCode in Preferences.

Also, when the combo box receives focus, it's probably happening too early, as indicated by the fact that the drop-down list is rendered incorrectly - it's shifted to the left:

Some options that I see:

carefuly rework AutocompleteComboBox. Instead of relying on onFocus, use onClick; I tried that already, but then the value in the combo box wasn't in line with sellScreenCurrencyCode in Preferences.
instead of clearing the value when focused, just select the contents of the edit text field; thus, the previous value will not be lost, and users can still very easily filter by typing right away.

Jakub-CZ · 2021-01-05T01:01:33Z

Can we please add link to wiki on bsq etc?
So folks can easily see trading value of purchasing etc

This one? https://bisq.wiki/Trading_fees

Is this not enough?

Conza88 · 2021-01-05T01:06:33Z

Yeah that one. Just in the pop-up I think. Guides folks to wiki if they want to know benefits etc. I think ideally should have bsq amount somewhere more prominent.

…

________________________________ From: Jakub Loucký <notifications@github.com> Sent: Tuesday, January 5, 2021 11:01:47 AM To: bisq-network/bisq <bisq@noreply.github.com> Cc: Conza <conza_@hotmail.com>; Comment <comment@noreply.github.com> Subject: Re: [bisq-network/bisq] Add "Buy BSQ" button next to trade fee selector (#5055) Can we please add link to wiki on bsq etc? So folks can easily see trading value of purchasing etc This one? https://bisq.wiki/Trading_fees Is this not enough? [image]<https://user-images.githubusercontent.com/16313562/103594500-233dad80-4ef9-11eb-8bd6-2b0db7b2cb1a.png> — You are receiving this because you commented. Reply to this email directly, view it on GitHub<#5055 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AMMLWYRWCCXYG2JZMDJHI5LSYJQHXANCNFSM4VT2J6CQ>.

pazza83 · 2021-01-05T01:37:29Z

@Jakub-CZ looks great.

I had a read but not sure what happens when they click the 'Buy BSQ' button?

Are they taken to the Buy > BSQ/BTC market?

Jakub-CZ · 2021-01-05T01:46:11Z

Yep, except it's Sell, as in "selling BTC for BSQ".

I've added the final screenshot in the description at the top.

pazza83 · 2021-01-05T02:16:20Z

Thanks, that is great. Hopefully will get more new users to buy some BSQ :)

chimp1984 · 2021-01-07T04:54:19Z

I had a quick look, but did not see anything obvious which could cause the problems you described. Would need to debug locally but too busy atm...

Conza88 · 2021-01-07T09:13:29Z

I really think these concerns need to be addressed before sending shiteload more people to buy bsq: #5046

sqrrm · 2021-01-13T09:39:06Z

For the case where someone is selling BTC I think the current sale tab needs to be closed and a new one opened for buying BSQ since there can only be one BTC sell tab open. That could perhaps be a bit confusing but I think allowing for multiple create offer tabs would be more trouble. Perhaps include a warning that the current BTC sell tab will be closed in the popup as well for that case.

Auto creating a BSQ account is reasonable and something I did for the not yet completed atomic BSQ trades. It's a bit more problematic for the current model as the receive address needs to be available throughout the trade process and our current model expects 1 single address per account. I think we could create a BSQ account with the first unused BSQ address if there is no other BSQ account. That would make it somewhat easier to get started with BSQ in the current state.

@Jakub-CZ I can't give any input on the UI elements not aligning and the focus, @ripcurlx knows that best I think.

ripcurlx

I think having on the small green button Buy BSQ might confuse noobs what will happen if they click on this.
Maybe it should be something more like Get BSQ or How to get BSQ 👈 @m52go ?
We could use this popup afterwards not only to push the user to buy BSQ, but also show the possibility to earn BSQ by contributing.

Maybe we could also only show the Buy BSQ button if the trade has insufficient funds to pay the trading fee with BSQ.

Regarding the combobox question. So the goal is to open the offer book to sell BTC and have all BSQ offers selected? Atm it switches to the offer book setting the focus in the currency combobox.

For the case where someone is selling BTC I think the current sale tab needs to be closed and a new one opened for buying BSQ since there can only be one BTC sell tab open. That could perhaps be a bit confusing but I think allowing for multiple create offer tabs would be more trouble. Perhaps include a warning that the current BTC sell tab will be closed in the popup as well for that case.

That is the current behavior. It will just replace the current Take offer tab that was used for selling BTC in the first place. Maybe we just add a don't show again popup if a user is trying to take different offers to reduce confusion where the old take offer tab vanished to.

ripcurlx · 2021-01-13T09:52:55Z

desktop/src/main/java/bisq/desktop/main/offer/OfferViewUtil.java

+        String buyBsqText = Res.get("shared.buyCurrency", "BSQ");
+        var buyBsqButton = new AutoTooltipButton(buyBsqText);
+        buyBsqButton.getStyleClass().add("action-button");
+        buyBsqButton.setStyle("-fx-pref-height: 20; -fx-padding: 3 8 3 8; -fx-font-size: 0.769em; -fx-border-radius: 5;");


Please move this into the css file and use another class instead.

Jakub-CZ · 2021-01-13T10:55:53Z

@sqrrm
I thought about closing the tab as well, but it might be annoying to the user if they already filled in some of the fields (the button doesn't appear until at least the volume is filled in). Adding

Also, closing the tab may get around the UI issue I'm having right now.

@ripcurlx

Regarding the combobox question. So the goal is to open the offer book to sell BTC and have all BSQ offers selected? Atm it switches to the offer book setting the focus in the currency combobox.

Yes, that is the goal. The fact that it focuses on the currency combobox is an unintended side effect of the current design. Looks like the Offer Book view gets invalidated as a result of switching from Take Offer. I don't know why the same doesn't happed when switching from BUY BTC.

only show the Buy BSQ button if the trade has insufficient funds

Good idea. Will look into that.

wallclockbuilder

UtAck

Conza88 · 2021-03-15T00:08:35Z

I think having on the small green button Buy BSQ might confuse noobs what will happen if they click on this.
Maybe it should be something more like Get BSQ or How to get BSQ 👈 @m52go ?
We could use this popup afterwards not only to push the user to buy BSQ, but also show the possibility to earn BSQ by contributing.

I think it may certainly confuse any noobs, and even old crew. Also it's like a check-out, instead of one-click amazon - you're putting up barriers for people to think about before making the trade. All else being equal, they'll likely be less inclined to go through with it. Less trades, not good for Bisq.

If the UX process was smooth for buying BSQ, I'd be less hesitant. Definitely not when it's a battle!

Shifting to a (i) How to get BSQ would not be a barrier to the final trade, but an FYI for future purposes.

cd2357 · 2021-05-10T07:08:22Z

@Jakub-CZ any updates or roadblocks? Been looking forward to this PR for a long time :)

Jakub-CZ · 2021-05-10T21:17:00Z

@cd2357 I'll try to get back to this during the upcoming weekend.

Jakub-CZ · 2021-05-23T21:17:14Z

Updates since last review:

added link to relevant wiki page;
button styling moved to a CSS file;
button only displayed when not enough BSQ funds to pay for the fee.

There are still buggy scenarios where the "Filter by currency" combo box gets cleared intentionally, as a result of receiving focus. Switching to BUY BTC and then back to SELL BTC activates the desired filter (BSQ).

This needs more debugging and fixing.

cd2357 · 2021-05-24T06:51:56Z

Tried it out, looks promising.

You're right, it can get tricky with the closing of tabs, updating states of UI components, etc.

To keep things simple, it might be enough to not do any UI transitions and navigation to the "Sell BTC / Buy BSQ" view, but instead to just open the "Buy BSQ" popup. If the user is interested, he will follow the links and read into it. The popup's button could then link to the step-by-step guide on how to go about and buy some BSQ.

stale · 2021-06-23T11:14:08Z

This pull request has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/bisq_v1/takeoffer/TakeOfferView.java

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookView.java

Conflicts: desktop/src/main/java/bisq/desktop/main/account/content/altcoinaccounts/AltCoinAccountsDataModel.java

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookView.java desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookViewModel.java desktop/src/main/java/bisq/desktop/util/DisplayUtils.java

chimp1984

utACK

chimp1984 · 2021-01-07T04:47:48Z

desktop/src/main/java/bisq/desktop/main/offer/OfferViewUtil.java

+                    navigation.navigateTo(MainView.class, SellOfferView.class, OfferBookView.class);
+                }).show());
+
+        final VBox buyBsqButtonVBox = new VBox(buyBsqButton);


Why a VBox is created if there is only one element in it?
The final in local variables should not be used (I know much of old code have it as well, but current code style suggest to not use it as unnecessary verbose).

Good question - I inherited this part, but didn't looked in the exact necessity of this layout. I'll simplify this positioning.

chimp1984 · 2021-11-05T00:44:27Z

I think the "BSQ is colored coin..." can be removed then the truncating with smaller width is not happening.

Those methods are a bit weird as they mix up buyer/seller sides (isBuyBsqOffer / !isBuyOffer):

public boolean isBuyBsqOffer() {
        return !isBuyOffer() && getOffer().getCurrencyCode().equals("BSQ");
    }

ripcurlx · 2021-11-08T09:15:53Z

public boolean isBuyBsqOffer() {
return !isBuyOffer() && getOffer().getCurrencyCode().equals("BSQ");
}

Yes, this is a little bit confusing because of the fact that when you buy an altcoin you actually selling Bitcoin. I can add an additional comment to make this less confusing. But actually the naming of isBuyBsqOffer is accurate.

ripcurlx · 2021-11-08T09:19:59Z

I think the "BSQ is colored coin..." can be removed then the truncating with smaller width is not happening.

I'll adapt the scaling behavior so that the informational box will truncate first and within the informational box the longer informational text.

chimp1984 · 2021-11-08T09:39:58Z

Yes the buy/sell direction is always referred to BTC. Only in the UI we swap it for altcoins as its not intuitive otherwise.
Maybe use a different term instead of buy/sell?

ripcurlx · 2021-11-08T09:55:54Z

I think the "BSQ is colored coin..." can be removed then the truncating with smaller width is not happening.

I'll adapt the scaling behavior so that the informational box will truncate first and within the informational box the longer informational text.

I've changed the behavior so it is not truncating at 1280:

and will look as follows with the smallest width possible:

chimp1984

utACK

ripcurlx

ACK - based on #5055 (review)

Jakub-CZ force-pushed the button-buy-bsq branch from 8872400 to 6c8a7c7 Compare January 5, 2021 00:06

ripcurlx reviewed Jan 13, 2021

View reviewed changes

sqrrm mentioned this pull request Jan 27, 2021

For Cycle 21 bisq-network/compensation#773

Closed

ripcurlx mentioned this pull request Jan 29, 2021

For Cycle 21 bisq-network/compensation#758

Closed

This was referenced Feb 4, 2021

Improve BSQ account creation & purchase process #5046

Open

Distribute BTC fees to contributors of last DAO cycle bisq-network/proposals#305

Closed

sqrrm mentioned this pull request Feb 27, 2021

For Cycle 22 bisq-network/compensation#787

Closed

wallclockbuilder previously approved these changes Mar 7, 2021

View reviewed changes

Jakub-CZ dismissed wallclockbuilder’s stale review via b9caf55 May 23, 2021 21:09

Jakub-CZ force-pushed the button-buy-bsq branch from 6c8a7c7 to b9caf55 Compare May 23, 2021 21:09

Jakub-CZ force-pushed the button-buy-bsq branch from b9caf55 to 82b4fe8 Compare May 23, 2021 21:21

stale bot added the was:dropped label Jun 23, 2021

ripcurlx removed the was:dropped label Jun 24, 2021

ripcurlx added 13 commits November 4, 2021 10:36

Apply minor refactorings

e1b405f

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/bisq_v1/takeoffer/TakeOfferView.java

Move utility methods from GUIUtil to OfferViewUtil

d2baabc

Refactor auto-closing of sell BTC offer view

ee30cd9

Not auto-close create offer view

9e2be92

Add more context to buy BSQ button

5527208

Improve informational popup

d6cd83a

Add tooltip for disabled create offer button

4063b72

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookView.java

Refactor account name generation

60a0d87

Simplify and clean up data models

a5b2859

Conflicts: desktop/src/main/java/bisq/desktop/main/account/content/altcoinaccounts/AltCoinAccountsDataModel.java

Create BSQ account and take offer if not existing

b7c4e5e

Conflicts: desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookView.java desktop/src/main/java/bisq/desktop/main/offer/offerbook/OfferBookViewModel.java desktop/src/main/java/bisq/desktop/util/DisplayUtils.java

Fix failing tests

55826cb

Add informational popup after account creation

e17fd9e

Fix rebase merge errors

0e4933f

ripcurlx force-pushed the button-buy-bsq branch from d9fc0eb to 0e4933f Compare November 4, 2021 09:58

ripcurlx added 2 commits November 4, 2021 13:22

Fix combobox BSQ selection error

fac4b3c

Fix translations

12cd88c

ripcurlx marked this pull request as ready for review November 4, 2021 12:28

chimp1984 previously approved these changes Nov 5, 2021

View reviewed changes

ripcurlx added 2 commits November 8, 2021 11:05

Improve naming of helper method

2b90633

Simplify containers and improve truncation behavior

07e224e

ripcurlx dismissed chimp1984’s stale review via 07e224e November 8, 2021 10:06

chimp1984 approved these changes Nov 8, 2021

View reviewed changes

ripcurlx approved these changes Nov 8, 2021

View reviewed changes

ripcurlx merged commit 00d7913 into bisq-network:master Nov 8, 2021

ripcurlx mentioned this pull request Nov 10, 2021

For Cycle 30 bisq-network/compensation#939

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add "Buy BSQ" button next to trade fee selector #5055

Add "Buy BSQ" button next to trade fee selector #5055

Jakub-CZ commented Jan 4, 2021 •

edited by ripcurlx

Conza88 commented Jan 5, 2021

Jakub-CZ commented Jan 5, 2021

Jakub-CZ commented Jan 5, 2021

Conza88 commented Jan 5, 2021 via email

pazza83 commented Jan 5, 2021

Jakub-CZ commented Jan 5, 2021

pazza83 commented Jan 5, 2021

chimp1984 commented Jan 7, 2021

Conza88 commented Jan 7, 2021

sqrrm commented Jan 13, 2021

ripcurlx left a comment

ripcurlx Jan 13, 2021

Jakub-CZ May 23, 2021

Jakub-CZ commented Jan 13, 2021

wallclockbuilder left a comment

Conza88 commented Mar 15, 2021

cd2357 commented May 10, 2021

Jakub-CZ commented May 10, 2021

Jakub-CZ commented May 23, 2021 •

edited

cd2357 commented May 24, 2021 •

edited

stale bot commented Jun 23, 2021

chimp1984 left a comment

chimp1984 Jan 7, 2021

ripcurlx Nov 8, 2021

chimp1984 commented Nov 5, 2021

ripcurlx commented Nov 8, 2021

ripcurlx commented Nov 8, 2021

chimp1984 commented Nov 8, 2021

ripcurlx commented Nov 8, 2021

chimp1984 left a comment

ripcurlx left a comment

Add "Buy BSQ" button next to trade fee selector #5055

Add "Buy BSQ" button next to trade fee selector #5055

Conversation

Jakub-CZ commented Jan 4, 2021 • edited by ripcurlx

Screenshots

Situations when the button is clicked (unchecked are still buggy):

TODOs from discussion below:

Known bug:

Discussion:

Conza88 commented Jan 5, 2021

Jakub-CZ commented Jan 5, 2021

Some options that I see:

Jakub-CZ commented Jan 5, 2021

Conza88 commented Jan 5, 2021 via email

pazza83 commented Jan 5, 2021

Jakub-CZ commented Jan 5, 2021

pazza83 commented Jan 5, 2021

chimp1984 commented Jan 7, 2021

Conza88 commented Jan 7, 2021

sqrrm commented Jan 13, 2021

ripcurlx left a comment

Choose a reason for hiding this comment

ripcurlx Jan 13, 2021

Choose a reason for hiding this comment

Jakub-CZ May 23, 2021

Choose a reason for hiding this comment

Jakub-CZ commented Jan 13, 2021

wallclockbuilder left a comment

Choose a reason for hiding this comment

Conza88 commented Mar 15, 2021

cd2357 commented May 10, 2021

Jakub-CZ commented May 10, 2021

Jakub-CZ commented May 23, 2021 • edited

cd2357 commented May 24, 2021 • edited

stale bot commented Jun 23, 2021

chimp1984 left a comment

Choose a reason for hiding this comment

chimp1984 Jan 7, 2021

Choose a reason for hiding this comment

ripcurlx Nov 8, 2021

Choose a reason for hiding this comment

chimp1984 commented Nov 5, 2021

ripcurlx commented Nov 8, 2021

ripcurlx commented Nov 8, 2021

chimp1984 commented Nov 8, 2021

ripcurlx commented Nov 8, 2021

chimp1984 left a comment

Choose a reason for hiding this comment

ripcurlx left a comment

Choose a reason for hiding this comment

Jakub-CZ commented Jan 4, 2021 •

edited by ripcurlx

Jakub-CZ commented May 23, 2021 •

edited

cd2357 commented May 24, 2021 •

edited