Merge branch 'init' of https://git.yishihui.com/DeNet/DeNet-App-RN into init

App.tsx

@@ -2,10 +2,11 @@ import React, { Component } from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { NavTabScreen } from './src/router';
-import Twitter from '@/pages/screens/twitter/index';
-import Redpack from '@/pages/screens/redpack/index';
-import Login from '@/pages/screens/login/index';
-import WebView from '@/pages/screens/webview/index';
+import Twitter from '@/pages/screens/twitter';
+import Redpack from '@/pages/screens/redpack';
+import Login from '@/pages/screens/login';
+import WebView from '@/pages/screens/webview';
+import Comment from '@/pages/screens/twitterComment';
 import { SafeAreaProvider } from 'react-native-safe-area-context';
 import { ModalPortal } from 'react-native-modals';
 
@@ -36,6 +37,13 @@ class App extends Component {
 							name="WebView"
 							component={WebView}
 						/>
+						<stackNavigator.Screen
+							name="Comment"
+							component={Comment}
+							options={{
+								title: 'Tag 3 friends to complete the task',
+							}}
+						/>
 						<stackNavigator.Screen name="Login" component={Login} />
 					</stackNavigator.Navigator>
 				</NavigationContainer>

src/pages/navigations/home.tsx

@@ -28,7 +28,9 @@ const Home = (props: Props) => {
 	const [nftData, setNftData] = useState([]);
 	const goTwitter = () => {
 		if (isLogin) {
-			props.navigation.navigate('Twitter');
+			props.navigation.navigate('Twitter', {
+				webUrl: 'https://mobile.twitter.com/home',
+			});
 		} else {
 			goTwitterAuthorize();
 		}
@@ -39,10 +41,14 @@ const Home = (props: Props) => {
 			postRequest('/denet/nft/group/listJoinNftGroup', {
 				pageNum: 1,
 				pageSize: 100,
-			}).then((res: any) => {
-				console.log('nftData', res);
-				setNftData(res.data);
-			});
+			})
+				.then((res: any) => {
+					console.log('nftData', res);
+					setNftData(res.data);
+				})
+				.catch((e: any) => {
+					console.log('listJoinNftGroup error', e);
+				});
 		}
 	}, [props.navigation, isLogin]);
 

src/pages/navigations/me.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { Button, Image, StyleSheet, Text, View } from 'react-native';
 import { useLoginCom } from '@/components/useLogin';
