@inngageregistry/inngage-react 4.0.0-beta.1 → 4.0.0

package/src/components/modal.tsx

@@ -1,221 +0,0 @@
-import * as React from "react";
-import {
-    Animated, Easing,
-    Modal as ReactNativeModal,
-    ModalProps as ReactNativeModalProps,
-    Platform,
-    StyleProp,
-    StyleSheet,
-    TouchableWithoutFeedback,
-    ViewStyle
-} from "react-native";
-import { Component } from "react";
-
-const MODAL_ANIM_DURATION = 300;
-const MODAL_BACKDROP_OPACITY = 0.3;
-
-const CONTENT_ANIMATION_IN = Platform.select({
-    ios: {
-        opacity: {
-            inputRange: [0, 1],
-            outputRange: [0, 1],
-        },
-        scale: {
-            inputRange: [0, 0.5, 1],
-            outputRange: [1.2, 1.1, 1],
-        },
-    },
-    android: {
-        opacity: {
-            inputRange: [0, 0.5, 1],
-            outputRange: [0, 1, 1],
-        },
-        scale: {
-            inputRange: [0, 1],
-            outputRange: [0.3, 1],
-        },
-    },
-    default: {
-        opacity: {
-            inputRange: [0, 0.5, 1],
-            outputRange: [0, 1, 1],
-        },
-        scale: {
-            inputRange: [0, 1],
-            outputRange: [0.3, 1],
-        },
-    },
-});
-
-const CONTENT_ANIMATION_OUT = Platform.select({
-    default: {
-        opacity: {
-            inputRange: [0, 1],
-            outputRange: [0, 1],
-        },
-    },
-});
-
-export interface ModalProps extends ReactNativeModalProps {
-    onBackdropPress?: () => void;
-    onHide?: () => void;
-    visible?: boolean;
-    contentStyle?: StyleProp<ViewStyle>;
-    useNativeDriver?: boolean;
-}
-
-interface ModalState {
-    visible: boolean;
-    currentAnimation: "none" | "in" | "out";
-}
-
-export class Modal extends Component<ModalProps, ModalState> {
-    static defaultProps: Partial<ModalProps> = {
-        onBackdropPress: () => null,
-        onHide: () => null,
-        visible: false,
-        useNativeDriver: false,
-    };
-
-    state: ModalState = {
-        visible: Boolean(this.props.visible),
-        currentAnimation: "none",
-    };
-
-    animVal = new Animated.Value(0);
-    _isMounted = false;
-
-    componentDidMount() {
-        this._isMounted = true;
-        if (this.state.visible) {
-            this.show();
-        }
-    }
-
-    componentWillUnmount() {
-        this._isMounted = false;
-    }
-
-    componentDidUpdate(prevProps: ModalProps) {
-        if (this.props.visible && !prevProps.visible) {
-            this.show();
-        } else if (!this.props.visible && prevProps.visible) {
-            this.hide();
-        }
-    }
-
-    show = () => {
-        this.setState({ visible: true, currentAnimation: "in" }, () => {
-            Animated.timing(this.animVal, {
-                easing: Easing.inOut(Easing.quad),
-                useNativeDriver: Boolean(this.props.useNativeDriver),
-                duration: MODAL_ANIM_DURATION,
-                toValue: 1,
-            }).start(() => {
-                this.setState({ currentAnimation: "none" });
-            });
-        });
-    };
-
-    hide = () => {
-        this.setState({ currentAnimation: "out" }, () => {
-            Animated.timing(this.animVal, {
-                easing: Easing.inOut(Easing.quad),
-                useNativeDriver: Boolean(this.props.useNativeDriver),
-                duration: MODAL_ANIM_DURATION,
-                toValue: 0,
-            }).start(() => {
-                if (this._isMounted) {
-                    this.setState({ currentAnimation: "none" });
-                    this.setState({ visible: false }, this.props.onHide);
-                }
-            });
-        });
-    };
-
-    render() {
-        const {
-            children,
-            onBackdropPress,
-            contentStyle,
-            ...otherProps
-        } = this.props;
-        const { currentAnimation, visible } = this.state;
-
-        const backdropAnimatedStyle = {
-            opacity: this.animVal.interpolate({
-                inputRange: [0, 1],
-                outputRange: [0, MODAL_BACKDROP_OPACITY],
-            }),
-        };
-
-        const contentAnimatedStyle =
-            currentAnimation === "in"
-                ? {
-                    opacity: this.animVal.interpolate({
-                        inputRange: CONTENT_ANIMATION_IN.opacity.inputRange,
-                        outputRange: CONTENT_ANIMATION_IN.opacity.outputRange,
-                        extrapolate: "clamp",
-                    }),
-                    transform: [
-                        {
-                            scale: this.animVal.interpolate({
-                                inputRange: CONTENT_ANIMATION_IN.scale.inputRange,
-                                outputRange: CONTENT_ANIMATION_IN.scale.outputRange,
-                                extrapolate: "clamp",
-                            }),
-                        },
-                    ],
-                }
-                : {
-                    opacity: this.animVal.interpolate({
-                        inputRange: CONTENT_ANIMATION_OUT.opacity.inputRange,
-                        outputRange: CONTENT_ANIMATION_OUT.opacity.outputRange,
-                        extrapolate: "clamp",
-                    }),
-                };
-
-        return (
-            <ReactNativeModal
-                transparent
-                animationType="none"
-                {...otherProps}
-                visible={visible}
-            >
-                <TouchableWithoutFeedback onPress={onBackdropPress}>
-                    <Animated.View style={[styles.backdrop, backdropAnimatedStyle]} />
-                </TouchableWithoutFeedback>
-                {visible && (
-                    <Animated.View
-                        style={[styles.content, contentAnimatedStyle, contentStyle]}
-                        pointerEvents="box-none"
-                        needsOffscreenAlphaCompositing={["in", "out"].includes(
-                            currentAnimation
-                        )}
-                    >
-                        {children}
-                    </Animated.View>
-                )}
-            </ReactNativeModal>
-        );
-    }
-}
-
-const styles = StyleSheet.create({
-    backdrop: {
-        position: "absolute",
-        top: 0,
-        bottom: 0,
-        left: 0,
-        right: 0,
-        backgroundColor: "black",
-        opacity: 0,
-    },
-    content: {
-        flex: 1,
-        alignItems: "center",
-        justifyContent: "center",
-    },
-});
-
-export default Modal;

