add app/pages/home/Notify.js

Strides-SPAPP/app/pages/home/Notify.js

@@ -0,0 +1,183 @@
+import React, { Component } from 'react';
+import { View, Text, StyleSheet, Clipboard, Platform } from 'react-native';
+import Button from '../../components/Button';
+import PushNotification from "react-native-push-notification";
+import Dialog from '../../components/Dialog';
+import apiUpload from '../../api/apiUpload';
+import app from '../../../app.json'
+import utils from '../../utils/utils';
+import Skeleton from 'react-native-reanimated-skeleton';
+
+export default class Notify extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      permission: false,
+      notifyToken: '',
+      serverToken: ''
+    };
+  }
+
+  componentDidMount() {
+    //this.requestUserPermission()
+    if (global.notifyToken.token) {
+      this.setState({
+        notifyToken: global.notifyToken.token
+      })
+    }
+    this.getUserToken();
+  }
+
+  getUserToken() {
+    getUserInfo(info => {
+      if (info.firebaseToken) {
+        let token = isIOS ? info.firebaseToken?.ios : info.firebaseToken?.android
+        this.setState({
+          serverToken: token ?? ""
+        });
+      }
+    }, true);
+  }
+
+  async requestUserPermission() {
+    const authStatus = await messaging().requestPermission();
+    const enabled =
+      authStatus === messaging.AuthorizationStatus.AUTHORIZED ||
+      authStatus === messaging.AuthorizationStatus.PROVISIONAL;
+    this.setState({
+      permission: enabled
+    })
+    if (enabled) {
+      console.log('Authorization status:', authStatus);
+    }
+    this.getToken()
+  }
+
+  getToken() {
+    messaging().getToken().then(token => {
+      if (token) {
+        this.setState({
+          notifyToken: token
+        })
+        console.log("token", token);
+      }
+    }).catch(err => {
+      console.info('Token Error', err)
+    });
+  }
+
+  localNotification() {
+    PushNotification.localNotification({
+      /* Android Only Properties */
+      channelId: "10186", // (required) channelId, if the channel doesn't exist, notification will not trigger.
+      showWhen: true, // (optional) default: true
+      autoCancel: true, // (optional) default: true
+      title: app.displayName, // (optional) default: "message" prop
+      message: "This is a local test message", // (optional) default: none
+      vibrate: true, // (optional) 振动开关default: true
+      vibration: 300, // 振动长度（毫秒），如果vibrate=false，则忽略, default: 1000
+      invokeApp: true, // 此选项允许单击操作将应用程序带回前台或留在后台, default: true
+      smallIcon: "ic_notification",
+      /* iOS only properties */
+      //subtitle: "My Notification Subtitle", // (optional) smaller title below notification title
+    });
+  }
+
+  remoteNotification() {
+    Dialog.showProgressDialog();
+    apiUpload.testNotification().then(res => {
+      Dialog.dismissLoading();
+      toastShort("Success");
+    }).catch(err => {
+      Dialog.dismissLoading();
+      toastShort(err);
+    })
+  }
+
+  updateToken() {
+    if (getUserId() > 0) {
+      Dialog.showProgressDialog();
+      utils.registerFirebaseToken("", res => {
+        Dialog.dismissLoading();
+        toastShort(res ? "Upload success" : "Upload failed")
+        if (res) {
+          this.getUserToken();
+        }
+      })
+    } else {
+      toastShort("Please login first");
+    }
+  }
+
+  copyToken() {
+    if (this.state.notifyToken) {
+      Clipboard.setString(this.state.notifyToken);
+      toastShort('Copied')
+    }
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.text}>Device Token：{this.state.notifyToken || "none"}</Text>
+        <Text style={styles.text}>Server Token：{this.state.serverToken || "none"}</Text>
+        { utils.isNotEmpty(this.state.notifyToken) &&
+          <View style={styles.text}>
+            <Button
+              text='Copy Token'
+              elevation={2}
+              onClick={() => this.copyToken()}
+              />
+          </View>
+        }
+        <View style={styles.text}>
+          <Button
+            text='Send Local Notification'
+            elevation={2}
+            onClick={() => this.localNotification()}
+            />
+        </View>
+        <View style={styles.text}>
+          <Button
+            text='Request Remote Notification'
+            elevation={2}
+            onClick={() => this.remoteNotification()}
+            />
+        </View>
+        { utils.isNotEmpty(this.state.notifyToken) &&
+          <View style={styles.text}>
+            <Button
+              text='Update Firebase Token'
+              elevation={2}
+              onClick={() => this.updateToken()}
+            />
+          </View>
+        }
+        <View style={[ui.flex1, ui.flexcc]}>
+          <Text style={styles.os}>{Platform.OS}</Text>
+        </View>
+        <Skeleton
+          containerStyle={ui.flex1}
+          isLoading={true}
+          boneColor='#eeeeee'
+          highlightColor='#f6f6f6'
+          animationType="shiver"
+          layout={[{width: '60%', height: 20, marginLeft: 30, borderRadius: 3}]}
+          animationDirection={'horizontalRight'}/>
+      </View>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    ...$padding(8,16)
+  },
+  text: {
+    paddingBottom: 12
+  },
+  os: {
+    color: '#999'
+  }
+})