use vue-richtext helper functions to call the link picker

Signed-off-by: Julien Veyssier <[email protected]>

src/components/Suggestion/LinkPicker/suggestions.js

@@ -22,25 +22,38 @@
 import createSuggestions from '../suggestions.js'
 import LinkPickerList from './LinkPickerList.vue'
 
+import { getProviders, sortProviders, getLinkWithPicker } from '@nextcloud/vue-richtext'
+
 export default () => createSuggestions({
 	listComponent: LinkPickerList,
 	command: ({ editor, range, props }) => {
-		editor
-			.chain()
-			.focus()
-			.insertContentAt(range, props.label + ' ')
-			.run()
+		getLinkWithPicker(props.provider)
+			.then(link => {
+				editor
+					.chain()
+					.focus()
+					.insertContentAt(range, link)
+					.run()
+			})
+			.catch(error => {
+				console.error('Link picker promise rejected:', error)
+			})
 	},
 	items: ({ query }) => {
-		return [
-			{
-				label: 'Hello',
-				icon: '',
-			},
-			{
-				label: 'Hello2',
-				icon: '',
-			},
-		]
+		const providers = getProviders()
+		const escapedQuery = query.replace(/[/\-\\^$*+?.()|[\]{}]/g, '\\$&')
+		const regexp = new RegExp(escapedQuery, 'i')
+		const sortedProviders = sortProviders(providers)
+		return sortedProviders
+			.filter(p => {
+				return p.title.match(regexp)
+			})
+			.map(p => {
+				return {
+					label: p.title,
+					icon: p.icon_url,
+					provider: p,
+				}
+			})
 	},
 })