Apps: Display extrinsic meta documentation on hover

Created on 11 Apr 2019 · 23Comments · Source: polkadot-js/apps

Goal:

To make specific extrinsic information available at the fingertips of the user, as opposed to referencing more external documentation.

Background:

Currently the metadata returns in-code documentation that expands on the methods for both the extrinsics and chain state. This information is used to display a very condensed summary in the extrinsic selection, i.e.

We wish to expand this to actually show all information.

Actions:

Expand the submit the following extrinsic label (or any label passed for an Extrinsic/Proposal to contain help with the actual documentation.
As the method selection changes, the updated documentation becomes available as part of the hover. (This is actually better suited to the dropdown itself, and _may_ work as a tooltip - but these things are large)

Bonus:

Also apply to the chain state app

!bounty -size-s @app-extrinsics [documentation]

Source

jacogr

All 23 comments

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

__This issue now has a funding of 150.0 DAI (150.0 USD @ $1.0/DAI) attached to it as part of the W3F fund.__

If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
- Want to chip in? Add your own contribution here.
- Questions? Checkout Gitcoin Help or the Gitcoin Slack
- $94,655.87 more funded OSS Work available on the Gitcoin Issue Explorer

gitcoinbot on 2 May 2019

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

__Work has been started__.

These users each claimed they can complete the work by 11 months from now.
Please review their action plans below:

1) sebastiancaso has applied to start work _(Funders only: approve worker | reject worker)_.

No questions on the ticket, seems pretty straightforward. I'll review the code then come up with the best solution possible.
2) pbteja1998 has been approved to start work.

I will start working on this as per the given requirements.

Learn more on the Gitcoin Issue Details page.

gitcoinbot on 2 May 2019

@georgiemathews Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

[x] reminder (3 days)
[ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

gitcoinbot on 6 May 2019

@jacogr Is this available? If so, I want to give this a try.

pbteja1998 on 8 May 2019

@pbteja1998 It has been assigned as of now, however if the status does change, it should reflect here via the Gitcoin updates.

jacogr on 8 May 2019

[x] reminder (3 days)
[ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

gitcoinbot on 9 May 2019

@gitcoinbot still working, should be done in the next two days!

georgiemathews on 10 May 2019

❤1

[x] reminder (3 days)
[ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

gitcoinbot on 15 May 2019

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

@georgiemathews due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

[x] reminder (3 days)
[x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

gitcoinbot on 18 May 2019

Hey @georgiemathews just checking in on you. Is this bounty still a WIP for you?

Web3Foundation on 20 May 2019

@jacogr I think this bounty's status returned to open. I want to give this a try. Shall I take this?

pbteja1998 on 29 May 2019

@pbteja1998 Yes, please. You can just apply via gitcoin

jacogr on 29 May 2019

@jacogr I have applied through gitcoin. Before I start, I have a few doubts.

You want to show more information about all the labels in the form... like rendering a "?" symbol next to each label, which acts similar to a tooltip. Is this what is required?

pbteja1998 on 29 May 2019

Also, in bonus section, you wrote Also apply to chain state app. What do u mean by this? Is this another repo?

pbteja1998 on 29 May 2019

Also, in bonus section, you wrote Also apply to chain state app. What do u mean by this? Is this another repo?

What is meant here is: we can apply the same changes to another app, it is another section in the UI called "Chain state", it's in the same repo, just a different package: https://github.com/polkadot-js/apps/tree/master/packages/app-storage

I let Jaco answer the first question.

Tbaut on 29 May 2019

👍1

@pbteja1998 So yes, if you look at the app, we already have that available everywhere we use labels (not in extrinics and not in state), i.e.

So the label wrapper already take and (optional) help prop, that handles the rendering. So on extrinsics, when we swap the section/method, we just need to dynamically determine what the metadata is (it already gets rendered in the method dropdown) and then pass that to the help prop.

Dos this make sense?

jacogr on 29 May 2019

👍1

On what basis should I determine the meta data for a given label?

pbteja1998 on 29 May 2019

The metadata is return from the chain. So each call has documentation. So currently when constructing the dropdowns, these are attached and appear (in summary form), inside the item, i.e.

This is extracted from the methods itself (as an example), here -

https://github.com/polkadot-js/apps/blob/master/packages/ui-app/src/InputExtrinsic/options/method.tsx#L41

So the same logic would apply in the onChange event of the extrinsic selection, i.e. here https://github.com/polkadot-js/apps/blob/master/packages/app-extrinsics/src/Selection.tsx#L125

Since an extrinsic gets passed, you can inspect it in the same way as above and then just attache the documentation as the help.

The same (from extrinsic) takes place when submitting -

i.e. here is an actual complete example as to how to extract from the actual extrinsic,

https://github.com/polkadot-js/apps/blob/master/packages/ui-signer/src/Transaction.tsx#L29-L40

jacogr on 29 May 2019

@jacogr Thanks for the detailed explanation. Can you please approve me in gitcoin. I will start working on this immediately.

pbteja1998 on 29 May 2019

@pbteja1998 approved.

Web3Foundation on 29 May 2019

👍1

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

__Work for 150.0 DAI (150.0 USD @ $1.0/DAI) has been submitted by__:

@pbteja1998

@Web3Foundation please take a look at the submitted work:

PR by @pbteja1998

Learn more on the Gitcoin Issue Details page
Want to chip in? Add your own contribution here.
Questions? Checkout Gitcoin Help or the Gitcoin Slack
$69,046.25 more funded OSS Work available on the Gitcoin Issue Explorer

gitcoinbot on 31 May 2019

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

__The funding of 150.0 DAI (150.0 USD @ $1.0/DAI) attached to this issue has been approved & issued to @pbteja1998.__

Learn more on the Gitcoin Issue Details page
Questions? Checkout Gitcoin Help or the Gitcoin Slack
$69,096.25 more funded OSS Work available on the Gitcoin Issue Explorer

gitcoinbot on 31 May 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue if you think you have a related problem or query.