Some more UI changes for circle profile

Views/Profile.js

@@ -34,6 +34,7 @@ let Profile = ({ navigation, route }) => {
     let [profile, setProfile] = useState({});
     const [showNewPost, setShowNewPost] = useState(false);
     const [tag, setTag] = useState('');
+    const [loading, setLoading] = useState(true);
 
     useEffect(() => {
         let subscribed = true;
@@ -50,6 +51,7 @@ let Profile = ({ navigation, route }) => {
                 await getProfilePosts(route.params.profileid).then(setPosts);
                 console.log('Loaded Cache Profile:' + route.params.profileid);
                 API.getPosts(route.params.profileid).then((data) => {
+                    setLoading(false);
                     if(!subscribed) return 0;
                     setPosts(data);
                     storeProfilePosts(route.params.profileid, data);
@@ -135,20 +137,21 @@ let Profile = ({ navigation, route }) => {
     return (
         <SafeAreaView style={styles.container}>
             <View>
-                {(Posts.length !== 0 || profile._id) &&
+                {(Posts.length !== 0 || profile._id) ?
                     <FlatList
                         data={Posts}
                         renderItem={renderPost}
                         keyExtractor={item => item.lastUpdated || item._id  || item.ceatedAt}
                         ListHeaderComponent={header}
-                        refreshing={Posts.length === 0}
+                        refreshing={loading}
                         initialNumToRender={3}
                         maxToRenderPerBatch={3}
                         removeClippedSubviews={true}
                         onRefresh={() => {
                             API.getPosts(route.params.profileid).then(setPosts);
                         }}
-                    />
+                    /> :
+                    <></> //TODO: Add empty profile card here
                 }
             </View>
             <StatusBar style="auto" />