New post view + fix moment location

Views/Feed.js

@@ -1,10 +1,7 @@
-import { StatusBar } from 'expo-status-bar';
 import React, { useState, useEffect } from 'react';
-import { View, ActivityIndicator, StyleSheet, SafeAreaView, FlatList } from 'react-native';
+import { StyleSheet, SafeAreaView, FlatList } from 'react-native';
 import API from './../API.js';
 import Post from './../components/Post.js';
-import NewPost from "./../components/NewPost.js";
-import { useSnapshot } from 'valtio';
 import GlobalState from '../contexts/GlobalState.js';
 
 import AsyncStorage from '@react-native-async-storage/async-storage';

Views/Menu.js

@@ -4,6 +4,8 @@ import { Text, List, RadioButton } from "react-native-paper";
 import { SafeAreaView } from "react-native-safe-area-context";
 import i18n from "../i18nMessages.js";
 import Moment from 'moment';
+import 'moment/min/locales';
+Moment.locale(i18n.locale);
 
 
 let MenuView = ()=>{

Views/NewPost.js

@@ -1,14 +1,129 @@
-import { View } from "react-native";
-import NewPost from "../components/NewPost";
+import React, { useState } from 'react';
+import { View, TextInput, Image } from "react-native";
+import { Text, Button, Divider } from "react-native-paper";
+import { SafeAreaView } from "react-native-safe-area-context";
+import API from './../API.js';
+import { useNavigation } from '@react-navigation/native';
+import * as ImagePicker from 'expo-image-picker';
+import i18n from "../i18nMessages";
+import Media from '../components/Media';
 
 
-let NewPostView = ()=>{
+let NewPostView = ({writeTo})=>{
+    let [postContent, setPostContent] = useState('');
+    let [extraContent, setExtraContent] = useState([]);
+    const [photo, setPhoto] = React.useState(null);
+    const navigation = useNavigation();
+    const pickImage = async () => {
+        // No permissions request is necessary for launching the image library
+        let result = await ImagePicker.launchImageLibraryAsync({
+            mediaTypes: ImagePicker.MediaTypeOptions.Images,
+            //allowsEditing: true,
+            //aspect: [4, 3],
+            //quality: 1,
+            allowsMultipleSelection: true,
+        });
+        if (!result.cancelled) {
+            setPhoto(result);
+            let newPhotoURL = await handleUploadPhoto(result);
+            let newExtraContent = ["@image:" + newPhotoURL].concat(extraContent);
+            setExtraContent(newExtraContent);
+            console.log(newExtraContent.join(" "));
+            setPhoto(null);
+        }
+    };
+
+    const handleUploadPhoto = async (photo) => {
+        if (!photo) return;
+        const uri =
+            Platform.OS === "android"
+                ? photo.uri
+                : photo.uri.replace("file://", "");
+        const filename = photo.uri.split("/").pop();
+        const match = /\.(\w+)$/.exec(filename);
+        const ext = match?.[1];
+        const type = match ? `image/${match[1]}` : `image`;
+        const formData = new FormData();
+        formData.append("banner", {
+            uri,
+            name: `image.${ext}`,
+            type,
+        });
+        try {
+            let uploadedFile = await fetch("https://social.emmint.com/upload.php", {
+                method: "POST",
+                body: formData,
+                headers: { "Content-Type": "multipart/form-data" }
+            })
+                .then((res) => res.json())
+                .then((data) => {
+                    console.log(data);
+                    return data.fileName;
+                })
+                .catch((err) => console.error(err));
+            return uploadedFile;
+        } catch (err) {
+            console.log(err);
+            alert("Something went wrong");
+        }
+
+    };
+
+    const handleNewPostButton = async () => {
+        //setPostContent('');
+        API.newPost(postContent + " " + extraContent.join(" ")).then((newPost) => {
+            setPostContent('');
+            setExtraContent([]);
+            navigation.goBack();
+            //if (newPostCB) newPostCB(newPost);
+        });
+    }
+
     return (
-        <View>
-            <NewPost >
-
-            </NewPost>
-        </View>
+        <SafeAreaView>
+            <View style={{padding: 10}}>
+                <View style={{flexDirection:"row", marginBottom:10, justifyContent:"space-around"}}>
+                    <Text style={{fontSize: 25}}>{i18n.t("message.statusUpdate")}:</Text>
+                    <Button icon="send" mode="outlined" onPress={handleNewPostButton}>
+                        {i18n.t("message.post")}
+                    </Button>
+                </View>
+                <Divider bold={true}/>
+                <TextInput
+                    value={postContent}
+                    onChangeText={setPostContent}
+                    multiline={true}
+                    numberOfLines={8}
+                    style={{
+                        backgroundColor: "rgba(0,0,0,0)",
+                        textAlignVertical: "center",
+                        textAlign: "center",
+                        fontSize: 20,
+                    }}
+                    autoFocus={true}
+                />
+                <Divider  bold={true} />
+                <View style={{flexDirection:"row", marginTop:10, justifyContent:"space-around"}}>
+                    <Button icon="add-a-photo" mode="outlined" onPress={pickImage}>
+                        Add Photos
+                    </Button>
+                </View>
+                {photo && (
+                    <View>
+                        <Text>Uploading...</Text>
+                        <Image
+                            source={{ uri: photo.uri }}
+                            style={{ width: 100, height: 100 }}
+                        />
+                    </View>
+                )}
+                {
+                    extraContent.length > 0 && (
+                        <Media content={extraContent.join(" ")} />
+                    )
+                }
+            </View>
+        </SafeAreaView>
     )
 }