Double Navigation Stacks

App.js

@@ -16,9 +16,8 @@ const Tab = createMaterialBottomTabNavigator();
 
 const Stack = createNativeStackNavigator();
 
-export default function App() {
+const MainNavigation = () => {
     return (
-        <NavigationContainer>
             <Tab.Navigator initialRouteName="Home"
                 activeColor="#0d6efd"
                 inactiveColor="#FFFFFF"
@@ -39,19 +38,25 @@ export default function App() {
                         },
                     })}
                 />
-                <Tab.Screen 
+                
+                <Tab.Screen name="Logout" component={Login} />
+            </Tab.Navigator>
+    )
+}
+
+export default function App() {
+    return (
+        <NavigationContainer>
+            <Stack.Navigator>
+                <Stack.Screen name="Home" component={MainNavigation} options={{headerShown:false}} />
+                <Stack.Screen
                     name="Profile"
                     component={Profile}
                     options={{
-                        tabBarLabel: 'Profile',
+                        tabBarLabel: 'Profile'
-                        tabBarIcon: ({ color }) => (
-                            <MaterialIcons name="person" color={color} size={26} />
-                        ),
-                        tabBarBadge: false
                     }}
                 />
-                <Tab.Screen name="Logou" component={Login} />
+            </Stack.Navigator>
-            </Tab.Navigator>
         </NavigationContainer>
     );
 }

Views/Feed.js

@@ -36,6 +36,8 @@ let Feed = ({ navigation, route }) => {
         //console.log(posts)
     }, [route.params]);
     const renderPost = (({ item }) => {
+        if(item.nonOrganicType === 'PopularUsers' || item.nonOrganicType === 'PopularGroups')
+            return (<></>);
         return (<Post post={item} viewer={Me} />);
     });
 

components/Post.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
-import { Text, ScrollView, FlatList, StyleSheet } from 'react-native';
+import { Text, ScrollView, FlatList, StyleSheet, View } from 'react-native';
-import { Avatar, Button, Card, Title, Paragraph } from 'react-native-paper';
+import { Avatar, Button, Card, Title, Chip } from 'react-native-paper';
 import API from './../API.js';
 import UserName from './UserName.js';
 import Media from './Media.js';
@@ -53,13 +53,20 @@ let Post = (props) => {
     return (
         <Card style={styles.card}>
             <Card.Content>
-                <Text style={styles.userName}>
+                {!post.nonOrganicType ?
-                    <UserName profileid={post.profileid} />
+                    <View>
-                    {toProfileText}
+                        <Text style={styles.userName}>
-                </Text>
+                            <UserName profileid={post.profileid} />
-                <Text style={{ fontSize: 18 }}>{cleanContent}</Text>
+                            {toProfileText}
-                <Media content={post.content} />
+                        </Text>
-
+                        <Text style={{ fontSize: 18 }}>{cleanContent}</Text>
+                        <Media content={post.content} />
+                    </View> :
+                    <View>
+                        <Chip icon="new-releases" style={{width:100}} >News</Chip>
+                        <Text style={{ fontSize: 18 }}>{cleanContent}</Text>
+                    </View>
+                }
             </Card.Content>
             <Card.Actions style={{ flexDirection: "row", flow: 4, justifyContent: 'space-evenly', fontSize: 18 }}>
                 <Button