@huaapp001/m-play 0.0.1 → 0.0.3

package/src/package/hooks/useInitAfInfo.ts

@@ -0,0 +1,213 @@
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import Clipboard from '@react-native-clipboard/clipboard';
+import {
+  isFirstInitAfSuccessAtom,
+  schemeDeepLinkParamsAtom,
+} from '../atoms/global';
+import { useAtomValue, useSetAtom } from 'jotai';
+import { useEffect } from 'react';
+import { Linking } from 'react-native';
+import appsFlyer from 'react-native-appsflyer';
+import { APP_FIRST_INIT_ADJUST_KEY } from '../const/storage';
+import useGetNetwork from './useGetNetwork';
+import { isAllowAttAccessAtom } from '../atoms/global';
+import { extractQueryParams } from '../utils/extractQueryParams';
+import { getUrlFromDevice } from '../utils/getUrlFromDevice';
+import { getConfig } from '../../config';
+
+interface Data {
+  deeplink: string;
+  isAJ?: boolean;
+  isLoadTwo?: boolean;
+}
+
+
+const useInitAfInfo = () => {
+  const systemConfig = getConfig();
+  const setSchemeDeepLinkParamsAtom = useSetAtom(schemeDeepLinkParamsAtom);
+  const [isConnected] = useGetNetwork();
+  const isAllowAttAccess = useAtomValue(isAllowAttAccessAtom);
+  const setIsFirstInitAfSuccessAtom = useSetAtom(isFirstInitAfSuccessAtom);
+
+  /** 处理深链信息 */
+  const processDeepLink = (data: Data) => {
+    const { deeplink, isAJ = false, isLoadTwo = false } = data;
+    // TODO 可删除
+    console.log('deeplinkdeeplink------->>>>>', deeplink);
+    if (!isLoadTwo && isAJ) {
+      global.IS_FIRST_LOAD_DEEP_LINK = true;
+      global.AF_END_LOAD_TIME = new Date().getTime();
+    }
+    let params: Record<string, string> = {};
+    if (deeplink.includes(systemConfig.adjustConfig.ONELINK_SHARE_VALUE)) {
+      const url = deeplink.split(systemConfig.adjustConfig.ONELINK_SHARE_VALUE)[1];
+      params = extractQueryParams(url) ?? {};
+      if (params.deep_link_value) {
+        processDeepLink({
+          deeplink:
+            systemConfig.adjustConfig.ONELINK_NO_HTTP_VALUE + decodeURIComponent(params.deep_link_value),
+          isAJ,
+          isLoadTwo: true,
+        });
+        return;
+      }
+    }
+    if (deeplink.includes(systemConfig.adjustConfig.ONELINK_NO_HTTP_VALUE)) {
+      const url = deeplink.split(systemConfig.adjustConfig.ONELINK_NO_HTTP_VALUE)[1];
+      params = extractQueryParams(url) ?? {};
+      // 做一个兜底处理 目前安卓模拟器会出现右边的情况 ONELINK_NO_HTTP_VALUE?deep_link_value=ONELINK_NO_HTTP_VALUE
+      if (params.deep_link_value) {
+        processDeepLink({
+          deeplink: systemConfig.adjustConfig.ONELINK_NO_HTTP_VALUE + decodeURIComponent(params.deep_link_value),
+          isAJ,
+          isLoadTwo: true,
+        });
+        return;
+      }
+    }
+    console.log('params',params)
+    setSchemeDeepLinkParamsAtom(params);
+    setIsFirstInitAfSuccessAtom(true);
+  };
+
+  /** 剪切板信息 */
+  const handlePasteboardInfo = async () => {
+    // TODO 可删除
+    console.log('deeplinkdeeplink------->>>>>handlePasteboardInfo');
+    // 若是之前执行过，该值是true，但是之前若是没给它赋值是不会相等的
+    const isNotFirstInit =
+      (await AsyncStorage.getItem(APP_FIRST_INIT_ADJUST_KEY)) === 'true';
+    // TODO 可删除
+    console.log(
+      'deeplinkdeeplink------->>>>>handlePasteboardInfo---isNotFirstInit',
+      await AsyncStorage.getItem(APP_FIRST_INIT_ADJUST_KEY),
+      isNotFirstInit
+    );
+    if (isNotFirstInit) {
+      return;
+    }
+    // 剪切板内容
+    let pasteboardValue = await Clipboard.getString();
+    // TODO 可删除
+    console.log(
+      'deeplinkdeeplink------->>>>>handlePasteboardInfo---pasteboardValue',
+      pasteboardValue
+    );
+    if (
+      pasteboardValue &&
+      pasteboardValue.includes(systemConfig.adjustConfig.completePrefixUrl)
+    ) {
+      global.wakeUpDeepLinkType = 'clipboard';
+    }
+    if (
+      !pasteboardValue ||
+      !pasteboardValue.includes(systemConfig.adjustConfig.completePrefixUrl)
+    ) {
+      // 走设备是否匹配 请求接口返回信息
+      pasteboardValue = await getUrlFromDevice();
+      if (pasteboardValue) {
+        global.wakeUpDeepLinkType = 'ip';
+      }
+    }
+    if (pasteboardValue) {
+      processDeepLink({ deeplink: pasteboardValue, isAJ: !isNotFirstInit });
+    }
+
+    await AsyncStorage.setItem(APP_FIRST_INIT_ADJUST_KEY, 'true');
+  };
+
+  useEffect(() => {
+    // TODO 可删除
+    console.log(
+      'deeplinkdeeplink------->>>>>isAllowAttAccess',
+      isAllowAttAccess
+    );
+    if (!isAllowAttAccess) {
+      return;
+    }
+    // TODO 可删除
+    console.log(
+      'isAllowAttAccessisAllowAttAccess111---->>>.',
+      isAllowAttAccess
+    );
+    // 记录下af初始化加载时的时间
+    global.AF_START_LOAD_TIME = new Date().getTime();
+    appsFlyer.onDeepLink((res) => {
+      // TODO 可删除
+      console.log('deeplinkdeeplink------->>>>>deepLinkStatus', res);
+      // 若是对应这个状态直接走兜底逻辑
+      if (res?.deepLinkStatus === 'NOT_FOUND') {
+        handlePasteboardInfo();
+        return;
+      }
+      const linkValue = decodeURIComponent(res?.data?.deep_link_value);
+      // 若是值不存在走兜底逻辑
+      if (!linkValue || linkValue === 'undefined') {
+        handlePasteboardInfo();
+        return;
+      }
+      global.wakeUpDeepLinkType = 'af';
+      processDeepLink({
+        deeplink: `${systemConfig.adjustConfig.ONELINK_NO_HTTP_VALUE}?${linkValue}`,
+        isAJ: res?.isDeferred,
+      });
+      AsyncStorage.setItem(APP_FIRST_INIT_ADJUST_KEY, 'true');
+    });
+    // TODO 可删除
+    console.log('appsFlyerappsFlyer---->>>', appsFlyer);
+    appsFlyer.initSdk(
+      {
+        devKey: systemConfig.adjustConfig.devKey,
+        isDebug: __DEV__,
+        appId: systemConfig.adjustConfig.appId,
+        onInstallConversionDataListener: true,
+        onDeepLinkListener: true,
+        //for iOS 14.5
+        timeToWaitForATTUserAuthorization: 10,
+      },
+      (result) => {
+        console.log(result, 'isAllowAttAccessisAllowAttAccessresult');
+      },
+      (error) => {
+        console.error(error, 'isAllowAttAccessisAllowAttAccesserror');
+      }
+    );
+    // 或者9秒之后设置为true
+    setTimeout(
+      () => {
+        AsyncStorage.setItem(APP_FIRST_INIT_ADJUST_KEY, 'true');
+      },
+      Number(systemConfig.adjustConfig.ADJUST_MAX_DELAY_TIME) + 1000
+    );
+    // 监听 已经启动，但是被h5换起来了会触发这个方法
+    Linking.addEventListener('url', ({ url }) => {
+      processDeepLink({ deeplink: url });
+    });
+    Linking.getInitialURL().then((url) => {
+      // 冷启动的时候，会触发这个
+      if (url) {
+        processDeepLink({ deeplink: url });
+      }
+    });
+  }, [
+    setSchemeDeepLinkParamsAtom,
+    setIsFirstInitAfSuccessAtom,
+    isAllowAttAccess,
+  ]);
+
+  useEffect(() => {
+    if (!isConnected) {
+      return;
+    }
+    const timeout = setTimeout(async () => {
+      if ((await AsyncStorage.getItem(APP_FIRST_INIT_ADJUST_KEY)) !== 'true') {
+        await handlePasteboardInfo();
+      }
+      setIsFirstInitAfSuccessAtom(true);
+    }, Number(systemConfig.adjustConfig.ADJUST_MAX_DELAY_TIME));
+    return () => {
+      clearTimeout(timeout);
+    };
+  }, [isConnected]);
+};
+export default useInitAfInfo;

