removing use of material ui

Author: fadi-george

examples/RNOneSignalTS/Helpers.tsx

@@ -1,19 +1,18 @@
-import * as React from 'react';
 import {
-  View,
-  StyleSheet,
-  Platform,
+  Button,
   KeyboardAvoidingView,
+  StyleSheet,
   TextInput,
+  View,
 } from 'react-native';
-import {Button} from '@react-native-material/core';
 
-const disabledColor = '#BEBEBE';
+// const disabledColor = '#BEBEBE';
 
 export const renderButtonView = (name: string, callback: Function) => {
   return (
     <View key={name + '_parent'} style={styles.buttonContainer}>
       <Button
+        color="white"
         key={name}
         title={name}
         onPress={() => {
@@ -59,11 +58,11 @@ export const renderFieldView = (
 
 const styles = StyleSheet.create({
   buttonContainer: {
-    flexDirection: 'column',
-    overflow: 'hidden',
-    borderRadius: 10,
+    backgroundColor: '#007bff',
+    borderRadius: 8,
     marginVertical: 10,
     marginHorizontal: 10,
+    overflow: 'hidden',
   },
   textInput: {
     marginHorizontal: 10,

examples/RNOneSignalTS/OSButtons.tsx

@@ -1,8 +1,8 @@
-import {OneSignal} from 'react-native-onesignal';
 import * as React from 'react';
-import {StyleSheet, View, Platform} from 'react-native';
-import {renderButtonView} from './Helpers';
-import {Text, Divider} from '@react-native-material/core';
+import { StyleSheet, Text, View } from 'react-native';
+import { OneSignal } from 'react-native-onesignal';
+import { renderButtonView } from './Helpers';
+// Remove: import {Text, Divider} from '@react-native-material/core';
 
 export interface Props {
   loggingFunction: Function;
@@ -11,7 +11,7 @@ export interface Props {
 
 class OSButtons extends React.Component<Props> {
   createInAppMessagesFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const getPausedButton = renderButtonView('Get paused', async () => {
       const paused = await OneSignal.InAppMessages.getPaused();
@@ -94,7 +94,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   createLocationFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
     const locationShared = renderButtonView('Is Location Shared', async () => {
       const isLocationShared = await OneSignal.Location.isShared();
       loggingFunction(
@@ -129,7 +129,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   createNotificationFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const hasPermissionButton = renderButtonView(
       'Has Notification Permission',
@@ -182,17 +182,17 @@ class OSButtons extends React.Component<Props> {
   }
 
   createLiveActivitiesFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const startDefaultLiveActivity = renderButtonView(
       'Start Default Live Activity',
       async () => {
         loggingFunction('Starting live activity');
         await OneSignal.LiveActivities.startDefault(
           this.props.inputFieldValue,
-          {title: 'Welcome!'},
+          { title: 'Welcome!' },
           {
-            message: {en: 'Hello World!'},
+            message: { en: 'Hello World!' },
             intValue: 3,
             doubleValue: 3.14,
             boolValue: true,
@@ -255,7 +255,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   createSessionFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const sendOutcomeButton = renderButtonView('Send Outcome With Name', () => {
       loggingFunction('Sending outcome: ', this.props.inputFieldValue);
@@ -295,7 +295,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   createUserFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const addEmailButton = renderButtonView('Add Email', () => {
       loggingFunction('Attempting to set email: ', this.props.inputFieldValue);
@@ -341,7 +341,7 @@ class OSButtons extends React.Component<Props> {
 
     const addTagsButton = renderButtonView('Add list of tags', () => {
       loggingFunction('Adding list of tags');
-      OneSignal.User.addTags({my_tag1: 'my_value', my_tag2: 'my_value2'});
+      OneSignal.User.addTags({ my_tag1: 'my_value', my_tag2: 'my_value2' });
     });
 
     const removeTagsButton = renderButtonView('Remove list of tags', () => {
@@ -454,7 +454,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   pushSubscriptionFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const getPushSubscriptionIdButton = renderButtonView(
       'Get Push Subscription Id',
@@ -497,7 +497,7 @@ class OSButtons extends React.Component<Props> {
   }
 
   privacyConsentFields() {
-    const {loggingFunction} = this.props;
+    const { loggingFunction } = this.props;
 
     const setPrivacyConsentGivenTrueButton = renderButtonView(
       'Set Privacy Consent to true',
@@ -542,43 +542,79 @@ class OSButtons extends React.Component<Props> {
   render() {
     return (
       <View>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">InAppMessages</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>InAppMessages</Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createInAppMessagesFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">Location</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>Location</Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createLocationFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">Notifications</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>Notifications</Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createNotificationFields()}
 
-        <Text variant="h5">Live Activities</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>
+          Live Activities
+        </Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createLiveActivitiesFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">Session</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>Session</Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createSessionFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">User</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>User</Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.createUserFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">Push Subscription</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>
+          Push Subscription
+        </Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.pushSubscriptionFields()}
 
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
-        <Text variant="h5">Privacy Consent</Text>
-        <Divider style={{marginTop: 10, marginBottom: 10}} />
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
+        <Text style={{ fontSize: 18, fontWeight: 'bold' }}>
+          Privacy Consent
+        </Text>
+        <View
+          style={{ height: 1, backgroundColor: '#ccc', marginVertical: 10 }}
+        />
         {this.privacyConsentFields()}
       </View>
     );

examples/RNOneSignalTS/OSConsole.tsx

@@ -25,12 +25,14 @@ export interface Props {
 export interface State {}
 
 class OSConsole extends React.Component<Props, State> {
+  private scrollView: ScrollView | null = null;
+
   constructor(props: Props) {
     super(props);
   }
 
   scrollToEnd = () => {
-    this.scrollView.scrollToEnd({ animated: true });
+    this.scrollView?.scrollToEnd({ animated: true });
   };
 
   render() {

examples/RNOneSignalTS/OSDemo.tsx

@@ -1,10 +1,11 @@
-import { Text, TextInput } from '@react-native-material/core';
 import * as React from 'react';
 import {
   Alert,
   SafeAreaView,
   ScrollView,
   StyleSheet,
+  Text,
+  TextInput,
   View,
 } from 'react-native';
 import { LogLevel, OneSignal } from 'react-native-onesignal';