Auto-completion in the "Narration" field in the Add popup

[hyperglue]

Hi, is it possible to display suggestions when typing in the "Narration" field in the Add popup? Like start typing #sal and it'd suggest #salary tag. Auto-completion works on any other field but that one. It'd especially useful on mobile, for now I'm forced to use the editor which can be problematic.

[yagebu]

This would indeed be a useful feature. A PR would be very welcome :)

[hyperglue]

I don't have too much experience with JavaScript or its frameworks, but I dug a little into a code yesterday and got two ideas for now:

• modifying the "Narration" field to support auto-completion, I tried quickly changing this line from <input to <AutocompleteInput and it worked but only once, when clicking on the field. I'm not really sure what to modify to make auto-completion pop-up show every time when typing # or ^,
• remove the "Narration" field and put the CodeMirror editor in its place, a little like it's done here. The editor already implements all we need, so I think it should work.

What do you think would be the best approach to implement this feature?

[yagebu]

Since the CodeMirror editor expects to handle a full Beancount file, it wouldn't work for just the narration part without some further modifications. So the first option is probably more feasible - using <AutocompleteInput /> should work.

Maybe the input for the filter input in the top right could serve as an example as it supports completion of tags and links and also handles replacing the right part of the input on completion selection using the valueExtractor and valueSelector functions (https://github.com/beancount/fava/blob/main/frontend/src/sidebar/FilterForm.svelte).