Fix untranslated error messages in add.html and web.html.

[rebecca-shoptaw]

Problem

While working on another issue, I noticed that a few strings in the cover and link adding forms are not getting translated because they are written in the JavaScript rather than the HTML files, so get ignored for internationalization: i.e. $('#link-errors').html('Please provide a label.'); in edit.js

Evidence / Screenshot

Reproducing the bug

1. Change site language to any non-English language
2. Go to a work page
3. Try to enter a link with no label (below the excerpts)

• Expected behavior: "Please provide a label" appears in the language you've selected for the site.
• Actual behavior: "Please provide a label" appears in English.

Note: You can follow the same process with trying to submit a new cover image without entering a link or an image file.

Context

• OS (Windows, Mac, etc): Mac
• Logged in (Y/N): Y
• Environment (prod, dev, local): prod

⚠️ Experienced contributors only

Proposal & constraints

Very simple! The clearest way to fix the problem would be to replicate the approach @cdrini suggested for #8754 - transfer the relevant error messages into the HTML as a data attribute, and then access the data attribute in the JavaScript as needed.

This can also be bundled with a quick fix to make the "URL" and "Add Link" text correctly formatted for internationalization directly in the HTML.

Related files

openlibrary/plugins/openlibrary/js/edit.js
openlibrary/templates/books/edit/web.html

openlibrary/plugins/openlibrary/js/covers.js
openlibrary/templates/books/add.html

Stakeholders

[rebecca-shoptaw]

This is very similar to a previous PR I did, and should be nice and straightforward, so I'd love to work on it!

[jimchamp]

Go for it! Add the translated strings as an object in a data-i18n attribute (there are many examples of this in the codebase). Let me know if you have any questions.