Add Bible picker flow and chapter navigation UI

components/Post.js

@@ -14,6 +14,8 @@ import ProfilePhotoCircle from './ProfilePhotoCircle.js';
 import { posthog } from './../PostHog.js';
 import { useNavigation } from '@react-navigation/native';
 import ParsedText from 'react-native-parsed-text';
+import BibleEmbeddedView from './BibleEmbeddedView.js';
+import { stripBibleTokens } from '../utils/bibleReferences.js';
 
 
 let Post = (props) => {
@@ -30,7 +32,7 @@ let Post = (props) => {
     const SWIPE_WIDTH = 86;
     let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
         <ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined;
-    let cleanContent = post.content.replace(/@[A-z]+:.+\w/g, '').trim();
+    let cleanContent = stripInlineTags(stripBibleTokens(post.content));
     const navigation = useNavigation();
     //cleanContent = convertLinks(cleanContent);
     const newComentAdded = (commentData) => {
@@ -172,6 +174,9 @@ let Post = (props) => {
                                 {cleanContent}
                             </ParsedText>
                         </Pressable>
+                        <View style={{ paddingLeft: 40, paddingRight: 8 }}>
+                            <BibleEmbeddedView content={post.content} openChapterOnPress />
+                        </View>
 
                         <View
                             onStartShouldSetResponderCapture={() => {
@@ -356,3 +361,10 @@ const styles = StyleSheet.create({
         textDecorationLine: 'underline',
     },
 });
+    const stripInlineTags = (content = "") => {
+        return String(content || "")
+            .replace(/@[A-Za-z]+:[^\s]+/g, "")
+            .replace(/[ \t]{2,}/g, " ")
+            .replace(/[ \t]+\n/g, "\n")
+            .trim();
+    };