verdnatura-mirror
/
verdnatura-chat
forked from verdnatura-mirror/Rocket.Chat.ReactNative
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Chore: Clean LoginServices - TypeScript (#3935)

This commit is contained in:
Alex Junior 2022-03-22 19:14:42 -03:00 committed by GitHub
parent 2fb7d917a7
commit cbe2b23e27
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 68 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
app/containers/LoginServices.tsx
View File

@ -3,6 +3,7 @@ import { Animated, Easing, Linking, StyleSheet, Text, View } from 'react-native'
import { connect } from 'react-redux';
import { Base64 } from 'js-base64';
import * as AppleAuthentication from 'expo-apple-authentication';
import { StackNavigationProp } from '@react-navigation/stack';
import { withTheme } from '../theme';
import sharedStyles from '../views/Styles';
@ -15,6 +16,9 @@ import random from '../utils/random';
import { events, logEvent } from '../utils/log';
import RocketChat from '../lib/rocketchat';
import { CustomIcon } from '../lib/Icons';
import { IServices } from '../selectors/login';
import { OutsideParamList } from '../stacks/types';
import { IApplicationState } from '../definitions';
const BUTTON_HEIGHT = 48;
const SERVICE_HEIGHT = 58;
@ -58,31 +62,40 @@ const styles = StyleSheet.create({
});
interface IOpenOAuth {
url?: string;
url: string;
ssoToken?: string;
authType?: string;
}
interface IService {
interface IItemService {
name: string;
service: string;
authType: string;
buttonColor: string;
buttonLabelColor: string;
clientConfig: { provider: string };
serverURL: string;
authorizePath: string;
clientId: string;
scope: string;
}
interface IOauthProvider {
[key: string]: () => void;
facebook: () => void;
github: () => void;
gitlab: () => void;
google: () => void;
linkedin: () => void;
'meteor-developer': () => void;
twitter: () => void;
wordpress: () => void;
}
interface ILoginServicesProps {
navigation: any;
navigation: StackNavigationProp<OutsideParamList>;
server: string;
services: {
facebook: { clientId: string };
github: { clientId: string };
gitlab: { clientId: string };
google: { clientId: string };
linkedin: { clientId: string };
'meteor-developer': { clientId: string };
wordpress: { clientId: string; serverURL: string };
};
services: IServices;
Gitlab_URL: string;
CAS_enabled: boolean;
CAS_login_url: string;
@ -90,12 +103,13 @@ interface ILoginServicesProps {
theme: string;
}
class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
private _animation: any;
interface ILoginServicesState {
collapsed: boolean;
servicesHeight: Animated.Value;
}
static defaultProps = {
separator: true
};
class LoginServices extends React.PureComponent<ILoginServicesProps, ILoginServicesState> {
private _animation?: Animated.CompositeAnimation | void;
state = {
collapsed: true,
@ -194,7 +208,7 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
this.openOAuth({ url: `${endpoint}${params}` });
};
onPressCustomOAuth = (loginService: any) => {
onPressCustomOAuth = (loginService: IItemService) => {
logEvent(events.ENTER_WITH_CUSTOM_OAUTH);
const { server } = this.props;
const { serverURL, authorizePath, clientId, scope, service } = loginService;
@ -207,7 +221,7 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
this.openOAuth({ url });
};
onPressSaml = (loginService: any) => {
onPressSaml = (loginService: IItemService) => {
logEvent(events.ENTER_WITH_SAML);
const { server } = this.props;
const { clientConfig } = loginService;
@ -234,7 +248,6 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
AppleAuthentication.AppleAuthenticationScope.EMAIL
]
});
// @ts-ignore
await RocketChat.loginOAuthOrSso({ fullName, email, identityToken });
} catch {
logEvent(events.ENTER_WITH_APPLE_F);
@ -243,7 +256,12 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
getOAuthState = (loginStyle = LOGIN_STYPE_POPUP) => {
const credentialToken = random(43);
let obj: any = { loginStyle, credentialToken, isCordova: true };
let obj: {
loginStyle: string;
credentialToken: string;
isCordova: boolean;
redirectUrl?: string;
} = { loginStyle, credentialToken, isCordova: true };
if (loginStyle === LOGIN_STYPE_REDIRECT) {
obj = {
...obj,
@ -263,12 +281,11 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
if (this._animation) {
this._animation.stop();
}
// @ts-ignore
this._animation = Animated.timing(servicesHeight, {
toValue: height,
duration: 300,
// @ts-ignore
easing: Easing.easeOutCubic
easing: Easing.inOut(Easing.quad),
useNativeDriver: true
}).start();
};
@ -281,11 +298,11 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
} else {
this.transitionServicesTo(SERVICES_COLLAPSED_HEIGHT);
}
this.setState((prevState: any) => ({ collapsed: !prevState.collapsed }));
this.setState((prevState: ILoginServicesState) => ({ collapsed: !prevState.collapsed }));
};
getSocialOauthProvider = (name: string) => {
const oauthProviders: any = {
const oauthProviders: IOauthProvider = {
facebook: this.onPressFacebook,
github: this.onPressGithub,
gitlab: this.onPressGitlab,
@ -324,7 +341,7 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
return null;
};
renderItem = (service: IService) => {
renderItem = (service: IItemService) => {
const { CAS_enabled, theme } = this.props;
let { name } = service;
name = name === 'meteor-developer' ? 'meteor' : name;
@ -401,26 +418,28 @@ class LoginServices extends React.PureComponent<ILoginServicesProps, any> {
if (length > 3 && separator) {
return (
<>
<Animated.View style={style}>{Object.values(services).map((service: any) => this.renderItem(service))}</Animated.View>
<Animated.View style={style}>
{Object.values(services).map((service: IItemService) => this.renderItem(service))}
</Animated.View>
{this.renderServicesSeparator()}
</>
);
}
return (
<>
{Object.values(services).map((service: any) => this.renderItem(service))}
{Object.values(services).map((service: IItemService) => this.renderItem(service))}
{this.renderServicesSeparator()}
</>
);
}
}
const mapStateToProps = (state: any) => ({
const mapStateToProps = (state: IApplicationState) => ({
server: state.server.server,
Gitlab_URL: state.settings.API_Gitlab_URL,
CAS_enabled: state.settings.CAS_enabled,
CAS_login_url: state.settings.CAS_login_url,
services: state.login.services
Gitlab_URL: state.settings.API_Gitlab_URL as string,
CAS_enabled: state.settings.CAS_enabled as boolean,
CAS_login_url: state.settings.CAS_login_url as string,
services: state.login.services as IServices
});
export default connect(mapStateToProps)(withTheme(LoginServices)) as any;
export default connect(mapStateToProps)(withTheme(LoginServices));

5
app/definitions/ICredentials.ts
View File

@ -1,3 +1,5 @@
import { AppleAuthenticationFullName } from 'expo-apple-authentication';
export interface ICredentials {
resume?: string;
user?: string;
@ -13,4 +15,7 @@ export interface ICredentials {
login: ICredentials;
code: string;
};
fullName?: AppleAuthenticationFullName | null;
email?: string | null;
identityToken?: string | null;
}

2
app/selectors/login.ts
View File

@ -3,7 +3,7 @@ import isEmpty from 'lodash/isEmpty';
import { IApplicationState, IUser } from '../definitions';
interface IServices {
export interface IServices {
facebook: { clientId: string };
github: { clientId: string };
gitlab: { clientId: string };

6
app/stacks/types.ts
View File

@ -272,8 +272,14 @@ export type OutsideParamList = {
};
RegisterView: {
title: string;
username?: string;
};
LegalView: undefined;
AuthenticationWebView: {
authType: string;
url: string;
ssoToken?: string;
};
};
export type OutsideModalParamList = {

2
app/views/LoginView.tsx
View File

@ -231,7 +231,7 @@ class LoginView extends React.Component<ILoginViewProps, any> {
return (
<FormContainer theme={theme} testID='login-view'>
<FormContainerInner>
<LoginServices separator={Accounts_ShowFormLogin} navigation={navigation} />
<LoginServices separator={Accounts_ShowFormLogin} navigation={navigation} theme={theme} />
{this.renderUserForm()}
</FormContainerInner>
</FormContainer>

2
app/views/RegisterView.tsx
View File

@ -237,7 +237,7 @@ class RegisterView extends React.Component<IProps, any> {
return (
<FormContainer theme={theme} testID='register-view'>
<FormContainerInner>
<LoginServices navigation={navigation} />
<LoginServices navigation={navigation} theme={theme} separator />
<Text style={[styles.title, sharedStyles.textBold, { color: themes[theme].titleText }]}>{I18n.t('Sign_Up')}</Text>
<TextInput
label={I18n.t('Name')}