feat(messenger): add conversation devtool / update map on globals

Signed-off-by: clegirar <clemntgirard@gmail.com>

js/packages/components/settings/AddContactList.js

@@ -12,15 +12,14 @@ import { globals } from '@berty-tech/config'
 
 const BodyAddContactList = () => {
 	const [{ color, padding, flex, margin }] = useStyles()
-	const contactsName = Object.keys(globals.berty.contacts)
 	const navigation = useNavigation()
 
 	return (
 		<View style={[padding.medium, flex.tiny, margin.bottom.small]}>
-			{Object.values(globals.berty.contacts).map((value, key) => {
+			{Object.values(globals.berty.contacts).map((value) => {
 				return (
 					<ButtonSetting
-						name={'Add ' + contactsName[key]}
+						name={'Add ' + value.name}
 						icon='book-outline'
 						iconSize={30}
 						iconColor={color.dark.grey}

js/packages/components/settings/AddConversationList.js

@@ -0,0 +1,55 @@
+import React from 'react'
+import { View, ScrollView } from 'react-native'
+import { Layout } from 'react-native-ui-kitten'
+
+import { HeaderSettings } from '../shared-components/Header'
+import { ButtonSetting } from '../shared-components/SettingsButtons'
+import { useNavigation } from '@react-navigation/native'
+import { SwipeNavRecognizer } from '../shared-components/SwipeNavRecognizer'
+
+import { useStyles } from '@berty-tech/styles'
+import { globals } from '@berty-tech/config'
+
+const BodyAddConversationList = () => {
+	const [{ color, padding, flex, margin }] = useStyles()
+	const navigation = useNavigation()
+
+	return (
+		<View style={[padding.medium, flex.tiny, margin.bottom.small]}>
+			{Object.values(globals.berty.conversations).map((value) => {
+				return (
+					<ButtonSetting
+						name={'Add ' + value.name}
+						icon='book-outline'
+						iconSize={30}
+						iconColor={color.dark.grey}
+						actionIcon={null}
+						onPress={() => {
+							navigation.navigate('Main.Home')
+							navigation.navigate('Modals', {
+								screen: 'ManageDeepLink',
+								params: { type: 'link', value: value.link },
+							})
+						}}
+					/>
+				)
+			})}
+		</View>
+	)
+}
+
+export const AddConversationList = () => {
+	const [{ color, padding, flex, background }] = useStyles()
+	const { goBack } = useNavigation()
+
+	return (
+		<Layout style={[background.white, flex.tiny]}>
+			<SwipeNavRecognizer>
+				<ScrollView bounces={false} contentContainerStyle={padding.bottom.scale(90)}>
+					<HeaderSettings title='Add contacts list' bgColor={color.dark.grey} undo={goBack} />
+					<BodyAddConversationList />
+				</ScrollView>
+			</SwipeNavRecognizer>
+		</Layout>
+	)
+}

js/packages/components/settings/DevTools.tsx

@@ -302,6 +302,13 @@ const BodyDevTools: React.FC<{}> = () => {
 				iconColor={color.dark.grey}
 				onPress={() => navigation.navigate('Settings.AddContactList')}
 			/>
+			<ButtonSetting
+				name='Add conversations'
+				icon='info-outline'
+				iconSize={30}
+				iconColor={color.dark.grey}
+				onPress={() => navigation.navigate('Settings.AddConversationList')}
+			/>
 			<TracingButton />
 			<DiscordShareButton />
 			<NativeCallButton />

js/packages/components/settings/index.ts

@@ -14,5 +14,6 @@ export { IpfsWebUI } from './IpfsWebUI'
 export { EditProfile } from './EditProfile'
 export { DevText } from './DevText'
 export { SystemInfo } from './SystemInfo'
-export { FakeData } from './FakeData'
 export { AddContactList } from './AddContactList'
+export { AddConversationList } from './AddConversationList'
+export { FakeData } from './FakeData'

js/packages/navigation/stacks.tsx

@@ -278,6 +278,10 @@ export const Navigation: React.FC = () => {
 				name={Routes.Settings.AddContactList}
 				component={Components.Settings.AddContactList}
 			/>
+			<NavigationStack.Screen
+				name={Routes.Settings.AddConversationList}
+				component={Components.Settings.AddConversationList}
+			/>
 			<NavigationStack.Screen
 				name={Routes.Settings.SystemInfo}
 				component={Components.Settings.SystemInfo}

js/packages/navigation/types.ts

@@ -50,6 +50,7 @@ export namespace ScreenProps {
 		export type SystemInfo = RouteProps<void>
 		export type FakeData = RouteProps<void>
 		export type AddContactList = RouteProps<void>
+		export type AddConversationList = RouteProps<void>
 		export type DevText = RouteProps<{ text: string }>
 	}
 	export namespace Modals {
@@ -112,6 +113,7 @@ export namespace Routes {
 		DevText = 'Settings.DevText',
 		FakeData = 'Settings.FakeData',
 		AddContactList = 'Settings.AddContactList',
+		AddConversationList = 'Settings.AddConversationList',
 	}
 	export enum Modals {
 		SendContactRequest = 'SendContactRequest',