package/src/package/request/constants.ts

@@ -0,0 +1,12 @@
+export const REQUEST_METHODS = {
+  GET: 'GET',
+  POST: 'POST',
+  PUT: 'PUT',
+  DELETE: 'DELETE',
+};
+
+export const CONTENT_TYPE = {
+  JSON: 'application/json;charset=UTF-8',
+  FORM_URLENCODED: 'application/x-www-form-urlencoded;charset=UTF-8',
+  FORM_DATA: 'multipart/form-data;charset=UTF-8',
+};

package/src/package/request/index.ts

@@ -0,0 +1,99 @@
+import { Platform } from 'react-native';
+
+import axios, {
+  AxiosInstance,
+  AxiosRequestConfig,
+  AxiosResponse,
+  InternalAxiosRequestConfig,
+} from 'axios';
+
+import { CONTENT_TYPE } from './constants';
+import { CustomRequestConfig } from './type';
+import { getConfig } from '../../config';
+
+
+const createAxiosInstance = (): AxiosInstance => {
+  const systemConfig = getConfig();
+  const instance = axios.create({
+    baseURL: systemConfig.header.apiUrl,
+    timeout: 10000,
+    headers: {
+      'Content-Type': CONTENT_TYPE.JSON,
+    },
+  }) as AxiosInstance;
+
+  instance.interceptors.request.use(
+    (config: InternalAxiosRequestConfig<CustomRequestConfig>) => {
+      const mergedConfig = { ...config };
+      mergedConfig.headers = mergedConfig.headers || {};
+
+      if (global.userToken) {
+        mergedConfig.headers.Authorization = global.userToken;
+      }
+
+      mergedConfig.headers.TYPE = Platform.OS;
+      mergedConfig.headers.NID = systemConfig.header.appId;
+      mergedConfig.headers.PACKAGENAME = systemConfig.header.PACKAGENAME;
+
+      if (!global.userToken && global.userId) {
+        mergedConfig.headers.UID = global.userId;
+      }
+
+      return mergedConfig;
+    }
+  );
+
+  instance.interceptors.response.use(
+    (response: AxiosResponse<any>) => {
+      if (response.data.code === 200) {
+        return response.data;
+      }
+
+      // FIXME: Fix me the types
+      return response.data as Promise<AxiosResponse<any>>;
+    },
+    (error) => {
+      if (error.response) {
+        return Promise.reject(
+          error.response.data || { message: 'Unknown server error' }
+        );
+      } else if (error.request) {
+        return Promise.reject({ message: 'No response received from server' });
+      } else {
+        return Promise.reject({
+          message: error.message || 'Unknown error occurred',
+        });
+      }
+    }
+  );
+
+  return instance;
+};
+
+const axiosInstance = createAxiosInstance();
+
+export const axiosGet = <T = any>(
+  url: string,
+  params?: unknown,
+  config?: AxiosRequestConfig
+) => {
+  return axiosInstance.get<T>(url, { params, ...config });
+};
+
+export const axiosPost = <T = any>(
+  url: string,
+  data?: unknown,
+  config?: AxiosRequestConfig
+) => {
+  return axiosInstance.post<T>(url, data, config);
+};
+
+export const axiosPostFormData = <T = any>(
+  url: string,
+  data?: unknown | FormData,
+  config?: AxiosRequestConfig
+) => {
+  return axiosInstance.post<T>(url, data, config);
+};
+
+export default axiosInstance;

