send along tags with api request

src/lib/api/index.ts

@@ -83,6 +83,7 @@ interface PostOpts {
   knownHandles?: Set<string>
   onStateChange?: (state: string) => void
   langs?: string[]
+  tags?: string[]
 }
 
 export async function post(store: RootStoreModel, opts: PostOpts) {
@@ -264,6 +265,7 @@ export async function post(store: RootStoreModel, opts: PostOpts) {
       embed,
       langs,
       labels,
+      tags: opts.tags?.filter(t => t.replace(/^#/, '')),
     })
   } catch (e: any) {
     console.error(`Failed to create post: ${e.toString()}`)

src/view/com/composer/Composer.tsx

@@ -91,6 +91,7 @@ export const ComposePost = observer(function ComposePost({
   const [labels, setLabels] = useState<string[]>([])
   const [suggestedLinks, setSuggestedLinks] = useState<Set<string>>(new Set())
   const gallery = useMemo(() => new GalleryModel(store), [store])
+  const [tags, setTags] = useState<string[]>([])
 
   const autocompleteView = useMemo<UserAutocompleteModel>(
     () => new UserAutocompleteModel(store),
@@ -167,6 +168,13 @@ export const ComposePost = observer(function ComposePost({
     [gallery, track],
   )
 
+  const onChangeTags = useCallback(
+    (tags: string[]) => {
+      setTags(tags)
+    },
+    [setTags],
+  )
+
   const onPressPublish = async () => {
     if (isProcessing || graphemeLength > MAX_GRAPHEME_LENGTH) {
       return
@@ -195,6 +203,7 @@ export const ComposePost = observer(function ComposePost({
         onStateChange: setProcessingState,
         knownHandles: autocompleteView.knownHandles,
         langs: store.preferences.postLanguages,
+        tags,
       })
     } catch (e: any) {
       if (extLink) {
@@ -387,7 +396,7 @@ export const ComposePost = observer(function ComposePost({
               pal.border,
               {borderTopWidth: 1, paddingVertical: 10, marginTop: 10},
             ]}>
-            <TagInput max={8} />
+            <TagInput max={8} onChangeTags={onChangeTags} />
           </View>
         </ScrollView>
         {!extLink && suggestedLinks.size > 0 ? (

src/view/com/composer/TagInput.tsx

@@ -38,19 +38,35 @@ function Tag({
   )
 }
 
-export function TagInput({max}: {max: number}) {
+export function TagInput({
+  max,
+  onChangeTags,
+}: {
+  max: number
+  onChangeTags: (tags: string[]) => void
+}) {
   const pal = usePalette('default')
   const input = React.useRef<TextInput>(null)
   const [value, setValue] = React.useState('')
   const [tags, setTags] = React.useState<string[]>([])
 
+  const handleChangeTags = React.useCallback(
+    (_tags: string[]) => {
+      setTags(_tags)
+      onChangeTags(_tags)
+    },
+    [onChangeTags, setTags],
+  )
+
   const onKeyPress = React.useCallback(
     (e: NativeSyntheticEvent<TextInputKeyPressEventData>) => {
       if (e.nativeEvent.key === 'Enter') {
         const _tags = value.trim().split(' ').filter(Boolean)
 
         if (_tags.length > 0) {
-          setTags(Array.from(new Set([...tags, ..._tags])).slice(0, max))
+          handleChangeTags(
+            Array.from(new Set([...tags, ..._tags])).slice(0, max),
+          )
           setValue('')
         }
 
@@ -58,10 +74,10 @@ export function TagInput({max}: {max: number}) {
           input.current?.focus()
         }, 100)
       } else if (e.nativeEvent.key === 'Backspace' && value === '') {
-        setTags(tags.slice(0, -1))
+        handleChangeTags(tags.slice(0, -1))
       }
     },
-    [max, value, tags, setValue, setTags],
+    [max, value, tags, setValue, handleChangeTags],
   )
 
   const onChangeText = React.useCallback((value: string) => {
@@ -71,9 +87,9 @@ export function TagInput({max}: {max: number}) {
 
   const removeTag = React.useCallback(
     (tag: string) => {
-      setTags(tags.filter(t => t !== tag))
+      handleChangeTags(tags.filter(t => t !== tag))
     },
-    [tags, setTags],
+    [tags, handleChangeTags],
   )
 
   return (

src/view/com/composer/text-input/web/TagDecorator.ts

@@ -33,6 +33,7 @@ function getDecorations(doc: ProsemirrorNode) {
       while ((match = TAG_REGEX.exec(textContent))) {
         const [, m] = match
         const tag = m.trim().replace(/\p{P}+$/gu, '')
+        if (tag.length > 66) continue
         const from = match.index + 1
         const to = from + tag.length + 1
         decorations.push(