feat: adding links to open mandatory websites (#457)

* feat: adding links to open mandatory websites * feat: code smell optimization
SocialGouv · Nov 2, 2022 · a9ca88e · a9ca88e
1 parent a772219
commit a9ca88e
Show file tree

Hide file tree

Showing 2 changed files with 62 additions and 1 deletion.
diff --git a/tumeplayMobile/src/components/global/LinkOpenner.js b/tumeplayMobile/src/components/global/LinkOpenner.js
@@ -0,0 +1,30 @@
+import {TouchableOpacity, Linking, View} from 'react-native';
+import React from 'react';
+
+const LinkOpenner = ({children, url}) => {
+  const onPress = () => {
+    Linking.canOpenURL(url).then(supported => {
+      if (supported) {
+        Linking.openURL(url);
+      } else {
+        console.log("Don't know how to open URI: " + url);
+      }
+    });
+  };
+
+  return (
+    <TouchableOpacity onPress={onPress}>
+      <View
+        style={{
+          display: 'flex',
+          flexDirection: 'row',
+          width: '100%',
+          marginVertical: 10,
+        }}>
+        {children}
+      </View>
+    </TouchableOpacity>
+  );
+};
+
+export default LinkOpenner;
diff --git a/tumeplayMobile/src/views/Menu.js b/tumeplayMobile/src/views/Menu.js
@@ -1,11 +1,12 @@
-import {StyleSheet, TouchableOpacity} from 'react-native';
+import {StyleSheet, TouchableOpacity, View} from 'react-native';
 import Container from '../components/global/Container';
 import React from 'react';
 import Text from '../components/Text';
 import {useNavigation} from '@react-navigation/native';
 import SponsorCard from '../components/Menu/SponsorCard';
 import config from '../../config';
 import Icon from 'react-native-vector-icons/MaterialIcons';
+import LinkOpenner from '../components/global/LinkOpenner';
 
 const Menu = () => {
   const navigation = useNavigation();
@@ -18,6 +19,26 @@ const Menu = () => {
         <Text>Fermer</Text>
       </TouchableOpacity>
       <SponsorCard navigation={navigation} />
+      <View style={styles.linkContainer}>
+        <LinkOpenner
+          url={'https://tumeplay.fabrique.social.gouv.fr/legal/mobile'}
+          style={styles.link}>
+          <Icon name="open-in-new" size={15} style={styles.icon} />
+
+          <Text>Mentions légales</Text>
+        </LinkOpenner>
+        <LinkOpenner
+          url={'https://tumeplay.fabrique.social.gouv.fr/confidentiality'}
+          style={styles.link}>
+          <Icon name="open-in-new" size={15} style={styles.icon} />
+
+          <Text>Politique de Confidentialité</Text>
+        </LinkOpenner>
+        <LinkOpenner url={'https://www.tumeplay.com/cgu'} style={styles.link}>
+          <Icon name="open-in-new" size={15} style={styles.icon} />
+          <Text>Conditions Générales d'Utilisation</Text>
+        </LinkOpenner>
+      </View>
     </Container>
   );
 };
@@ -35,6 +56,16 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     alignItems: 'center',
   },
+  linkContainer: {
+    flex: 1,
+    width: '100%',
+    paddingHorizontal: 20,
+    marginVertical: 20,
+    justifyContent: 'flex-start',
+  },
+  icon: {
+    marginRight: 10,
+  },
 });
 
 export default Menu;