package/src/components/styles.ts

@@ -1,70 +0,0 @@
-import { PlatformColor, StyleSheet } from "react-native";
-
-
-export const buildStyles = (data: any, screen: any) => StyleSheet.create({
-  closeButton: {
-    position: 'absolute',
-    top: 10,
-    right: 10,
-    zIndex: 10,
-  },
-  content: {
-    backgroundColor: data?.background_color,
-    flexDirection: "column",
-    borderRadius: 3,
-    paddingBottom: 16,
-    paddingRight: 16,
-    paddingLeft: 16,
-    margin: 16,
-    overflow: "hidden",
-    elevation: 10,
-    width: screen,
-    alignItems: "center"
-  },
-  messageData: { marginTop: 12 },
-  footer: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "flex-end",
-    marginTop: 4,
-  },
-  title: {
-    color: PlatformColor(
-      `@android:color/${"primary_text_light"}`
-    ),
-    fontWeight: "500",
-    fontSize: 18,
-  },
-  body: {
-    color: PlatformColor(
-      `@android:color/${"secondary_text_light"}`
-    ),
-    fontSize: 16,
-    marginTop: 10,
-    marginBottom: 10,
-  },
-  buttonLeft: {
-    margin: 2,
-    flex: 1,
-    backgroundColor: data?.btn_left_bg_color,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  buttonRight: {
-    margin: 2,
-    flex: 1,
-    backgroundColor: data?.btn_right_bg_color,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  textButton: {
-    color: PlatformColor(
-      `@android:color/${"secondary_text_light"}`
-    ),
-    textAlign: "center",
-    backgroundColor: "transparent",
-    padding: 8,
-    fontSize: 14,
-    textTransform: "uppercase",
-  },
-})

package/src/firebase/notifications_listener.ts

@@ -1,146 +0,0 @@
-import { useEffect, useState } from 'react';
-
-import AsyncStorage from '@react-native-async-storage/async-storage';
-
-import messaging from '@react-native-firebase/messaging';
-import PushNotification, { Importance } from 'react-native-push-notification'
-
-import { InngageProperties } from '../models/inngage_properties';
-import * as ApiService from '../services/api_services'
-import { AppState } from 'react-native';
-
-export const messagingHeadlessTask = () => {
-  return messaging().setBackgroundMessageHandler(async remoteMessage => {
-    if (InngageProperties.getDebugMode())
-      console.log('INNGAGE BACKGROUND AND CLOSED DATA: ', remoteMessage)
-
-    if (remoteMessage?.data?.additional_data != null) {
-      await AsyncStorage.setItem('inapp', remoteMessage?.data?.additional_data);
-    }
-
-    return Promise.resolve();
-  });
-}
-
-export const useInAppHandler = () => {
-  const [showInApp, setShowInApp] = useState(false);
-
-  useEffect(() => {
-    const checkInAppData = async () => {
-      const inAppData = await AsyncStorage.getItem('inapp');
-      if (inAppData) {
-        setShowInApp(true);
-      }
-    };
-
-    checkInAppData();
-
-    const subscription = AppState.addEventListener('change', nextAppState => {
-      if (nextAppState === 'active') {
-        checkInAppData();
-      }
-    });
-
-    return () => {
-      subscription.remove();
-    };
-  }, []);
-
-  return { showInApp, setShowInApp };
-}
-
-export const InngageNotificationMessage = (firebaseListenCallback?: any) => {
-  useEffect(() => {
-    PushNotification.configure({
-      onNotification: function (data: any) {
-        if (data.foreground) {
-          handleNotification(data)
-        }
-      },
-      popInitialNotification: true,
-      requestPermissions: true
-    })
-    PushNotification.createChannel({
-      channelId: 'channel_id',
-      channelName: 'default',
-      importance: Importance.HIGH,
-      playSound: true,
-      soundName: 'default',
-      vibrate: true
-    }, (created: any) => {
-      if (created) {
-        console.log('Channel created');
-      }
-    });
-  })
-  useEffect(() => {
-    const handleMessage = async (remoteMessage: any) => {
-      const notificationData = remoteMessage.data;
-
-      if (InngageProperties.getDebugMode())
-        console.log('Remote message received in foreground: ', remoteMessage);
-
-      if (firebaseListenCallback != null && remoteMessage != null)
-        firebaseListenCallback(notificationData)
-
-      PushNotification.localNotification({
-        autoCancel: true,
-        bigPictureUrl: remoteMessage.notification?.android?.imageUrl,
-        largeIconUrl: remoteMessage.notification?.android?.imageUrl,
-        title: notificationData?.title,
-        message: notificationData?.body,
-        vibration: 300,
-        channelId: "channel_id",
-      });
-
-      if (notificationData.additional_data != null)
-        await AsyncStorage.setItem('inapp', notificationData.additional_data);
-
-    };
-
-    return messaging().onMessage(handleMessage);
-  }, []);
-
-  useEffect(() => {
-    messaging().onNotificationOpenedApp(remoteMessage => {
-      if (remoteMessage != null)
-        firebaseListenCallback(remoteMessage.data)
-
-      handleNotification(remoteMessage)
-    })
-  }, []);
-
-  useEffect(() => {
-    messaging().getInitialNotification().then(async (value) => {
-      if (value !== null)
-        handleUniqueRemoteMessage(value);
-    });
-  }, [])
-
-  const handleUniqueRemoteMessage = async (
-    remoteMessage: { messageId?: string }) => {
-    try {
-      console.log('oi')
-      const lastRemoteMessageId = await AsyncStorage.getItem('LAST_REMOTE_MESSAGE_ID');
-      const newRemoteMessageId = remoteMessage?.messageId;
-
-      if (newRemoteMessageId && lastRemoteMessageId !== newRemoteMessageId) {
-        await AsyncStorage.setItem('LAST_REMOTE_MESSAGE_ID', newRemoteMessageId);
-        handleNotification(remoteMessage)
-      }
-    } catch (e) {
-      console.error(e);
-    }
-  };
-
-  async function handleNotification(remoteMessage) {
-    const notId = remoteMessage.data?.notId;
-    const request = {
-      notificationRequest: {
-        id: notId,
-        app_token: InngageProperties.appToken,
-      }
-    };
-    await ApiService.sendNotification(request);
-  }
-}

package/src/index.ts

@@ -1,8 +0,0 @@
-import { InApp } from './components/in_app';
-import Inngage from './Inngage';
-
-//-------------- In-APP Component -------------//
-export { InApp };
-
-//-------------- Inngage Wrapper --------------//
-export default Inngage;

package/src/models/inngage_properties.ts

@@ -1,13 +0,0 @@
-export class InngageProperties {
-    static identifier: string = '';
-    static appToken: string = '';
-    static phoneNumber: string = '';
-    static email: string = '';
-    static customFields: any = {};
-    static blockDeepLink: boolean = false;
-    static debugMode: boolean = false;
-    static firebaseToken: string = '';
-    static getDebugMode(): boolean {
-        return InngageProperties.debugMode;
-    }
-}

package/src/services/handler.ts

@@ -1,41 +0,0 @@
-const baseUrlHook = {
-  [false as any]: 'https://api.inngage.com.br/v1',
-  [undefined as any]: 'https://api.inngage.com.br/v1',
-  [null as any]: 'https://api.inngage.com.br/v1',
-  [true as any]: 'https://apid.inngage.com.br/v1',
-}
-
-const requestConfigFactory = (method, request) => {
-
-  let header: any = {
-    Accept: 'application/json',
-    'Content-Type': 'application/json',
-  }
-  try {
-    if (request?.registerSubscriberRequest?.authKey) {
-      header = {
-        ...header,
-        Authorization: request.registerSubscriberRequest.authKey
-      }
-    }
-  } catch (e) {
-    console.error(e)
-  }
-  let objToSend = {
-    method,
-    body: JSON.stringify(request),
-    headers: header
-  }
-
-  return objToSend
-}
-
-export const fetchClient = (method, requestBody, path, isDev = false): Promise<Response> => {
-  return new Promise((resolve) => {
-    const url = String(baseUrlHook[isDev as any]).concat(path)
-    const request = requestConfigFactory(method, requestBody)
-    fetch(url, request)
-      .then(resolve)
-      .catch(err => console.error('Fetch Error', err))
-  })
-}

package/src/services/inngage.ts

@@ -1,23 +0,0 @@
-import { InngageProperties } from '../models/inngage_properties'
-import { fetchClient } from './handler'
-
-export const subscriptionApi = (request, dev = false) => {
-  if (InngageProperties.getDebugMode())
-    console.log('subscriptionApi', request)
-  return fetchClient('POST', request, '/subscription/', !!dev)
-}
-export const notificationApi = (request, dev = false) => {
-  if (InngageProperties.getDebugMode())
-    console.log('notificationApi', request)
-  return fetchClient('POST', request, '/notification/', !!dev)
-}
-export const eventsApi = (request, dev = false) => {
-  if (InngageProperties.getDebugMode())
-    console.log('eventsApi', request)
-  return fetchClient('POST', request, '/events/newEvent/', !!dev)
-}
-export const addUserDataApi = (request, dev = false) => {
-  if (InngageProperties.getDebugMode())
-    console.log('addUserData', request)
-  return fetchClient('POST', request, '/subscription/addCustomField', !!dev)
-}

package/src/utils.ts

@@ -1,35 +0,0 @@
-import { Alert } from 'react-native'
-
-export const formatDate = (timestamp) => {
-  if (!timestamp) {
-    return null
-  }
-  return new Date(timestamp).toISOString()
-}
-
-export const showAlert = (title: string, body: string) => {
-  Alert.alert(title, body, [{ text: 'OK', onPress: () => console.log('OK Pressed') }], {
-    cancelable: false,
-  })
-}
-
-export const showAlertLink = (title: string, body: string, appName: string, link: string) => {
-  return new Promise((resolve) => {
-    Alert.alert(
-      title,
-      `${body}\n\n${link}`,
-      [{ text: 'NO', onPress: () => resolve(false) }, { text: 'OK', onPress: () => resolve(true) }],
-      { cancelable: false },
-    )
-  })
-}
-
-export const isEmpty = (obj: any) => {
-  for (var prop in obj) {
-    if (obj.hasOwnProperty(prop)) {
-      return false;
-    }
-  }
-
-  return JSON.stringify(obj) === JSON.stringify({});
-}

package/tsconfig.json

@@ -1,27 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "es6",
-    "declaration": true,
-    "outDir": "./build",
-    "strict": true,
-    "jsx": "react-native",
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "skipLibCheck": true,
-    "moduleResolution": "node",
-    "noImplicitAny": false,
-    "lib": [
-      "dom",
-      "es2015"
-    ]
-  },
-  "include": [
-    "**/*"
-  ],
-  "exclude": [
-    "node_modules",
-    "**/__tests__/*",
-    "build"
-  ]
-}