[Footer] Multiple collaboration buttons and customize-able texts

[Chris-Xie]

Choose the section that applies to you and use the template to help us figure out how we can help you.

---

Bug report

Tradeshift UI version affected

latest

Expected Behavior

1. Sometimes, we need to have more than one collaboration buttons on footer section. (One for collaboration with colleague, the other for collaboration with the other party)

2. We would also like to be able to customize the collaboration button texts. Meanwhile, it also provides the ability to have translations for button text without introducing i18n to tradeshift-ui.

Actual Behavior

Steps to reproduce

Screenshots (optional)

---

Feature request

Description of feature

Example use cases and/or Prototype links

Designs and/or Prototype screenshots

[wiredearp]

I am not sure that this is the idea (perhaps @jerf can help), since it was part of the original design concept that the "Collaborate On This" button should always look the same and be clearly isolated from other buttons (which can now be found in every other corner of the screen) so that the user has a clear expectation of what this button does; and so that it doesn't get lost amongst the other buttons. It doesn't help that the button text is not translated, we should of course get that done ASAP :see_no_evil:, but the current API is anyways designed with this in mind. That is why there is no configuration options in the API. So let's at least clear that up with the designers before we proceed with https://github.com/Tradeshift/tradeshift-ui/pull/558.

[jerf]

We should be able to support 2 buttons for collaboration for internal and external collaborations based on the use case (not all documents/objects can be shared externally eg. Purchase Request is an internal only document).

The external button needs to have "other party role" context ie. "Contact Supplier/Buyer" and the internal button is always "Collaborate with a colleague" although there is an ongoing discussion about changing this to be shorter/more concise by using the word "Share" instead.

[jamessimo]

@jerf We don't need to control the context of the two buttons, but we do need to be able to translate them some how.

[wiredearp]

I for some reason wasn't notified by GitHub about these follow-up responses :thinking:

Right, I suggest that @jamessimo and @Chris-Xie go ahead and implement those two buttons via regular buttons for now, see http://ui.tradeshift.com/v10/#components/footer/buttons.html (and http://ui.tradeshift.com/v10/#components/table/buttons.html for the equivalent buttons in the Table).

It is true that Collaborate On This is currently hardcoded into the Footer and not translated at all. This is a disaster, obviously. I think we'll need to start digging into the proposed changes as soon as possible (paging @mihneaz) so that we can request both the current and the revised translations in a single batch.

And again, the current API is intentionally kept simple to prevent this area of the UI from being just another parking spot for random buttons. There is not even support for change of the button label, since Collaboration could then easily become mislabeled as Contact (as it happened in this case) or even Send Invoice or Add New Product.

ts.ui.Footer.collabbutton(function onclick() {
    alert('Go collaborate!'); // the developer must call some other APIs at this point
});

I think that this restricted API works great to ensure consistency between apps and to maximize the branding value of the Collaboration feature, but it does of course mean that we have to make all the tough decisions up front :/

[wiredearp]

:question: Could this choice between internal and external collaboration be deferred to the Collaboration panel?