Commit 3935a76c authored by Martin Santangelo's avatar Martin Santangelo

wip

parent 42fcc332
PODS:
- boost-for-react-native (1.63.0)
- BVLinearGradient (2.5.6):
- React
- Crypto (0.1.0):
- React
- DoubleConversion (1.1.6)
......@@ -252,7 +250,7 @@ PODS:
- React
- react-native-randombytes (3.5.3):
- React
- react-native-safe-area-context (0.7.3):
- react-native-safe-area-context (3.1.4):
- React
- react-native-slider (3.0.3):
- React
......@@ -316,8 +314,6 @@ PODS:
- React
- RNDeviceInfo (4.0.1):
- React
- RNExitApp (1.1.0):
- React
- RNFastImage (8.0.0):
- React
- SDWebImage (~> 5.0)
......@@ -384,7 +380,6 @@ PODS:
- Yoga (1.14.0)
DEPENDENCIES:
- BVLinearGradient (from `../node_modules/react-native-linear-gradient`)
- Crypto (from `../node_modules/react-native-minds-encryption`)
- DoubleConversion (from `../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec`)
- EXAV (from `../node_modules/expo-av/ios`)
......@@ -445,7 +440,6 @@ DEPENDENCIES:
- RNConvertPhAsset (from `../node_modules/react-native-convert-ph-asset`)
- "RNDateTimePicker (from `../node_modules/@react-native-community/datetimepicker`)"
- RNDeviceInfo (from `../node_modules/react-native-device-info`)
- RNExitApp (from `../node_modules/react-native-exit-app`)
- RNFastImage (from `../node_modules/react-native-fast-image`)
- RNFileShareIntent (from `../node_modules/react-native-file-share-intent`)
- RNFS (from `../node_modules/react-native-fs`)
......@@ -485,8 +479,6 @@ SPEC REPOS:
- TOCropViewController
EXTERNAL SOURCES:
BVLinearGradient:
:path: "../node_modules/react-native-linear-gradient"
Crypto:
:path: "../node_modules/react-native-minds-encryption"
DoubleConversion:
......@@ -601,8 +593,6 @@ EXTERNAL SOURCES:
:path: "../node_modules/@react-native-community/datetimepicker"
RNDeviceInfo:
:path: "../node_modules/react-native-device-info"
RNExitApp:
:path: "../node_modules/react-native-exit-app"
RNFastImage:
:path: "../node_modules/react-native-fast-image"
RNFileShareIntent:
......@@ -660,7 +650,6 @@ EXTERNAL SOURCES:
SPEC CHECKSUMS:
boost-for-react-native: 39c7adb57c4e60d6c5479dd8623128eb5b3f0f2c
BVLinearGradient: e3aad03778a456d77928f594a649e96995f1c872
Crypto: 523c2f143c741d3f61371c811c0983ee9c7d18ec
DoubleConversion: 5805e889d232975c086db112ece9ed034df7a0b2
EXAV: 9a5ff571128707309aa0376171f0903d49410352
......@@ -697,7 +686,7 @@ SPEC CHECKSUMS:
react-native-netinfo: ddaca8bbb9e6e914b1a23787ccb879bc642931c9
react-native-notifications: 163ddedac6fcc8d850ea15b06abdadcacdff00f1
react-native-randombytes: 3638d24759d67c68f6ccba60c52a7a8a8faa6a23
react-native-safe-area-context: e200d4433aba6b7e60b52da5f37af11f7a0b0392
react-native-safe-area-context: eb91fe1fb3f7b87d9c30a7f0808407d8569d539d
react-native-slider: e99fc201cefe81270fc9d81714a7a0f5e566b168
react-native-sqlite-storage: f06bfba10f67f989c00b6a699b9c2b80a816edbe
react-native-video: d01ed7ff1e38fa7dcc6c15c94cf505e661b7bfd0
......@@ -720,7 +709,6 @@ SPEC CHECKSUMS:
RNConvertPhAsset: 9b366b8a1abc194b76572712c6f7dd89c9e4e37f
RNDateTimePicker: e386ff4ef3300964ed0cad97ce6f206e0effbfdb
RNDeviceInfo: 687c1b2ab6d86ff1ca1208783320cd144138c7f2
RNExitApp: a5e276b66dda7e2fdd7aa15f63474011b122398e
RNFastImage: c104f15f04c4f68bd65c9645cc27900bbacd9cc7
RNFileShareIntent: 65b162c473575e83ce7dffc494dcda5a6b6ecbc0
RNFS: 2bd9eb49dc82fa9676382f0585b992c424cd59df
......
......@@ -70,7 +70,7 @@
"accept": "I have read and accept the",
"termsAndConditions": "terms of use",
"join": "Create a channel",
"createChannel": "Join Minds Now",
"createChannel": "Join Minds",
"haveAccount": "Don't have an account?",
"alreadyHaveAccount": "Already have an account? &{login}&",
"failedToLoginNewAccount": "The login with your new account has failed, please try to log in the login screen"
......
......@@ -46,6 +46,7 @@
"ethjs-signer": "^0.1.1",
"expo": "^38.0.8",
"expo-av": "^8.3.0",
"expo-linear-gradient": "^8.2.1",
"i18n-js": "^3.2.2",
"lodash": "^4.17.15",
"mobx": "^5.15.4",
......@@ -69,7 +70,6 @@
"react-native-device-log": "Minds/react-native-device-log#74f06b09c6656aa228a9a3a474c714d82abf509e",
"react-native-elements": "^2.0.0",
"react-native-exception-handler": "^2.10.8",
"react-native-exit-app": "wumke/react-native-exit-app",
"react-native-fast-image": "DylanVann/react-native-fast-image#e94e6fee66e1c60c6e8602eee20d7d5456b79a41",
"react-native-file-share-intent": "Minds/react-native-file-share-intent#316072d2d7ef7cb861048eae22c4b6614213a0d2",
"react-native-file-type": "^0.0.8",
......@@ -82,7 +82,6 @@
"react-native-image-progress": "^1.1.1",
"react-native-jitsi-meet": "Minds/react-native-jitsi-meet#a8362eecfbbbd93f64775cdcea24e3e9485461de",
"react-native-keyboard-accessory": "^0.1.11",
"react-native-linear-gradient": "^2.5.6",
"react-native-localize": "^1.3.0",
"react-native-material-menu": "^1.0.0",
"react-native-minds-encryption": "Minds/react-native-minds-encryption#736571522c9d5f96c9bc4b454b2828e3940b6ccc",
......@@ -97,8 +96,8 @@
"react-native-read-more-text": "devbelieve365/react-native-read-more-text",
"react-native-reanimated": "1.9.0",
"react-native-reanimated-indicators": "^2.0.0",
"react-native-redash": "^9.6.0",
"react-native-safe-area-context": "^0.7.2",
"react-native-redash": "^14.2.3",
"react-native-safe-area-context": "^3.1.4",
"react-native-screens": "^2.8.0",
"react-native-share": "^2.0.0",
"react-native-shared-element": "^0.7.0",
......@@ -118,7 +117,7 @@
"rne-modal-tooltip": "gist:b28c003d87c619674def0878473338a0",
"rxjs": "^6.5.5",
"socket.io-client": "^2.3.0",
"tipsi-stripe": "8.0.0-beta.8",
"tipsi-stripe": "8.0.0-beta.10",
"web3": "^1.2.2",
"yarn": "^1.22.4"
},
......
......@@ -7,7 +7,8 @@ import {
View,
Text,
LayoutAnimation,
// TextInput,
Dimensions,
Platform,
} from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';
......@@ -16,14 +17,51 @@ import authService from './AuthService';
import i18n from '../common/services/i18n.service';
import logService from '../common/services/log.service';
import Input from '../common/components/Input';
import Button from '../common/components/Button';
import ThemedStyles from '../styles/ThemedStyles';
import InputContainer from '../common/components/InputContainer';
import BoxShadow from '../common/components/BoxShadow';
type PropsType = {
onLogin: Function;
onLogin?: Function;
onRegisterPress?: Function;
onForgot: Function;
};
const backgroundColor = 'rgba(0,0,0,0.25)';
const inputBackground = {
backgroundColor,
borderColor: 'rgba(255,255,255,0.30)',
};
const shadow = {
backgroundColor: '#00000000',
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 0,
},
shadowOpacity: 0.8,
shadowRadius: 20,
elevation: 6,
overflow: 'visible',
zIndex: 999,
};
const lightButton = {
borderColor: 'rgba(255,255,255,0.20)',
};
const icon = { top: Platform.OS === 'ios' ? 26 : 28 };
const { height, width } = Dimensions.get('window');
const shadowOpt = {
width,
height: 170,
color: '#000',
border: 20,
opacity: 0.2,
x: 0,
y: 0,
};
const loginMargin = { marginTop: height / 55 };
/**
* Login Form
......@@ -55,63 +93,96 @@ export default class LoginForm extends Component<PropsType> {
* Render
*/
render() {
const CS = ThemedStyles.style;
const theme = ThemedStyles.style;
const msg = this.state.msg ? (
<Animatable.Text
animation="bounceInLeft"
useNativeDriver
style={[CS.subTitleText, CS.colorSecondaryText, CS.textCenter]}
style={[theme.subTitleText, theme.colorSecondaryText, theme.textCenter]}
testID="loginMsg">
{this.state.msg}
</Animatable.Text>
) : null;
return (
<View style={[CS.flexContainer, CS.marginTop6x]}>
<Text style={[CS.titleText, CS.colorPrimaryText, CS.marginBottom2x]}>
{i18n.t('auth.login')}
</Text>
{msg}
<Input
const inputs = (
<View style={shadow}>
<InputContainer
containerStyle={inputBackground}
placeholder={i18n.t('auth.username')}
onChangeText={this.setUsername}
value={this.state.username}
style={CS.marginBottom2x}
testID="usernameInput"
noBottomBorder
/>
<View>
<Input
<InputContainer
containerStyle={inputBackground}
placeholder={i18n.t('auth.password')}
secureTextEntry={this.state.hidePassword}
onChangeText={this.setPassword}
value={this.state.password}
style={CS.marginBottom2x}
testID="userPasswordInput"
/>
<Icon
name={this.state.hidePassword ? 'md-eye' : 'md-eye-off'}
size={25}
onPress={this.toggleHidePassword}
style={CS.inputIcon}
style={[theme.inputIcon, icon]}
/>
</View>
<Button
onPress={() => this.onLoginPress()}
text={i18n.t('auth.login')}
containerStyle={[CS.button, CS.fullWidth]}
textStyle={CS.buttonText}
key={1}
loading={this.state.inProgress}
loadingRight={true}
disabled={this.state.inProgress}
disabledStyle={CS.backgroundTransparent}
testID="loginButton"
/>
<View style={CS.marginTop4x}>
<Text style={[CS.link, CS.fontL]} onPress={this.onForgotPress}>
{i18n.t('auth.forgot')}
</Text>
</View>
);
const inputsWithShadow = Platform.select({
ios: inputs,
android: <BoxShadow setting={shadowOpt}>{inputs}</BoxShadow>,
});
return (
<View style={[theme.flexContainer, { backgroundColor: '#0000' }]}>
{msg}
{inputsWithShadow}
<View style={[theme.margin6x, theme.flexContainer]}>
<Button
onPress={() => this.onLoginPress()}
text={i18n.t('auth.login')}
containerStyle={[
theme.transparentButton,
theme.paddingVertical3x,
loginMargin,
theme.fullWidth,
]}
textStyle={theme.buttonText}
loading={this.state.inProgress}
disabled={this.state.inProgress}
disabledStyle={theme.backgroundTransparent}
testID="loginButton"
/>
<View style={theme.marginTop4x}>
<Text
style={[theme.colorWhite, theme.fontL, theme.textCenter]}
onPress={this.onForgotPress}>
{i18n.t('auth.forgot')}
</Text>
</View>
<View style={theme.flexContainer} />
<Button
onPress={() => this.props.onRegisterPress()}
text={i18n.t('auth.createChannel')}
containerStyle={[
theme.transparentButton,
theme.paddingVertical3x,
theme.fullWidth,
theme.marginTop6x,
lightButton,
]}
textStyle={theme.buttonText}
loading={this.state.inProgress}
disabled={this.state.inProgress}
disabledStyle={theme.backgroundTransparent}
testID="loginButton"
/>
</View>
</View>
);
......@@ -191,7 +262,9 @@ export default class LoginForm extends Component<PropsType> {
authService
.twoFactorAuth(this.state.twoFactorToken, this.state.twoFactorCode)
.then((data) => {
this.props.onLogin();
if (this.props.onLogin) {
this.props.onLogin();
}
})
.catch((err) => {
logService.exception('[LoginForm]', err);
......
//@ts-nocheck
import React, { Component } from 'react';
import {
StyleSheet,
View,
Keyboard,
Animated,
Text,
TouchableOpacity,
ScrollView,
Platform,
KeyboardAvoidingView,
} from 'react-native';
import React from 'react';
import { StyleSheet, View, Dimensions, Text } from 'react-native';
import Animated from 'react-native-reanimated';
import { useTransition, mix } from 'react-native-redash';
import LoginForm from './LoginForm';
import logService from '../common/services/log.service';
import i18nService from '../common/services/i18n.service';
import sessionService from '../common/services/session.service';
import ThemedStyles from '../styles/ThemedStyles';
import { SafeAreaView } from 'react-native-safe-area-context';
import BannerInfo from '../topbar/BannerInfo';
const LOGO_HEIGHT = 80;
const LOGO_HEIGHT_SMALL = 40;
/**
* Login screen
*/
export default class LoginScreen extends Component {
state = {
keyboard: false,
};
constructor(props) {
super(props);
this.logoHeight = new Animated.Value(LOGO_HEIGHT);
}
componentDidMount() {
// Setting this here because if user register, then onboarding then logout and login again, will go to onboarding again
sessionService.setInitialScreen('Tabs');
this.keyboardWillShowSub = Keyboard.addListener(
'keyboardDidShow',
this.keyboardWillShow,
);
this.keyboardWillHideSub = Keyboard.addListener(
'keyboardDidHide',
this.keyboardWillHide,
);
}
componentWillUnmount() {
this.keyboardWillShowSub.remove();
this.keyboardWillHideSub.remove();
}
keyboardWillShow = (event) => {
Animated.timing(this.logoHeight, {
duration: 500,
toValue: LOGO_HEIGHT_SMALL,
}).start();
// this.setState({keyboard: true});
// LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
};
keyboardWillHide = (event) => {
Animated.timing(this.logoHeight, {
duration: 500,
toValue: LOGO_HEIGHT,
}).start();
// this.setState({keyboard: false});
// LayoutAnimation.configureNext(LayoutAnimation.Presets.spring);
};
/**
* Render
*/
render() {
const CS = ThemedStyles.style;
return (
<KeyboardAvoidingView
style={[CS.flexColumnStretch, CS.backgroundPrimary]}
behavior={Platform.OS == 'ios' ? 'padding' : null}>
<SafeAreaView style={[styles.flex10]}>
<BannerInfo logged={false} />
<ScrollView style={CS.flexContainer} keyboardShouldPersistTaps={true}>
<View style={[CS.paddingHorizontal4x, CS.flexColumnStretch]}>
import DismissKeyboard from '../common/components/DismissKeyboard';
import { useKeyboard } from '@react-native-community/hooks';
import i18n from '../common/services/i18n.service';
const { height, width } = Dimensions.get('window');
const LOGO_HEIGHT = height / 7;
const titleMargin = { paddingVertical: height / 18 };
type PropsType = {
navigation: any;
};
export default function LoginScreen(props: PropsType) {
const theme = ThemedStyles.style;
const keyboard = useKeyboard();
const transition = useTransition(keyboard.keyboardShown);
const translateY = mix(transition, 0, -LOGO_HEIGHT);
const containerHeight = mix(transition, LOGO_HEIGHT, 0);
const opacity = mix(transition, 1, 0);
return (
<SafeAreaView style={theme.flexContainer}>
<BannerInfo logged={false} />
<DismissKeyboard>
<View style={theme.flexContainer}>
<View style={theme.flexColumnStretch}>
<Animated.View style={[styles.bulb, { height: containerHeight }]}>
<Animated.Image
resizeMode="contain"
source={require('./../assets/logos/bulb.png')}
style={[styles.bulb, { height: this.logoHeight }]}
source={require('./../assets/logos/logo-white.png')}
style={[styles.image, { transform: [{ translateY }], opacity }]}
/>
<LoginForm
onLogin={() => this.login()}
onForgot={this.onPressForgot}
/>
</View>
</ScrollView>
</SafeAreaView>
<View
style={[
CS.paddingVertical2x,
CS.backgroundSecondary,
CS.mindsLayoutFooter,
]}>
<TouchableOpacity
onPress={this.onPressRegister}
testID="registerButton">
<View style={CS.flexColumnCentered}>
<Text style={[CS.subTitleText, CS.colorSecondaryText]}>
{i18nService.t('auth.haveAccount')}
</Text>
<Text style={[CS.titleText, CS.colorPrimaryText]}>
{i18nService.t('auth.createChannel')}
</Text>
</View>
</TouchableOpacity>
</Animated.View>
<Text
style={[
theme.titleText,
theme.textCenter,
theme.colorWhite,
titleMargin,
]}>
{i18n.t('auth.login')}
</Text>
<LoginForm
onForgot={() => props.navigation.push('Forgot')}
onRegisterPress={() => props.navigation.push('Register')}
/>
</View>
</View>
</KeyboardAvoidingView>
);
}
/**
* On press forgot
*/
onPressForgot = () => {
this.props.navigation.push('Forgot');
};
/**
* On press register
*/
onPressRegister = () => {
this.props.navigation.push('Register');
};
/**
* On login successful
*/
login() {
logService.info('user logged in');
}
</DismissKeyboard>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
flex10: {
flex: 10,
},
bulb: {
width: 40,
height: 67,
width: '100%',
height: LOGO_HEIGHT,
justifyContent: 'flex-end',
// height: 70,
},
image: {
height: 0.3679 * (width * 0.43),
width: '43%',
alignSelf: 'center',
marginTop: 10,
},
});
......@@ -220,7 +220,7 @@ class RegisterForm extends Component {
render() {
const CS = ThemedStyles.style;
return (
<View style={[CS.flexContainerCenter, CS.backgroundPrimary]}>
<View style={CS.flexContainerCenter}>
{this.getFormBody()}
</View>
);
......
//@ts-nocheck
import React, { Component } from 'react';
import { View } from 'react-native';
import React from 'react';
import RegisterForm from './RegisterForm';
import logService from '../common/services/log.service';
import ThemedStyles from '../styles/ThemedStyles';
import { StackNavigationProp } from '@react-navigation/stack';
import { AuthStackParamList } from '../navigation/NavigationTypes';
/**
* Register screen
*/
export default class RegisterScreen extends Component {
/**
* Disable navigation bar
*/
static navigationOptions = {
header: null,
};
export type WalletScreenNavigationProp = StackNavigationProp<
AuthStackParamList,
'Register'
>;
/**
* Render
*/
render() {
return (
<View style={[ThemedStyles.style.flexContainer]}>
<RegisterForm onRegister={this.onRegister} onBack={this.onPressBack} />
</View>
);
}
type PropsType = {
navigation: WalletScreenNavigationProp;
};
/**
* On press back
*/
onPressBack = () => {
this.props.navigation.navigate('Login');
};
export default function RegisterScreen(props: PropsType) {
const onPressBack = () => props.navigation.goBack();
/**
* On register
*/
onRegister = (guid) => {
logService.info('[Register] new user registered ' + guid);