Merge branch 'master' into andrew/fix-inverted-flatlist

textileio · Mar 26, 2019 · 127a5b6 · 127a5b6
2 parents b167292 + e4bc36c
commit 127a5b6
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 23 deletions.
diff --git a/App/Components/Avatar.tsx b/App/Components/Avatar.tsx
@@ -26,6 +26,7 @@ type Props = OwnProps & StateProps & Partial<ImageProps>
 interface State {
   borderRadius: number
   showIcon: boolean
+  defaultSize: number
 }
 
 class Avatar extends React.Component<Props, State> {
@@ -34,7 +35,8 @@ class Avatar extends React.Component<Props, State> {
     super(props)
     this.state = {
       borderRadius: 0,
-      showIcon: false
+      showIcon: false,
+      defaultSize: 100
     }
   }
 
@@ -53,9 +55,8 @@ class Avatar extends React.Component<Props, State> {
   render () {
     const { style, icon, target, local, started, color } = this.props
 
-    const defaultSize = 100
-    let width: string | number = defaultSize
-    let height: string | number = defaultSize
+    let width: string | number = this.state.defaultSize
+    let height: string | number = this.state.defaultSize
     if (style) {
       if (style.width) {
         width = height = style.width
@@ -64,27 +65,55 @@ class Avatar extends React.Component<Props, State> {
       }
     }
     const { borderRadius: radius } = this.state
+    // avoid 0
+    const borderRadius = radius || Number(width) / 2
 
     if (icon || !started || !target) {
-      const heightNumber = typeof height === 'number' ? height as number : defaultSize
+      const heightNumber = typeof height === 'number' ? height as number : this.state.defaultSize
+      const borderWidth = this.props.style && this.props.style.borderWidth ? this.props.style.borderWidth as number : 0
       return (
-        <Icon
-          style={{ ...(this.props.style || {}), width, height, borderRadius: radius }}
-          name={icon || 'question-circle'}
-          size={heightNumber}
-          color={colors.grey_5}
+        <View
+          style={{
+            ...(this.props.style || {}),
+            borderRadius,
+            width,
+            height,
+            alignContent: 'center',
+            alignItems: 'center',
+            justifyContent: 'center'
+          }}
+        >
+          <Icon
+            style={{ width, height, textAlign: 'center' }}
+            name={icon || 'question-circle'}
+            size={heightNumber - borderWidth}
+            color={colors.grey_5}
+            onLayout={this.onImageLayout}
+          />
+        </View>
+      )
+
+      const tintColor = { tintColor: color }
+      return (
+        <Image
+          {...this.props}
+          source={{ uri: `${Config.RN_TEXTILE_CAFE_GATEWAY_URL}/ipfs/${target}/0/small/d` }}
+          style={{ ...(this.props.style || {}), ...tintColor, width, height, borderRadius }}
+          resizeMode={'cover'}
           onLayout={this.onImageLayout}
+          defaultSource={require('../Images/v2/empty.png')}
+          onLoad={this.onIconLoad}
         />
       )
     }
 
     // local means the target belongs to the local node
     if (local) {
-      const widthNumber = typeof width === 'number' ? width as number : defaultSize
+      const widthNumber = typeof width === 'number' ? width as number : this.state.defaultSize
       return (
-        <View style={{ ...(this.props.style || {}), width, height, borderRadius: radius, overflow: 'hidden' }}>
+        <View style={{ ...(this.props.style || {}), width, height, borderRadius, overflow: 'hidden' }}>
           <TextileImage
-            style={{ ...(this.props.style || {}), width, height, borderRadius: radius }}
+            style={{ ...(this.props.style || {}), width, height, borderRadius }}
             target={target}
             index={0}
             forMinWidth={widthNumber}
@@ -100,7 +129,7 @@ class Avatar extends React.Component<Props, State> {
       <Image
         {...this.props}
         source={{ uri: `${Config.RN_TEXTILE_CAFE_GATEWAY_URL}/ipfs/${target}/0/small/d` }}
-        style={{ ...(this.props.style || {}), ...tintColor, width, height, borderRadius: radius }}
+        style={{ ...(this.props.style || {}), ...tintColor, width, height, borderRadius }}
         resizeMode={'cover'}
         onLayout={this.onImageLayout}
         defaultSource={require('../Images/v2/empty.png')}

diff --git a/App/Services/EventHandlers/TextileNodeEventHandler.ts b/App/Services/EventHandlers/TextileNodeEventHandler.ts
@@ -50,8 +50,9 @@ export default class TextileNodeEventHandler {
         this.store.dispatch(PhotoViewingActions.refreshThreadRequest(update.thread))
       }
 
-      if (type_url === '/Join') {
-        // Every time the a JOIN block is detected, we should refresh our in-mem contact list
+      if (type_url === '/Join' ||
+          type_url === '/Leave') {
+        // Every time the a JOIN or LEAVE block is detected, we should refresh our in-mem contact list
         // Enhancement: compare the joiner id with known ids and skip the refresh if known.
         this.store.dispatch(contactsActions.getContactsRequest())
       }

diff --git a/App/features/contacts/selectors.ts b/App/features/contacts/selectors.ts
@@ -19,13 +19,22 @@ export const searchResults = (state: ContactsState) => {
   if (state.textileSearchResults.error) {
     textileData = [{ key: 'textile_error', type: 'error', data: state.textileSearchResults.error }]
   } else if (state.textileSearchResults.results && state.textileSearchResults.results.length > 0) {
-    textileData = state.textileSearchResults.results.map((result) => {
-      const selector = makeIsKnown(result.id)
-      const isContact = selector(state)
-      const adding = Object.keys(state.addingContacts).indexOf(result.id) > -1
-      const textileResult: TextileSearchResult = { key: result.id, type: 'textile', data: { contact: result, isContact, adding } }
-      return textileResult
-    })
+    textileData = state.textileSearchResults.results
+      .filter((current, index, arr) => {
+        const sames = arr.filter((el) => el.id === current.id)
+        if (sames.length === 1) {
+          return true
+        }
+        // If there is a newer entry, filter this one
+        return !(sames.find((el) => el.updated.seconds > current.updated.seconds || (el.updated.seconds === current.updated.seconds && el.updated.nanos > current.updated.nanos)))
+      })
+      .map((result) => {
+        const selector = makeIsKnown(result.id)
+        const isContact = selector(state)
+        const adding = Object.keys(state.addingContacts).indexOf(result.id) > -1
+        const textileResult: TextileSearchResult = { key: result.id, type: 'textile', data: { contact: result, isContact, adding } }
+        return textileResult
+      })
   } else if (state.textileSearchResults.results && state.textileSearchResults.results.length === 0) {
     textileData = [{ key: 'textile_empty', type: 'empty' }]
   }