package/src/package/request/type.ts

@@ -0,0 +1,24 @@
+import { type AxiosRequestConfig } from 'axios';
+
+export type ApiResponse<T = unknown> = {
+  code: number;
+  data: T;
+  message: string;
+  msg: string;
+};
+
+export type ApiError = Error & {
+  code?: number;
+  config: AxiosRequestConfig;
+  isAxiosError: boolean;
+};
+
+export type CustomRequestConfig = AxiosRequestConfig & {
+  headers: {
+    TYPE?: string;
+    NID?: number;
+    PACKAGENAME?: string;
+    UID?: string;
+    Authorization?: string;
+  };
+};

package/src/package/screens/home/index.tsx

@@ -0,0 +1,100 @@
+import React, { PropsWithChildren, useEffect, useMemo, useRef } from 'react';
+import { Platform, View } from 'react-native';
+import { createJsbridge } from '@tianzhitong/js-bridge';
+import WebView from '../../components/webview';
+import useGetUserToken from '../../hooks/useGetUserToken';
+import { useAtom, useAtomValue } from 'jotai';
+import {
+  bPackageWebviewLoadingFinishAtom,
+  MiddleScreenLoadingFinishAtom,
+  schemeDeepLinkParamsAtom,
+} from '../../atoms/global';
+import MiddleScreen from '../middle';
+import useAppGetUID from '../../hooks/useAppGetUID';
+import useInitAfInfo from '../../hooks/useInitAfInfo';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { getConfig } from '../../../config';
+
+
+const Home = () => {
+  const safeAreaInsets = useSafeAreaInsets();
+  const systemConfig = getConfig();
+  const { top, bottom } = safeAreaInsets;
+  const webRef = useRef<any>(null);
+  const middleScreenLoadingFinish = useAtomValue(MiddleScreenLoadingFinishAtom);
+  const [bPackageWebviewLoadingFinish, setBPackageWebviewLoadingFinish] =
+    useAtom(bPackageWebviewLoadingFinishAtom);
+
+  const schemeDeepLinkParams = useAtomValue(schemeDeepLinkParamsAtom);
+
+  const jsbridge = useMemo(() => {
+    return createJsbridge({ getWebViewRef: () => webRef });
+  }, []);
+
+  useEffect(() => {
+    if (!(bPackageWebviewLoadingFinish && middleScreenLoadingFinish)) {
+      return;
+    }
+    if (schemeDeepLinkParams.pageName) {
+      jsbridge.postMessage({
+        type: 'SEND_H5_PARAMS',
+        payload: schemeDeepLinkParams,
+      });
+    }
+  }, [schemeDeepLinkParams, bPackageWebviewLoadingFinish,middleScreenLoadingFinish, jsbridge]);
+
+  useGetUserToken(jsbridge);
+
+  return (
+    <View
+      style={{
+        flex: 1,
+        opacity:
+          bPackageWebviewLoadingFinish && middleScreenLoadingFinish ? 1 : 0,
+      }}
+    >
+      <WebView
+        ref={webRef}
+        source={{
+          uri: `${systemConfig.webviewUrl}?platform=${Platform.OS
+            }&app_version=${'1.1.1'}&user_id=${global.GLOBAL_USER_UID
+            }&top=${top}&bottom=${bottom}`,
+        }}
+        onInvokeMessage={() => { }}
+        onLoadEnd={() => {
+          console.log('onLoadEnd');
+          setBPackageWebviewLoadingFinish(true);
+        }}
+      />
+    </View>
+  );
+};
+
+
+const ProviderBPackageIndex = (props: PropsWithChildren)  => {
+  const {
+    children,
+  } = props;
+  const { isLoading,isAPackage, } = useAppGetUID();
+  const middleScreenLoadingFinish = useAtomValue(MiddleScreenLoadingFinishAtom);
+  const schemeDeepLinkParams = useAtomValue(schemeDeepLinkParamsAtom);
+  console.log('schemeDeepLinkParams',schemeDeepLinkParams)
+  useInitAfInfo();
+
+  if (!isLoading) {
+    return null;
+  }
+  console.log('isAPackage',isAPackage)
+  if (isAPackage) {
+    return children;
+  }
+  console.log('middleScreenLoadingFinish',middleScreenLoadingFinish)
+  return (
+    <View style={{ flex: 1 }}>
+      {!middleScreenLoadingFinish && <MiddleScreen />}
+      <Home  />
+    </View>
+  );
+};
+
+export default ProviderBPackageIndex;

