Merge branch 'main' of https://github.com/haideralipunjabi/social-app into main

src/lib/constants.ts

···
 export const HITSLOP_20 = createHitslop(20)
 export const HITSLOP_30 = createHitslop(30)
 export const BACK_HITSLOP = HITSLOP_30
+export const MAX_POST_LINES = 25

src/lib/strings/helpers.ts

···
 
   return 4294967296 * (2097151 & h2) + (h1 >>> 0)
 }
+
+export function countLines(str: string | undefined): number {
+  if (!str) return 0
+  return str.match(/\n/g)?.length ?? 0
+}

src/view/com/post-thread/PostThreadItem.tsx

···
   FontAwesomeIconStyle,
 } from '@fortawesome/react-native-fontawesome'
 import {PostThreadItemModel} from 'state/models/content/post-thread-item'
-import {Link} from '../util/Link'
+import {Link, TextLink} from '../util/Link'
 import {RichText} from '../util/text/RichText'
 import {Text} from '../util/text/Text'
 import {PostDropdownBtn} from '../util/forms/PostDropdownBtn'
···
 import {niceDate} from 'lib/strings/time'
 import {sanitizeDisplayName} from 'lib/strings/display-names'
 import {sanitizeHandle} from 'lib/strings/handles'
-import {pluralize} from 'lib/strings/helpers'
+import {countLines, pluralize} from 'lib/strings/helpers'
 import {isEmbedByEmbedder} from 'lib/embeds'
 import {getTranslatorLink, isPostInLanguage} from '../../../locale/helpers'
 import {useStores} from 'state/index'
···
 import {TimeElapsed} from 'view/com/util/TimeElapsed'
 import {makeProfileLink} from 'lib/routes/links'
 import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
+import {MAX_POST_LINES} from 'lib/constants'
 
 export const PostThreadItem = observer(function PostThreadItem({
   item,
···
   const pal = usePalette('default')
   const store = useStores()
   const [deleted, setDeleted] = React.useState(false)
+  const [limitLines, setLimitLines] = React.useState(
+    countLines(item.richText?.text) >= MAX_POST_LINES,
+  )
   const styles = useStyles()
   const record = item.postRecord
   const hasEngagement = item.post.likeCount || item.post.repostCount
···
       },
     )
   }, [item, store])
+
+  const onPressShowMore = React.useCallback(() => {
+    setLimitLines(false)
+  }, [setLimitLines])
 
   if (!record) {
     return <ErrorMessage message="Invalid or unsupported post record" />
···
                     richText={item.richText}
                     style={[pal.text, s.flex1]}
                     lineHeight={1.3}
+                    numberOfLines={limitLines ? MAX_POST_LINES : undefined}
                   />
                 </View>
+              ) : undefined}
+              {limitLines ? (
+                <TextLink
+                  text="Show More"
+                  style={pal.link}
+                  onPress={onPressShowMore}
+                  href="#"
+                />
               ) : undefined}
               {item.post.embed && (
                 <ContentHider

src/view/com/post/Post.tsx

···
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {PostThreadModel} from 'state/models/content/post-thread'
 import {PostThreadItemModel} from 'state/models/content/post-thread-item'
-import {Link} from '../util/Link'
+import {Link, TextLink} from '../util/Link'
 import {UserInfoText} from '../util/UserInfoText'
 import {PostMeta} from '../util/PostMeta'
 import {PostEmbeds} from '../util/post-embeds'
···
 import {usePalette} from 'lib/hooks/usePalette'
 import {getTranslatorLink} from '../../../locale/helpers'
 import {makeProfileLink} from 'lib/routes/links'
+import {MAX_POST_LINES} from 'lib/constants'
+import {countLines} from 'lib/strings/helpers'
 
 export const Post = observer(function PostImpl({
   view,
···
 }) {
   const pal = usePalette('default')
   const store = useStores()
-
+  const [limitLines, setLimitLines] = React.useState(
+    countLines(item.richText?.text) >= MAX_POST_LINES,
+  )
   const itemUri = item.post.uri
   const itemCid = item.post.cid
   const itemUrip = new AtUri(item.post.uri)
···
     )
   }, [item, setDeleted, store])
 
+  const onPressShowMore = React.useCallback(() => {
+    setLimitLines(false)
+  }, [setLimitLines])
+
   return (
     <Link href={itemHref} style={[styles.outer, pal.view, pal.border, style]}>
       {showReplyLine && <View style={styles.replyLine} />}
···
                   type="post-text"
                   richText={item.richText}
                   lineHeight={1.3}
+                  numberOfLines={limitLines ? MAX_POST_LINES : undefined}
                   style={s.flex1}
                 />
               </View>
+            ) : undefined}
+            {limitLines ? (
+              <TextLink
+                text="Show More"
+                style={pal.link}
+                onPress={onPressShowMore}
+                href="#"
+              />
             ) : undefined}
             {item.post.embed ? (
               <ContentHider

src/view/com/posts/FeedItem.tsx

···
 } from '@fortawesome/react-native-fontawesome'
 import {PostsFeedItemModel} from 'state/models/feeds/post'
 import {FeedSourceInfo} from 'lib/api/feed/types'
-import {Link, TextLinkOnWebOnly} from '../util/Link'
+import {Link, TextLinkOnWebOnly, TextLink} from '../util/Link'
 import {Text} from '../util/text/Text'
 import {UserInfoText} from '../util/UserInfoText'
 import {PostMeta} from '../util/PostMeta'
···
 import {getTranslatorLink} from '../../../locale/helpers'
 import {makeProfileLink} from 'lib/routes/links'
 import {isEmbedByEmbedder} from 'lib/embeds'
+import {MAX_POST_LINES} from 'lib/constants'
+import {countLines} from 'lib/strings/helpers'
 
 export const FeedItem = observer(function FeedItemImpl({
   item,
···
   const pal = usePalette('default')
   const {track} = useAnalytics()
   const [deleted, setDeleted] = useState(false)
+  const [limitLines, setLimitLines] = useState(
+    countLines(item.richText?.text) >= MAX_POST_LINES,
+  )
   const record = item.postRecord
   const itemUri = item.post.uri
   const itemCid = item.post.cid
···
       },
     )
   }, [track, item, setDeleted, store])
+
+  const onPressShowMore = React.useCallback(() => {
+    setLimitLines(false)
+  }, [setLimitLines])
 
   const outerStyles = [
     styles.outer,
···
                   type="post-text"
                   richText={item.richText}
                   lineHeight={1.3}
+                  numberOfLines={limitLines ? MAX_POST_LINES : undefined}
                   style={s.flex1}
                 />
               </View>
+            ) : undefined}
+            {limitLines ? (
+              <TextLink
+                text="Show More"
+                style={pal.link}
+                onPress={onPressShowMore}
+                href="#"
+              />
             ) : undefined}
             {item.post.embed ? (
               <ContentHider

src/view/com/util/text/RichText.tsx

···
         testID={testID}
         type={type}
         style={[style, pal.text, lineHeightStyle]}
+        numberOfLines={numberOfLines}
         // @ts-ignore web only -prf
         dataSet={WORD_WRAP}>
         {text}