Add "clear input" and "copy to clipboard" buttons to the custom lesson field

[evgenyfadeev]

I'd be willing to make a PR for this, btw.

The reason I propose this is because I often find myself using the "custom lesson" functionality,
so for that "clear" button would be handy to clear the previous lesson before I paste the new one.

Also - since my lessons are kind of random - they are a set of sentences taken randomly from a pre-made list - at times I would like to copy the previous lesson before clearing the field.

Is that something that might be accepted?

[didoesdigital]

Thanks for the suggestion @evgenyfadeev. Sounds fine.

I'm a little reluctant to make that page busier because it's already challenging for some people to figure out how to use it and to find all the features on the page. Adding more features that will be used far less frequently than the primary action "Start custom lesson" risks adding more cognitive load.

That said, on the balance I think it's worth adding as an experiment and adjusting if needed.

Here's a mockup for the design/layout you can use:

Here's a new "copy" icon we could add (similar to the metronome start/stop button icons):

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="3" y="4" width="13" height="19" rx="1" fill="currentColor"></rect>
<rect x="5" y="6" width="9" height="15" fill="white"></rect>
<rect x="7" width="13" height="19" rx="1" fill="currentColor"></rect>
<rect x="9" y="2" width="9" height="15" fill="white"></rect>
</svg>

We could use the existing ClosingCross icon for the "Clear" button.

I would expect clicking the "Copy" button to select the text in the textarea and copy it to the clipboard, perhaps with a little "Copied!" animation like on the "Copy progress" button on the Progress page.

What do you think @evgenyfadeev ?

[evgenyfadeev]

Sounds good, thank you! As for the clutter - maybe if the design of those extra buttons is muted enough it would not be an issue.

Also, I'm thinking that for the symmetry other input boxes might use the same functionality... What do you think about that @didoesdigital ?

[didoesdigital]

@evgenyfadeev The other input boxes already have copy buttons for the resulting material as the primary action so I think additional copy buttons for the input risks adding more confusion for a less proven use case.

A new issue has been opened that proposes solutions with buttons in the same area as this issue. It's for different behaviour but that may also solve a similar problem to part of your workflow? It might be worth holding off on this feature until we try the other one or discuss it further first, what do you think?