refactor(rn): updaters

Signed-off-by: Godefroy Ponsinet <godefroy.ponsinet@outlook.com>

client/react-native/common/components/Screens/Accounts/Current.js

@@ -5,7 +5,7 @@ import React, { PureComponent } from 'react'
 
 import { Loader } from '../../Library'
 import { environment, RelayContext, contextValue } from '../../../relay'
-import { queries, mutations, subscriptions } from '../../../graphql'
+import { queries, mutations, subscriptions, updaters } from '../../../graphql'
 import Main from '../Main'
 
 const { CoreModule } = NativeModules
@@ -51,6 +51,7 @@ export default class Current extends PureComponent {
           mutations,
           subscriptions,
           queries,
+          updaters,
         }),
         loading: false,
       },
@@ -65,7 +66,6 @@ export default class Current extends PureComponent {
     if (loading) {
       return <Loader message='Setting up berty :)' />
     }
-    console.log('test')
     return (
       <RelayContext.Provider value={context}>
         <Main

client/react-native/common/components/Screens/Chats/Add.js

@@ -141,10 +141,11 @@ export default class ListScreen extends Component {
     return (
       <Screen style={[{ backgroundColor: colors.white }]}>
         <Pagination
+          context={this.props.screenProps.context}
           query={queries.ContactList.graphql}
           variables={queries.ContactList.defaultVariables}
           fragment={fragments.ContactList}
-          connection='ContactList'
+          alias='ContactList'
           renderItem={props => (
             <Item
               {...props}

client/react-native/common/components/Screens/Chats/Detail.js

@@ -167,6 +167,7 @@ export default class Detail extends PureComponent {
     return (
       <Screen style={{ backgroundColor: colors.white, paddingTop: 0 }}>
         <Pagination
+          context={this.props.screenProps.context}
           direction='forward'
           query={queries.EventList.graphql}
           variables={merge([
@@ -180,7 +181,7 @@ export default class Detail extends PureComponent {
           ])}
           subscriptions={[this.props.screenProps.context.subscriptions.conversationNewMessage(conversation)]}
           fragment={fragments.EventList}
-          connection='EventList'
+          alias='EventList'
           renderItem={props => <Message {...props} navigation={navigation} />}
           inverted
           style={{ paddingTop: 48 }}

client/react-native/common/components/Screens/Chats/List.js

@@ -51,11 +51,12 @@ export default class ListScreen extends PureComponent {
     return (
       <Screen style={[{ backgroundColor: colors.white }]}>
         <Pagination
+          context={this.props.screenProps.context}
           direction='forward'
           query={queries.ConversationList.graphql}
           variables={queries.ConversationList.defaultVariables}
           fragment={fragments.ConversationList}
-          connection='ConversationList'
+          alias='ConversationList'
           renderItem={props => <Item {...props} navigation={navigation} />}
         />
       </Screen>

client/react-native/common/components/Screens/Contacts/Add/Request.js

@@ -185,25 +185,27 @@ const Item = fragments.Contact(
 
 class Received extends PureComponent {
   render () {
-    const {
-      navigation,
-      screenProps: {
-        context: { queries },
-      },
-    } = this.props
-
+    const { navigation, screenProps } = this.props
+    const { queries } = screenProps.context
     return (
       <Screen style={[{ backgroundColor: colors.white }]}>
         <Pagination
+          context={this.props.screenProps.context}
           direction='forward'
           query={queries.ContactList.graphql}
           variables={merge([
             queries.ContactList.defaultVariables,
             { filter: { status: 4 } },
           ])}
           fragment={fragments.ContactList}
-          connection='ContactList'
-          renderItem={props => <Item {...props} navigation={navigation} />}
+          alias='ContactList'
+          renderItem={props => (
+            <Item
+              {...props}
+              navigation={navigation}
+              screenProps={screenProps}
+            />
+          )}
         />
       </Screen>
     )
@@ -229,7 +231,7 @@ class Sent extends PureComponent {
             { filter: { status: 3 } },
           ])}
           fragment={fragments.ContactList}
-          connection='ContactList'
+          alias='ContactList'
           renderItem={props => <Item {...props} navigation={navigation} />}
         />
       </Screen>

client/react-native/common/components/Screens/Contacts/List.js

@@ -74,7 +74,7 @@ export default class ContactList extends PureComponent {
   render () {
     const {
       screenProps: {
-        context: { queries },
+        context: { queries, subscriptions },
       },
     } = this.props
     return (
@@ -84,7 +84,8 @@ export default class ContactList extends PureComponent {
           query={queries.ContactList.graphql}
           variables={queries.ContactList.defaultVariables}
           fragment={fragments.ContactList}
-          connection='ContactList'
+          alias='ContactList'
+          subscriptions={[subscriptions.contactRequest]}
           renderItem={props => (
             <Item {...props} navigation={this.props.navigation} />
           )}

client/react-native/common/components/Screens/Settings/Devtools/EventList.js

@@ -153,13 +153,14 @@ export default class EventList extends PureComponent {
     return (
       <Screen style={{ backgroundColor: colors.white }}>
         <Pagination
+          context={this.props.screenProps.context}
           query={queries.EventList.graphql}
           variables={{
             ...queries.EventList.defaultVariables,
             ...navigation.getParam('filters'),
           }}
           fragment={fragments.EventList}
-          connection='EventList'
+          alias='EventList'
           renderItem={props => <Item {...props} navigation={navigation} />}
         />
       </Screen>

client/react-native/common/graphql/fragments/ContactList.js

@@ -1,64 +1,20 @@
 import { graphql } from 'react-relay'
 
-import { contact } from '../../utils'
-import { merge } from '../../helpers'
-import { updater as updaterHelper } from '../../relay'
-
-export const defaultArguments = {
-  default: {
-    filter: contact.default,
-    orderBy: '',
-    orderDesc: false,
-  },
-  Received: {
-    filter: {
-      ...contact.default,
-      status: 4,
-    },
-    orderBy: '',
-    orderDesc: false,
-  },
-  Sent: {
-    filter: {
-      ...contact.default,
-      status: 3,
-    },
-    orderBy: '',
-    orderDesc: false,
-  },
-}
-
-export const updater = {
-  default: (store, args = {}) =>
-    updaterHelper(store).connection(
-      'ContactList_ContactList',
-      merge([defaultArguments.Default, args])
-    ),
-  Received: (store, args = {}) =>
-    updaterHelper(store).connection(
-      'ContactListReceived_ContactList',
-      merge([defaultArguments.Received, args])
-    ),
-  Sent: (store, args = {}) =>
-    updaterHelper(store).connection(
-      'ContactListSent_ContactList',
-      merge([defaultArguments.Sent, args])
-    ),
-}
-
-export default graphql`
+const fragment = graphql`
   fragment ContactList on Query
     @argumentDefinitions(
       filter: { type: BertyEntityContactInput }
+      orderBy: { type: "String!" }
+      orderDesc: { type: "Bool!" }
       count: { type: "Int32" }
       cursor: { type: "String" }
     ) {
     ContactList(
       filter: $filter
       first: $count
       after: $cursor
-      orderBy: ""
-      orderDesc: false
+      orderBy: $orderBy
+      orderDesc: $orderDesc
     ) @connection(key: "ContactList_ContactList") {
       edges {
         cursor
@@ -77,3 +33,6 @@ export default graphql`
     }
   }
 `
+console.log(fragment.data())
+
+export default fragment

client/react-native/common/graphql/fragments/ConversationList.js

@@ -1,38 +1,20 @@
 import { graphql } from 'react-relay'
 
-import { conversation } from '../../utils'
-import { merge } from '../../helpers'
-import { updater as updaterHelper } from '../../relay'
-
-export const defaultArguments = {
-  default: {
-    filter: conversation.default,
-    orderBy: '',
-    orederDesc: false,
-  },
-}
-
-export const updater = {
-  default: (store, args = {}) =>
-    updaterHelper(store).connection(
-      'ConversationList_ConversationList',
-      merge([defaultArguments.default, args])
-    ),
-}
-
 export default graphql`
   fragment ConversationList on Query
     @argumentDefinitions(
       filter: { type: BertyEntityConversationInput }
+      orderBy: { type: "String!" }
+      orderDesc: { type: "Bool!" }
       count: { type: "Int32" }
       cursor: { type: "String" }
     ) {
     ConversationList(
       filter: $filter
       first: $count
       after: $cursor
-      orderBy: ""
-      orderDesc: false
+      orderBy: $orderBy
+      orderDesc: $orderDesc
     ) @connection(key: "ConversationList_ConversationList") {
       edges {
         cursor

client/react-native/common/graphql/fragments/EventList.js

@@ -1,40 +1,22 @@
 import { graphql } from 'react-relay'
 
-import { event } from '../../utils'
-import { merge } from '../../helpers'
-import { updater as updaterHelper } from '../../relay'
-
-export const defaultArguments = {
-  default: {
-    filter: event.default,
-    orderBy: 'created_at',
-    orderDesc: true,
-  },
-}
-
-export const updater = {
-  default: (store, args = {}) =>
-    updaterHelper(store).connection(
-      'EventList_EventList',
-      merge([defaultArguments.default, args])
-    ),
-}
-
 export default graphql`
   fragment EventList on Query
     @argumentDefinitions(
       filter: { type: BertyP2pEventInput }
+      orderBy: { type: "String!" }
+      orderDesc: { type: "Bool!" }
       count: { type: "Int32" }
       cursor: { type: "String" }
       onlyWithoutAckedAt: { type: "Enum" }
     ) {
     EventList(
       filter: $filter
+      orderBy: $orderBy
+      orderDesc: $orderDesc
       first: $count
       after: $cursor
       onlyWithoutAckedAt: $onlyWithoutAckedAt
-      orderBy: "created_at"
-      orderDesc: true
     ) @connection(key: "EventList_EventList") {
       edges {
         cursor

client/react-native/common/graphql/index.js

@@ -3,3 +3,4 @@ export * as queries from './queries'
 export * as subscriptions from './subscriptions'
 export * as fragments from './fragments'
 export * as enums from './enums.gen'
+export * as updaters from './updaters'

client/react-native/common/graphql/mutations/ContactAcceptRequest.js

@@ -1,9 +1,9 @@
 import { graphql } from 'react-relay'
 
-import { contact } from '../../utils'
-import { fragments } from '../../graphql'
 import { commit } from '../../relay'
+import { contact } from '../../utils'
 import { merge } from '../../helpers'
+import { updaters } from '..'
 
 const ContactAcceptRequestMutation = graphql`
   mutation ContactAcceptRequestMutation(
@@ -52,9 +52,11 @@ export default context => (input, configs) =>
     merge([contact.default, input]),
     {
       updater: (store, data) =>
-        fragments.ContactList.updater
-          .Received(store)
-          .delete(data.ContactAcceptRequest.id),
+        updaters.contactList.forEach(updater =>
+          updater(store)
+            .add('ContactEdge', data.ContactAcceptRequest.id)
+            .after()
+        ),
       ...configs,
     }
   )

client/react-native/common/graphql/mutations/ContactRemove.js

@@ -1,7 +1,7 @@
 import { graphql } from 'react-relay'
 import { commit } from '../../relay'
 import { contact } from '../../utils'
-import { fragments } from '../../graphql'
+import { updaters } from '../../graphql'
 
 const ContactRemoveMutation = graphql`
   mutation ContactRemoveMutation(
@@ -53,10 +53,9 @@ export default context => (input, configs) =>
     },
     {
       updater: (store, data) => {
-        fragments.ContactList.updater
-          .Received(store)
-          .delete(data.ContactRemove.id)
-        fragments.ContactList.updater.Sent(store).delete(data.ContactRemove.id)
+        updaters.contactList.forEach(updater =>
+          updater(store).delete(data.ContactRemove.id)
+        )
       },
       ...configs,
     }

client/react-native/common/graphql/mutations/ContactRequest.js

@@ -1,6 +1,8 @@
 import { graphql } from 'react-relay'
+
 import { commit } from '../../relay'
 import { contact } from '../../utils'
+import { updaters } from '..'
 
 const ContactRequestMutation = graphql`
   mutation ContactRequestMutation(
@@ -40,5 +42,11 @@ export default context => (input, configs) =>
       ...contact.default,
       ...input,
     },
-    configs
+    {
+      updater: (store, data) =>
+        updaters.contactList.forEach(updater =>
+          updater(store).add('ContactEdge', data.ContactRequest.id).after()
+        ),
+      ...configs,
+    }
   )