+import { LoginView } from '@/components/loginView';
 import {
 	Modal,
 	ModalContent,
@@ -48,13 +49,7 @@ const Me = (props: any) => {
 			)}
 			{!isLogin && (
 				<>
-					<View style={styles.contain}>
-						<Button
-							title="Log in"
-							color="#FF0000"
-							onPress={goTwitterAuthorize}
-						/>
-					</View>
+					<LoginView goLogin={goTwitterAuthorize}></LoginView>
 				</>
 			)}
 			{showDialog && (

src/pages/screens/redpack.tsx

@@ -22,6 +22,7 @@ import {
 
 interface Props {
 	route: any;
+	navigation: any;
 }
 
 type State = {
@@ -53,11 +54,26 @@ class Redpack extends Component<Props, State> {
 		switch (info.actionType) {
 			case 'IFRAME_RED_PACKET_REPLY_CLICK':
 				console.log('IFRAME_RED_PACKET_REPLY_CLICK', data);
-				// this.setState({
-				// 	isShoCommentPop: true,
-				// });
-				// this.props
-				// this.state.isShoCommentPop = true;
+				DeviceEventEmitter.addListener(
+					`IFRAME_RED_PACKET_REPLY_CLICK-${this.props.route.params.tweet_Id}`,
+					() => {
+						this.webref.postMessage(
+							JSON.stringify({
+								info: {
+									actionType:
+										'CONTENT_RED_PACKET_REPLY_RASK_FINSH',
+								},
+								data: {
+									postId: this.props.route.params.post_Id,
+								},
+							}),
+						);
+					},
+				);
+				this.props.navigation.navigate('Comment', {
+					data,
+					routerData: this.props.route.params,
+				});
 				break;
 			default:
 				messageCenter.send({ info, data });

src/pages/screens/twitter.tsx

@@ -14,6 +14,7 @@ class Twitter extends Component<Props> {
 	packUrl: any;
 	taskLikeMap: Map<string, any> = new Map();
 	taskRetweetMap: Map<string, any> = new Map();
+	taskFollowMap: Map<string, any> = new Map();
 
 	getPostIdByType = (post_Id: string) => {
 		let result: any = { post_Id };
@@ -100,6 +101,17 @@ class Twitter extends Component<Props> {
 						data,
 					);
 				}
+				break;
+			case 'FollowSuccess':
+				callBackData = this.taskFollowMap.get(data.twitterUserId) || {};
+				if (callBackData) {
+					data.follow_name = callBackData.data.follow_name;
+					DeviceEventEmitter.emit(
+						callBackData.info.rnMessageId,
+						data,
+					);
+				}
+				break;
 		}
 	};
 	handleWebViewNavigationStateChange = (newNavState: { url: any }) => {
@@ -147,6 +159,16 @@ class Twitter extends Component<Props> {
 	`);
 	}
 
+	follow(data: any) {
+		console.log('follow', data);
+		const { id1, id2 } = this.getSplitTweetId(data.data.twitterUserId);
+		this.taskFollowMap.set(data.data.twitterUserId, data);
+		this.webref.injectJavaScript(`
+		window.denetJS.TwitterFollowAPI(${id1},${id2});
+		true;
+	`);
+	}
+
 	getPostId(shortUrl: RequestInfo) {
 		return fetch(shortUrl) // 返回一个Promise对象
 			.then(res => {
@@ -170,6 +192,12 @@ class Twitter extends Component<Props> {
 				this.retweet(data);
 			},
 		);
+		DeviceEventEmitter.addListener(
+			'IFRAME_DO_TASK_FOLLOWS',
+			(data: any) => {
+				this.follow(data);
+			},
+		);
 	}
 
 	render() {

src/pages/screens/twitterComment.tsx

@@ -0,0 +1,69 @@
+import React, { useRef } from 'react';
+import { View, DeviceEventEmitter } from 'react-native';
+import { DenetWebview } from '@/components/webview';
+import { onReplyDialogOpen } from '@/utils/contentInTwitterJS/comment';
+import { postRequest } from '@/netWork/request';
+
+interface Props {
+	navigation: any;
+	route: any;
+}
+
+const Comment = (props: Props) => {
+	const webRef = useRef({} as any);
+	const params = props.route.params.data;
+	const uri = `https://mobile.twitter.com/intent/tweet?in_reply_to=${props.route.params.data.tweetId}`;
+	const inject = () => {
+		webRef.current.injectJavaScript(`
+		(${onReplyDialogOpen})();
+      true;
+    `);
+	};
+
+	const fetchAddFinishEvent = () => {
+		console.log('fetchAddFinishEvent', params);
+		return postRequest('/denet/post/luckdrop/addFinishEvent', {
+			params: {
+				eventType: params.type,
+				luckdropId: params.taskLuckdropId,
+			},
+		}).catch((e: any) => {
+			console.log('fetchAddFinishEvent error', e);
+		});
+	};
+
+	const onMessageHandle = async (messageData: any) => {
+		let { actionType } =
+			(messageData.nativeEvent.data &&
+				JSON.parse(messageData.nativeEvent.data)) ||
+			{};
+		console.log('onMessageHandle', actionType);
+		switch (actionType) {
+			case 'commentSuccess':
+				const res = await fetchAddFinishEvent();
+				console.log('commentSuccess res....', res);
+				DeviceEventEmitter.emit(
+					`IFRAME_RED_PACKET_REPLY_CLICK-${params.tweetId}`,
+				);
+				props.navigation.navigate(
+					'Redpack',
+					props.route.params.routerData,
+				);
+				break;
+			default:
+				break;
+		}
+	};
+	return (
+		<View style={{ flex: 1 }}>
+			<DenetWebview
+				uri={uri}
+				onLoadEndHandle={inject}
+				onMessageHandle={onMessageHandle}
+				refHandle={r => (webRef.current = r)}
+			/>
+		</View>
+	);
+};
+
+export default Comment;

src/pages/screens/webview.tsx

@@ -2,16 +2,12 @@ import React from 'react';
 import { DenetWebview } from '@/components/webview';
 
 interface Props {
-    navigation: any;
+	navigation: any;
 	route: any;
 }
 
 const WebView = (props: Props) => {
-	return (
-		<DenetWebview
-			uri={props.route.params.url}>
-		</DenetWebview>
-	);
+	return <DenetWebview uri={props.route.params.url} />;
 };
 
 export default WebView;

src/utils/contentInTwitterJS/addDom.js

@@ -216,6 +216,50 @@ const addDom = () => {
 				console.log('DO0_TASK4');
 			});
 	};
+
+	window.denetJS.TwitterFollowAPI = (id1, id2) => {
+		let url =
+			'https://mobile.twitter.com/i/api/1.1/friendships/create.json';
+		fetch(url, {
+			headers: {
+				authorization:
+					'Bearer AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D1Zv7ttfk8LF81IUq16cHjhLTvJu4FA33AGWWjCpTnA',
+				'content-type': 'application/x-www-form-urlencoded',
+				'sec-ch-ua':
+					'" Not A;Brand";v="99", "Chromium";v="102", "Google Chrome";v="102"',
+				'sec-ch-ua-mobile': '?0',
+				'sec-ch-ua-platform': '"macOS"',
+				'x-csrf-token': window.denetJS.getCookie('ct0'),
+				'x-twitter-active-user': 'yes',
+				'x-twitter-auth-type': 'OAuth2Session',
+				'x-twitter-client-language': 'zh-cn',
+			},
+			referrer: 'https://twitter.com/home',
+			referrerPolicy: 'strict-origin-when-cross-origin',
+			body:
+				'include_profile_interstitial_type=1&include_blocking=1&include_blocked_by=1&include_followed_by=1&include_want_retweets=1&include_mute_edge=1&include_can_dm=1&include_can_media_tag=1&include_ext_has_nft_avatar=1&skip_status=1&user_id=' +
+				id1 +
+				id2 +
+				'',
+			method: 'POST',
+			mode: 'cors',
+			credentials: 'include',
+		})
+			.then(res => {
+				console.log('TwitterFollowAPI', res);
+				window.ReactNativeWebView.postMessage(
+					JSON.stringify({
+						actionType: 'FollowSuccess',
+						data: {
+							twitterUserId: `${id1}${id2}`,
+							task_done: true,
+							follow_name: '',
+						},
+					}),
+				);
+			})
+			.catch(() => {});
+	};
 	function setStyle(obj, css) {
 		for (var atr in css) {
 			obj.style[atr] = css[atr];

src/utils/contentInTwitterJS/comment.js

@@ -0,0 +1,56 @@
+function onReplyDialogOpen() {
+	setTimeout(() => {
+		let main = document.querySelector('main[role="main"]');
+		let replyBtn;
+
+		if (main) {
+			replyBtn = main.querySelector('div[data-testid="tweetButton"]');
+			let width = main.offsetWidth;
+			// let ele = document.createElement('div');
+			// ele.innerText = 'Tag 3 friends to complete the task';
+			// ele.style.cssText = `width: ${width}px; height: 38px; color: #fff; font-weight: 600;
+			// font-size: 16px; display: flex; align-items: center; justify-content: center; background: #1D9BF0;
+			// opacity: 0.8; position: absolute; top: 0px; left: 50%; transform: translateX(-50%); z-index: 1000`;
+
+			// main.appendChild(ele);
+		}
+
+		if (main && replyBtn) {
+			console.log('main && replyBtn ...');
+			replyBtn.addEventListener('click', function () {
+				let content = main.querySelector(
+					'textarea[data-testid]',
+				).textContent;
+				console.log('comtent...', content);
+				const len = content.split('@').length;
+				if (len && len - 1 >= 3) {
+					window.ReactNativeWebView.postMessage(
+						JSON.stringify({
+							actionType: 'commentSuccess',
+						}),
+					);
+					// fetchAddFinishEvent({
+					//     eventType: params.type,
+					//     luckdropId: params.taskLuckdropId,
+					// }).then(res => {
+					//     if (res.code == 0) {
+					//         cb && cb();
+					//     }
+					// });
+				}
+				// reportReplyResult(eleList, params, () => {
+				// 	// 上報完成
+				// 	contentMessageCenter.send({
+				// 		info: {
+				// 			actionType: 'CONTENT_RED_PACKET_REPLY_RASK_FINSH',
+				// 			iframeId: params.iframeId,
+				// 		},
+				// 		data: { postId: params.postId },
+				// 	});
+				// });
+			});
+		}
+	}, 1000);
+}
+
+export { onReplyDialogOpen };

src/utils/messageCenter/index.ts

@@ -31,6 +31,7 @@ class MessageCenter {
 			case 'IFRAME_TWITTER_API_DO_TASK':
 			case 'IFRAME_DO_TASK_LIKE':
 			case 'IFRAME_DO_TASK_RETWEET':
+			case 'IFRAME_DO_TASK_FOLLOWS':
 				const rnMessageId = `${actionType}-${guid()}`;
 				DeviceEventEmitter.emit(actionType, {
 					info: {