feat: populate and suggest references after PDF ingestion#81
Conversation
| "react-drag-drop-files": "^2.3.10", | ||
| "react-icons": "^4.8.0", | ||
| "react-pdf": "^6.2.2", | ||
| "react-popper": "^2.3.0", |
There was a problem hiding this comment.
Doesn't ProseMirror support autocomplete? If so, could we use it for this use-case? Maybe with this? https://github.com/curvenote/editor/tree/main/packages/prosemirror-autocomplete or even https://github.com/ueberdosis/tiptap/tree/develop/packages/suggestion
There was a problem hiding this comment.
ProseMirror doesn't come with autocomplete without plugins.
The first ProseMirror plugin you mentioned doesn't not come with a UI library, you have to position the suggestion "by hand" (https://github.com/curvenote/editor/blob/main/packages/prosemirror-autocomplete/demo/reducer.ts#L21) and I'm not sure we can use ProseMirror plugins with TipTap anyway.
The second TipTap extension you mentioned is actually the one we use: this PR implements suggestions with the Mention extension (to trigger suggestions opening with a given character), which uses the suggestion extension under the hood. As per the source code, you also have to place the suggestion component yourself, and they suggest using tippy or popper.
The mention extension comes with tippy as a dependency, however, this leads to some typing issues and a react implementation is needed to easily access to the jotai atom, so we need to install an extra library, either react-popper or tippyjs/react, I chose the former for no particular reason and I don't have any strong opinion on them so I'm happy to switch to the latter if needed.
This PR closes #49.
It adds the following features:
[in the editor enables you to insert a referenceImplementation choices:
[react-popperto render the suggestion listsuggestionextension requires a library to position the listMentioncomes withtippybut we need a react implementation because jotai atoms are only available in the React world (if we want to avoid having to handle stores)tippyjs/reactwould be an alternative we can use