Add button to copy list of broken links

[pcraig3]

Summary

This PR does 2 things, but only 1 of them is important.

1. (Not important) Adding style maps for Word conversions
2. (Important) Adding a "copy links" button on the nofo_edit page

Style maps explainer

When we import .doc/docx files, we use mammoth to convert them to HTML first. It does a pretty good job, but sometimes it doesn't know what to do with specific formatting (you can see how text is formatted using the styles pane in Word).

Style maps are explicit conversion rules that we can add. As an example:

style_map_manager.add_style(
    style_rule="p[style-name='Emphasis A'] => strong.emphasis",
    location_in_nofo="Step 2 > Grants.gov > Need Help?",
    note="Just bold the entire sentence",
)

This style looks for text formatted with "Emphasis A" and will convert it to a <strong> tag with a classname of "emphasis". I've written a little container class around them, but the actual rule itself is the style_rule.

If you don't specify a style tag, mammoth does a 'best guess' conversion.

There are usually new style tags that come in when we get sent new documents and I initially thought we should capture them all so that all of our conversions were explicit rather than implicit.

However, 2 problems with this idea:

1. Style tags are literally just strings, so anyone can create a new style at any time (there is no 'full list' of Word styles). So we will forever be malleting groundhogs if this is the idea.
2. The 'best guess' conversion is sometimes better than a style map. For example, the level nested bullets can't be detected with style maps, but they work with implicit conversions.

Given all that, it's still generally a reasonable idea to add explicit conversions if they aren't doing anything too complex, so this PR contains some that have come in recently.

This PR adds a 'Copy links' button to the broken links alert box on the nofo_edit page. If you click the button, the number of broken links and a list of broken links is copied to your clipboard. The use case here is that you can click the button and then email the list to someone.

The button works whether the <details> element in the alert box is open or closed.

The JS is added to a script tag near the page footer. This app has very minimal JS needs (deliberately), so there is no sophisticated JS build pipeline, and I'd prefer to keep it that was as long as possible. This means there is some duplication with JS here and there but I think it's okay.

The button styling comes from the 'outline inverse' version of the US Web Design System (USWDS) button component.

gif

Why are we doing this?

Adam has asked about this because sometimes he sends back NOFOs with too many broken links to the writing teams and he pulls out the list of links for them to fix up.

Also, recently, Betty asked for this same thing. Here is the ticket on Airtable: https://airtable.com/appdaa5AqUwI8jdOo/tblziL3G1qZkr0oV3/viwQ7YCJq9yxJq21f/recvgcYiBgNfhHWL7?blocks=hide

How to test this

1. Have an imported NOFO with broken links
2. Click the "copy links" button
3. Paste into empty document/note
4. They should match