Adding support to youtube videos.

Views/Invite.js

@@ -2,13 +2,22 @@ import React from "react";
 import { View, ImageBackground } from "react-native";
 import { Text, TextInput, Button, Divider, Checkbox } from "react-native-paper";
 import i18n from "../i18nMessages.js";
-import { useSnapshot } from 'valtio';
+import API from "../API";
-import GlobalState from '../contexts/GlobalState.js';
 
 
 let InviteView = ()=>{
-    const gState = useSnapshot(GlobalState);
+    const [name, setName] = React.useState("");
-    const viewer = gState.me;
+    const [email, setEmail] = React.useState("");
+    const [checked, setChecked] = React.useState("");
+
+    let sendInvite = async () => {
+        if(name != "" && email != "") return 0;
+        setName('');
+        setEmail('');
+        setChecked(false);
+        await API.newInvitation(name, email);
+    }
+
     return (
         <View style={{
             padding: 10,
@@ -22,16 +31,20 @@ let InviteView = ()=>{
                 <TextInput
                     label={i18n.t("message.name")}
                     style={{backgroundColor:"rgba(0,0,0,0)"}}
-                    value={''}
+                    value={name}
-                    //onChangeText={text => setText(text)}
+                    onChangeText={text => setName(text)}
                 />
                 <TextInput
                     label={i18n.t("message.email")}
                     style={{backgroundColor:"rgba(0,0,0,0)"}}
-                    value={''}
+                    value={email}
-                    //onChangeText={text => setText(text)}
+                    onChangeText={text => setEmail(text)}
+                />
+                <Checkbox.Item 
+                    label={i18n.t("message.IKnowThisPerson")} 
+                    status={checked ? "checked" : "unchecked"} 
+                    onPress={()=>{setChecked(!checked)}}
                 />
-                <Checkbox.Item label={i18n.t("message.IKnowThisPerson")} status="checked" />
                 <Divider />
                 <Button mode="outlined">Invite</Button>
             </ImageBackground>

components/Media.js

@@ -8,13 +8,20 @@ import { WebView } from 'react-native-webview';
 
 const videoIdF = (content) => {
     let vimeoTag = content.match(/@vimeo:[0-9]+/);
-    let youtubeTag = content.match(/@youtube:[0-z]+/);
+    if (!vimeoTag) return [];
-    if (!vimeoTag && !youtubeTag) return [];
+    let tag = vimeoTag;
-    let tag = youtubeTag || vimeoTag || hslTag;
     tag = tag[0].substring(1);
     return tag.split(':');
 };
 
+const youtubeIdF = (content) => {
+    let youtubeTag = content.match(/@youtube:[0-z]+/);
+    if (!youtubeTag) return '';
+    let tag = youtubeTag;
+    tag = tag[0].substring(1);
+    return tag.split(':')[1];
+};
+
 const hlsIdF = (content) => {
     let hslTag = content.match(/@hls:.+\w/);
     if (!hslTag) return '';
@@ -51,6 +58,7 @@ let Media = (props) => {
     const videosId = videoIdF(props.content);
     const hlsUrl = hlsIdF(props.content);
     const iframeSrc = iframeTagF(props.content) || [];
+    const youtubeId = youtubeIdF(props.content);
     const [videosFiles, setVideosFiles] = useState([]);
     const [poster, setPoster] = useState('');
     const [loaded, setLoaded] = useState(false);
@@ -97,6 +105,11 @@ let Media = (props) => {
             style={styles.iframe}
             source={{ uri: iframeSrc[1] }}
         /> : <></>;
+    const youtubeEmb = youtubeId.length ? 
+        <WebView
+            style={styles.iframe}
+            source={{ uri: "https://www.youtube.com/embed/" + youtubeId + "?fs=0" }}
+        /> : <></>;
     const renderImages = (({ item }) => {
         return (<Image source={{ uri: item[1] }} style={styles.flatlistImages} />);
     });
@@ -125,6 +138,7 @@ let Media = (props) => {
             {video}
             {video2}
             {iframe}
+            {youtubeEmb}
         </View>
     );
 }

components/Post.js

@@ -59,7 +59,7 @@ let Post = (props) => {
     return (
         <Card style={styles.card}>
             <Card.Content>
-                <Hyperlink linkDefault={ true } linkStyle={{}}>
+                <Hyperlink linkDefault={ true } linkStyle={ { color: '#2980b9'} }>
                     {!post.nonOrganicType ?
                         <View>
                             <Text style={styles.userName}>