package/src/package/screens/middle/components/CustomProgressBar.tsx

@@ -0,0 +1,152 @@
+import React, { useState, useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
+import { View, Text, StyleSheet, Animated, Easing } from 'react-native';
+import { rwd } from '../../../utils/rwd';
+
+const CustomProgressBar = forwardRef<any, any>(
+    (
+        {
+            duration = 5000,
+            height = rwd(10),
+            backgroundColor = '#e0e0e0',
+            fillColor = '#4CAF50',
+            showPercentage = true,
+            borderRadius = 10,
+            textStyle = {},
+            containerStyle = {},
+            onComplete = () => {},
+        },
+        ref,
+    ) => {
+        const progress = useState(new Animated.Value(0))[0];
+        const [currentProgress, setCurrentProgress] = useState(0);
+        const animationRef = useRef<Animated.CompositeAnimation | null>(null);
+
+        let listenerId = useRef<string>('');
+
+        const animateTo = (value: number, callback?: () => void) => {
+            // Stop any ongoing animation
+            if (animationRef.current) {
+                animationRef.current.stop();
+            }
+
+            // Calculate remaining duration proportionally
+            const remainingDuration = duration * ((100 - currentProgress) / 100);
+
+            animationRef.current = Animated.timing(progress, {
+                toValue: value,
+                duration: remainingDuration,
+                easing: Easing.linear,
+                useNativeDriver: false,
+            });
+
+            animationRef.current.start(() => {
+                if (value === 100 && callback) {
+                    callback();
+                }
+            });
+        };
+
+        useEffect(() => {
+            // Add listener to animation value
+            listenerId.current = progress.addListener(({ value }) => {
+                setCurrentProgress(Math.floor(value));
+            });
+
+            // Start initial animation
+            animateTo(100, onComplete);
+
+            // Clean up listener
+            return () => {
+                progress.removeListener(listenerId.current);
+                if (animationRef.current) {
+                    animationRef.current.stop();
+                }
+            };
+        }, [duration]);
+
+        useImperativeHandle(
+            ref,
+            () => ({
+                completeProgress: () => {
+                    // Stop current animation and jump to 100%
+                    if (animationRef.current) {
+                        animationRef.current.stop();
+                    }
+                    progress.setValue(100);
+                    setCurrentProgress(100);
+                    onComplete();
+                },
+                setProgress: (value: number) => {
+                    // Set to specific value (0-100)
+                    const clampedValue = Math.min(100, Math.max(0, value));
+                    if (animationRef.current) {
+                        animationRef.current.stop();
+                    }
+                    progress.setValue(clampedValue);
+                    setCurrentProgress(clampedValue);
+                    if (clampedValue === 100) {
+                        onComplete();
+                    }
+                },
+                startAnimation: () => {
+                    // Restart animation from current position
+                    animateTo(100, onComplete);
+                },
+            }),
+            [progress, currentProgress, onComplete],
+        );
+
+        const widthInterpolation = progress.interpolate({
+            inputRange: [0, 100],
+            outputRange: ['0%', '100%'],
+        });
+
+        return (
+            <View style={[styles.container, containerStyle]}>
+                <View
+                    style={[
+                        styles.progressBar,
+                        {
+                            height,
+                            backgroundColor,
+                            borderRadius,
+                        },
+                    ]}
+                >
+                    <Animated.View
+                        style={[
+                            styles.progressFill,
+                            {
+                                width: widthInterpolation,
+                                backgroundColor: fillColor,
+                                borderRadius,
+                            },
+                        ]}
+                    />
+                </View>
+
+                {showPercentage && <Text style={[styles.progressText, textStyle]}>{currentProgress}%</Text>}
+            </View>
+        );
+    },
+);
+
+const styles = StyleSheet.create({
+    container: {
+        width: '100%',
+        padding: rwd(20),
+    },
+    progressBar: {
+        overflow: 'hidden',
+    },
+    progressFill: {
+        height: '100%',
+    },
+    progressText: {
+        marginTop: rwd(8),
+        textAlign: 'center',
+        fontSize: rwd(16),
+    },
+});
+
+export default CustomProgressBar;

package/src/package/screens/middle/index.tsx

@@ -0,0 +1,94 @@
+import { useAtomValue, useSetAtom } from 'jotai';
+import { useEffect, useRef, useState } from 'react';
+import { Image, StatusBar, Text, View } from 'react-native';
+import CustomProgressBar from './components/CustomProgressBar';
+import {
+  bPackageWebviewLoadingFinishAtom,
+  isFirstInitAfSuccessAtom,
+  MiddleScreenLoadingFinishAtom,
+  schemeDeepLinkParamsAtom,
+} from '../../atoms/global';
+import { rwd } from '../../utils/rwd';
+import { getConfig } from '../../../config';
+
+
+const MiddleScreen = () => {
+  const systemConfig = getConfig();
+  const progressRef = useRef<any>(null);
+  /** 深度链接是否成功 */
+  const isFirstInitAfSuccess = useAtomValue(isFirstInitAfSuccessAtom);
+  /** b包webview是否加载完成 */
+  const bPackageWebviewLoadingFinish = useAtomValue(
+    bPackageWebviewLoadingFinishAtom
+  );
+  /** 100%动画是否执行完毕 */
+  const setIsAnimationSuccess = useSetAtom(MiddleScreenLoadingFinishAtom);
+
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    // 深度链接成功，等于成功一半，无需走进度条
+    if (isFirstInitAfSuccess) {
+      setIsLoading(true);
+    }
+  }, [isFirstInitAfSuccess]);
+
+  useEffect(() => {
+    if (bPackageWebviewLoadingFinish && isLoading) {
+      progressRef.current?.completeProgress();
+      setIsAnimationSuccess(true);
+    }
+  }, [isLoading, bPackageWebviewLoadingFinish, setIsAnimationSuccess]);
+
+  return (
+    <View style={{ width: '100%', height: '100%' }}>
+      <StatusBar
+        translucent={true}
+        barStyle="light-content"
+        backgroundColor="transparent"
+      />
+      <View style={{ flex: 1, backgroundColor: '#12141D', paddingTop: '50%' }}>
+        <View style={{ justifyContent: 'center', alignItems: 'center' }}>
+          <Image
+            source={{ uri: systemConfig.adjustConfig.bgImage }}
+            style={{ width: rwd(170), height: rwd(170) }}
+          />
+          <Text
+            style={{
+              color: '#fff',
+              fontSize: rwd(34),
+              fontWeight: 600,
+              marginTop: rwd(50),
+            }}
+          >
+            {systemConfig.adjustConfig.appName}
+          </Text>
+        </View>
+        <View style={{ position: 'absolute', bottom: '20%', width: '100%' }}>
+          <CustomProgressBar
+            ref={progressRef}
+            duration={8000}
+            fillColor="#3498db" // 蓝色进度条
+            textStyle={{ color: '#3498db', fontWeight: 'bold' }} // 蓝色文字
+            onComplete={() => {
+              setIsLoading(true);
+              console.log('进度完成!');
+            }}
+          />
+          <Text
+            style={{
+              color: '#fff',
+              fontSize: rwd(24),
+              fontWeight: 600,
+              marginTop: rwd(30),
+              textAlign: 'center',
+            }}
+          >
+            {systemConfig.adjustConfig.loadingText}
+          </Text>
+        </View>
+      </View>
+    </View>
+  );
+};
+export default MiddleScreen;