[HOLD for payment 2024-12-05] [HOLD live-markdown 439][Search v2.5] [Autocomplete] Highlight autocomplete key and selected value

[lakchote]

See https://docs.google.com/document/d/1o-Hp-tK8Z_BAcE-KRiXQicPH04qNr525EIxlG8J4RxM/edit?tab=t.0#bookmark=id.hy4h27dpoz37

[289Adam289]

Hi! According design doc I think this issue should be on hold for Expensify/react-native-live-markdown#439 pr that will allow our parser to be passed as worklet to live markdown.

[ikevin127]

Not overdue, on hold for Expensify/react-native-live-markdown#439.

[ikevin127]

Still on hold for Expensify/react-native-live-markdown#439.

[ikevin127]

Still on hold for Expensify/react-native-live-markdown#439.

[ikevin127]

Still on hold for Expensify/react-native-live-markdown#439.

[lakchote]

Still on hold for Expensify/react-native-live-markdown#439.

Same.

[Kicu]

Issue update

Quick reminder:
we wanted to use https://github.com/Expensify/react-native-live-markdown to implement highlighting in Search autocomplete. I recently discussed the best way to implement this with @tomekzaw who is the author of the PR.
Tomek has done a great deal of work 👏 to allow for the LiveMarkdown component to accept any JS code as parser via a prop.
Now we need to actually implement this in Expensify/App, which will require updating the version of live markdown (and some other packages) and tweaking the current code for RNMarkdownTextInput component.

This should not be a very big change in the code, but as any change it might introduce some small bugs.
In the old implementation of livemarkdown, the ExpensiMark parser was bundled together with the MarkdownTextInput component and was always used.
In the new version of MarkdownTextInput, the component accepts a parser prop, which can be any JS function adhering to correct interface.

I will try to push this forward as smoothly as possible, but we will require some help with testing.

Next steps :

1. I'm testing if the new version works correctly with Expensify locally (<--- we are here)
2. We will want to create a test build, and would need your help in getting some QAs to test it and see if there are no regressions for Composer with ExpensiMark.
3. merge Support custom parsing logic (pass worklet as parser prop) react-native-live-markdown#439 and release new version
4. bump version of react-native-live-markdown in E/App; pass expensiMark as parser for Composer, pass autocompleteParser for SearchRouter
5. Profit $$$ 😉

We will also need to bump reanimated and expensify-common (minor version for both). Thankfully @blazejkustra is already looking at bumping reanimated here: #52024 so this will speed things up.

I will open a draft PR soon for tracking the progress.
Feel free to ask anything. The workletization of parser in LiveMarkdown editor is a feature that multiple people would like to see added to the library. It will give us a lot of freedom, if we want to change how our parsers behave in future.

CC @luacmartins @lakchote @JmillsExpensify @tomekzaw @289Adam289 @SzymczakJ

[blazejkustra]

We will also need to bump reanimated and expensify-common (minor version for both). Thankfully @blazejkustra is already looking at bumping reanimated here: #52024 so this will speed things up.

I created the issue earlier today, would you mind assigning me? @lakchote

[luacmartins]

I appreciate the update @Kicu!

[tomekzaw]

Unfortunately this breaks on mobile, and @tomekzaw needs to spent a bit more fixing bugs.

This bug should be fixed with software-mansion/react-native-reanimated#6706, we'll test it out in E/App early next week.

[melvin-bot]

@lakchote, @luacmartins, @ikevin127 Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[ikevin127]

Not overdue, needs retest once PR mentioned in #50949 (comment) is merged.

[lakchote]

PR got merged, retest can be done.

[luacmartins]

Did we bump the version in App already?

[blazejkustra]

Not yet, PR is still in progress. We'll update with more info tomorrow 👍

[blazejkustra]

Update: We need to wait for Reanimated 3.16.3, which includes a minor fix for shared value mocks that's necessary to proceed (tests are currently failing). It should be ready early next week, but if not, we can overwrite the mock ourselves = meaning it won't hold this task anyway.

[Kicu]

Meanwhile a few days ago an important PR for live-markdown was merged, that moved it from yarn to npm: Expensify/react-native-live-markdown#539

There is a lot of things happening in live-markdown now, but the worklets PR is very close to done and we will be pushing it this week.

[melvin-bot]

@lakchote, @luacmartins, @ikevin127 Whoops! This issue is 2 days overdue. Let's get this updated quick!

[lakchote]

Updates are just above.

[blazejkustra]

Update: Reanimated bump is ready for review 🚀

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.67-9 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Bump react-native-live-markdown to 0.1.187 #52960

If no regressions arise, payment will be issued on 2024-12-05. 🎊

For reference, here are some details about the assignees on this issue:

• @ikevin127 requires payment (Needs manual offer from BZ)