feat: add amendment summary page

[pdp2121]

High Level Overview of Change

The page would include:

• Information about the amendment
• List of voted Yes and No validators (for amendments in voting)
• A graph showing distribution of votes broken down by UNL and non-UNL validators (for amendments in voting)

This PR would also include search by Amendment Id/Name

Type of Change

• New feature (non-breaking change which adds functionality)

Before / After

Amendment in voting (Desktop)

Amendment in voting (Mobile)

Amendment enabled

Chart legend

Footnote

[bugsbunnies]

@pdp2121 The Yeas and Nays colors are reversed, should be Yeas - Green, Nays - Magenta. In addition to the color fix, let's have the Yeas bar on the left and Nays on the right

[pdp2121]

@pdp2121 The Yeas and Nays colors are reversed, should be Yeas - Green, Nays - Magenta. In addition to the color fix, let's have the Yeas bar on the left and Nays on the right

@bugsbunnies Nice catch! I just updated the color and screenshots

[mvadari]

The "UNL"/"non-UNL" labels look like they're supposed to be labeling each of the bars. Can those titles be moved to the top of each graph?

[bugsbunnies]

The "UNL"/"non-UNL" labels look like they're supposed to be labeling each of the bars. Can those titles be moved to the top of each graph?

I think the problem is that they're at an angle, can we just make it so they center align with each bar group and not at an angle?

[mvadari]

The "UNL"/"non-UNL" labels look like they're supposed to be labeling each of the bars. Can those titles be moved to the top of each graph?

I think the problem is that they're at an angle, can we just make it so they center align with each bar group and not at an angle?

Yes, agreed - I think it'd look better with a top label, but I'm not opposed to a bottom axis label.

[bugsbunnies]

The "UNL"/"non-UNL" labels look like they're supposed to be labeling each of the bars. Can those titles be moved to the top of each graph?

I think the problem is that they're at an angle, can we just make it so they center align with each bar group and not at an angle?

Yes, agreed - I think it'd look better with a top label, but I'm not opposed to a bottom axis label.

I suggested bottom label just to keep it consistent with the basics of a graph with y-axis label and x-axis label in their expected places. The tricky thing with a top label (if im imagining what you're saying correctly) is that if we give them a fixed position on the graph, they might not always be close to the data bars, and if we keep them close to the data, the label could move around depending on the bars height.

[mvadari]

Shouldn't the table only show UNL - or have tabs to show UNL vs non-UNL?

[pdp2121]

I have fixed the axis accordingly and updated the screenshots. The Simple of this page shows both Yeas(All), Nays(All), Yeas(UNL), and Nays(UNL) (The Yeas and Nays columns at the bottom also shows all validators with green checkmarks for UNL), while the amendments list page in #836 only count UNL for voters. I think we received quite a few requests on showing all validators instead of just UNL so I think it makes sense to show all in this summary page

[intelliot]

Agree that it's useful to show all validators (instead of just UNL) and it makes sense to show all.

dUNL validators should be marked with the green check.

optional - It would also be useful to have a footnote to indicate what the green check means: "this validator is on the vl.ripple.com UNL" (or vl.xrplf.org, whichever is accurate).

[mvadari]

IMO 1) it'd be useful to have a separate table that only shows the UNL (as well as one that shows all of them) and/or 2) the table should be sorted so that the UNL comes first (like we do in the validator tables).

[pdp2121]

Makes sense! I have moved the UNL validators to the top and added a footnote for clarification. I think this is clear enough to explain those columns.