Hook up autocomplete model

src/storage/index.ts

@@ -1,7 +1,7 @@
 import {MMKV} from 'react-native-mmkv'
 
 import {IS_DEV} from '#/env'
-import {Account} from '#/storage/schema'
+import {Account,Device} from '#/storage/schema'
 
 export * from '#/storage/schema'
 

src/view/com/composer/text-input/TextInput.web.tsx

@@ -31,7 +31,7 @@ import {Text} from '../../util/text/Text'
 import {createSuggestion} from './web/Autocomplete'
 import {Emoji} from './web/EmojiPicker.web'
 import {LinkDecorator} from './web/LinkDecorator'
-import {createTagsAutocomplete,Tags} from './web/Tags'
+import {createTagsAutocomplete, Tags} from './web/Tags'
 
 export interface TextInputRef {
   focus: () => void
@@ -338,6 +338,8 @@ function editorJsonToText(
     text += json.text || ''
   } else if (json.type === 'mention') {
     text += `@${json.attrs?.id || ''}`
+  } else if (json.type === 'tag') {
+    text += `#${json.attrs?.id || ''}`
   }
   return text
 }

src/view/com/composer/text-input/tagsAutocompleteState.ts

@@ -19,13 +19,17 @@ export function tagAutocompleteModel({
   return {
     async search(query: string) {
       if (!query) return [{value: query}]
-      return [{value: query}]
+      return [
+        {value: query},
+        ...recentTags.filter(t => t.value.includes(query)),
+      ]
     },
     save(tag: string) {
       recentTags = [
         {value: tag},
         ...recentTags.filter(t => t.value !== tag),
       ].slice(0, 40)
+      account.set([currentDid, 'recentTags'], recentTags)
     },
   }
 }

src/view/com/composer/text-input/web/Tags/plugin.tsx

@@ -88,7 +88,7 @@ export type MentionOptions<
  * The plugin key for the mention plugin.
  * @default 'mention'
  */
-export const TagsPluginKey = new PluginKey('tags')
+export const TagsPluginKey = new PluginKey('tag')
 
 /**
  * This extension allows you to insert mentions into the editor.
@@ -97,7 +97,7 @@ export const TagsPluginKey = new PluginKey('tags')
 export const Tags = Node.create<
   MentionOptions<any, {tag: string; punctuation?: string}>
 >({
-  name: 'tags',
+  name: 'tag',
 
   addOptions() {
     return {

src/view/com/composer/text-input/web/Tags/utils.ts

@@ -49,13 +49,6 @@ export function findSuggestionMatch({
   const from = textFrom + match.index + leadingSpaceOffset
   const to = from + tag.length + hashtagOffset
 
-  console.log({
-    pos: $position.pos,
-    from,
-    to,
-    text,
-  })
-
   // If the $position is located within the matched substring, return that range
   if (from < $position.pos && to >= $position.pos) {
     return {

src/view/com/composer/text-input/web/Tags/view.tsx

@@ -95,7 +95,7 @@ export function createTagsAutocomplete({
 
 const Autocomplete = forwardRef<AutocompleteRef, ListProps>(
   function AutocompleteImpl(props, ref) {
-    const {items, command} = props
+    const {items, command, model} = props
     const pal = usePalette('default')
     const [selectedIndex, setSelectedIndex] = useState(0)
 
@@ -111,8 +111,9 @@ const Autocomplete = forwardRef<AutocompleteRef, ListProps>(
          * only want to `commitRecentTag` with the sanitized tag.
          */
         command({tag, punctuation})
+        model.save(tag)
       },
-      [command],
+      [command, model],
     )
 
     const selectItem = React.useCallback(