#13517 amend registration page

Strides-APP/app/pages/sign/RegisterV4.js

@@ -3,7 +3,7 @@
  * @邠心vbe on 2023/02/06
  */
 import React from 'react';
-import { View, Text, ScrollView, StyleSheet, TextInput, Pressable, Image } from 'react-native';
+import { View, Text, ScrollView, StyleSheet, TextInput, Pressable, Image, Linking } from 'react-native';
 import apiUser from '../../api/apiUser';
 import Button from '../../components/Button';
 import { PageList } from '../Router';
@@ -39,7 +39,8 @@ export default class RegisterV4 extends React.Component {
     super(props);
     this.StrengthView = StrengthView.V4
     this.state = {
-      agree: true,
+      agree: false,
+      agree2: false,
       strength: 0,
       countryNum: '65',
       countryCode: "SG",
@@ -293,6 +294,12 @@ export default class RegisterV4 extends React.Component {
     })
   }
 
+  changeAgree2(ag) {
+    this.setState({
+      agree2: ag
+    })
+  }
+
   changeCountry(value, index) {
     this.setState({
       countryCode: value
@@ -312,6 +319,14 @@ export default class RegisterV4 extends React.Component {
     }
   }
 
+  toPrivayPolicy() {
+    Linking.openURL("https://stridesmobility.sg/chargeco-privacy-policy")
+  }
+
+  toUserTerms() {
+    Linking.openURL("https://chargeco.global/terms-of-use")
+  }
+
   render() {
     return (
       <View style={styles.container}>
@@ -520,7 +535,24 @@ export default class RegisterV4 extends React.Component {
                 />
               </View>
             </View> */}
+            <View style={styles.consentView}>
+              <TextView style={styles.consentTitle}>Consent and purpose notification</TextView>
+              <TextView style={styles.agreeText}>
+              We collect, use and disclose your personal data for the purpose of providing Electric Vehicle (EV) charging services to you. 
+              </TextView>
+            </View>
             <View style={styles.agreeView}>
+              <CheckBox
+                value={this.state.agree2}
+                onValueChange={v => this.changeAgree2(v)}
+              />
+              <View style={styles.agreeTextRow}>
+                <TextView style={styles.agreeText} onPress={() => this.changeAgree2(!this.state.agree2)}>
+                  I consent to Strides YTL Pte. Ltd. to collect, use and disclose my personal data for the above purposes and in accordance with the SMRT Corporation’s Privacy Statement and Personal Data Protection Act 2012.
+                </TextView>
+              </View>
+            </View>
+            <View style={styles.agreeView2}>
               <CheckBox
                 value={this.state.agree}
                 onValueChange={v => this.changeAgree(v)}
@@ -529,17 +561,17 @@ export default class RegisterV4 extends React.Component {
                 <TextView style={styles.agreeText} onPress={() => this.changeAgree(!this.state.agree)}>
                   {$t('sign.iHaveReadAndAgree')}
                 </TextView>
-                <TextView style={styles.agreeLink} onPress={() => startPage(PageList.condition)}>{$t('drawer.termsOfUse')}</TextView>
+                <TextView style={styles.agreeLink} onPress={() => this.toUserTerms()}>{$t('drawer.termsOfUse')}</TextView>
                 <TextView style={styles.agreeText}>{' '}</TextView>
                 <TextView style={styles.agreeText}>{$t('sign.linkAndLink')}</TextView>
-                <TextView style={styles.agreeLink} onPress={() => startPage(PageList.privacy)}>{$t('drawer.privacyPolicy')}</TextView>
+                <TextView style={styles.agreeLink} onPress={() => this.toPrivayPolicy()}>{$t('drawer.privacyPolicy')}</TextView>
                 <TextView style={styles.agreeText}>{$t('sign.linkAndLinkEnd')}</TextView>
               </View>
             </View>
             <Button
               style={styles.signButton}
               elevation={1.5}
-              disabled={!this.state.agree}
+              disabled={!this.state.agree || !this.state.agree2}
               text={$t('sign.btnSignUp')}
               fontSize={14}
               onClick={() => {
@@ -789,8 +821,25 @@ const styles = StyleSheet.create({
     height: $vw(28),
     borderRadius: 6
   },
+  consentView: {
+    paddingTop: 32
+  },
+  consentTitle: {
+    color: textPrimary,
+    fontSize: 15,
+    paddingTop: 2,
+    paddingBottom: 8,
+    fontWeight: 'bold',
+    textDecorationLine: 'underline'
+  },
   agreeView: {
-    marginTop: 24,
+    paddingTop: 16,
+    marginBottom: 8,
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+  },
+  agreeView2: {
+    marginTop: 8,
     marginBottom: 16,
     flexDirection: 'row',
     alignItems: 'flex-start',