Merge branch 'frontend' into 'master'

Frontend integrate

See merge request !1

.buckconfig

+
+[android]
+  target = Google Inc.:Google APIs:23
+
+[maven_repositories]
+  central = https://repo1.maven.org/maven2

.bundle/config

+BUNDLE_PATH: "vendor/bundle"
+BUNDLE_FORCE_RUBY_PLATFORM: 1

.eslintrc.js

+module.exports = {
+  root: true,
+  extends: '@react-native-community',
+};

.flowconfig

+[ignore]
+; We fork some components by platform
+.*/*[.]android.js
+
+; Ignore "BUCK" generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+; Ignore polyfills
+node_modules/react-native/Libraries/polyfills/.*
+
+; Flow doesn't support platforms
+.*/Libraries/Utilities/LoadingView.js
+
+.*/node_modules/resolve/test/resolver/malformed_package_json/package\.json$
+
+[untyped]
+.*/node_modules/@react-native-community/cli/.*/.*
+
+[include]
+
+[libs]
+node_modules/react-native/interface.js
+node_modules/react-native/flow/
+
+[options]
+emoji=true
+
+exact_by_default=true
+
+format.bracket_spacing=false
+
+module.file_ext=.js
+module.file_ext=.json
+module.file_ext=.ios.js
+
+munge_underscores=true
+
+module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
+module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FlowFixMeProps
+suppress_type=$FlowFixMeState
+
+[lints]
+sketchy-null-number=warn
+sketchy-null-mixed=warn
+sketchy-number=warn
+untyped-type-import=warn
+nonstrict-import=warn
+deprecated-type=warn
+unsafe-getters-setters=warn
+unnecessary-invariant=warn
+signature-verification-failure=warn
+
+[strict]
+deprecated-type
+nonstrict-import
+sketchy-null
+unclear-type
+unsafe-getters-setters
+untyped-import
+untyped-type-import
+
+[version]
+^0.170.0

.gitignore

+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
+# screenshots whenever they are needed.
+# For more information about the recommended setup visit:
+# https://docs.fastlane.tools/best-practices/source-control/
+
+*/fastlane/report.xml
+*/fastlane/Preview.html
+*/fastlane/screenshots
+
+# Bundle artifact
+*.jsbundle
+
+# Ruby / CocoaPods
+/ios/Pods/
+/vendor/bundle/

.prettierrc.js

+module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
+  bracketSpacing: false,
+  singleQuote: true,
+  trailingComma: 'all',
+};

.ruby-version

+2.7.4

.watchmanconfig

+{}
\ No newline at end of file

App.js

+//import liraries
+import React,{ useState, useEffect } from 'react';
+import { View, Text, StyleSheet, SafeAreaView } from 'react-native';
+import {Onboard} from './src/screens/Onboard';
+import { NavigationContainer } from '@react-navigation/native';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import {Home} from './src/screens/Home';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { Chatbot } from './src/screens/Chatbot';
+import { VoiceConversation } from './src/screens/VoiceConversation';
+
+
+const Stack = createNativeStackNavigator();
+
+// create a component
+const App = () => {
+  const [onBoardState, setonBoardState] = useState();
+
+  useEffect(() => {
+    retrieveData();
+  });
+
+  //Onboarding check
+  const retrieveData = async () => {
+    try {
+      const value = await AsyncStorage.getItem('hasOnboarded');
+        // We have data!!
+        setonBoardState(value);
+    } catch (error) {
+      // Error retrieving data
+    }
+  };
+
+  return (
+
+    <NavigationContainer>
+      <Stack.Navigator>
+      <Stack.Screen
+          name="Onboard"
+          component={Onboard}
+          initialParams
+          options={{headerShown:false}}
+        />
+        <Stack.Screen
+          name="Home"
+          component={Home}
+          options={{ title: 'Welcome' }}
+        />
+        <Stack.Screen
+          name="Chatbot"
+          component={Chatbot}
+          options={{headerShown:false}}
+        />
+        {/* <Stack.Screen
+          name="VoiceConversation"
+          component={VoiceConversation}
+          options={{headerShown:false}}
+        /> */}
+      </Stack.Navigator>
+    </NavigationContainer>
+      
+
+  );
+};
+
+// define your styles
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#2c3e50',
+  },
+});
+
+//make this component available to the app
+export default App;

Gemfile

+source 'https://rubygems.org'
+
+# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
+ruby '2.7.4'
+
+gem 'cocoapods', '~> 1.11', '>= 1.11.2'

Gemfile.lock

+GEM
+  remote: https://rubygems.org/
+  specs:
+    CFPropertyList (3.0.5)
+      rexml
+    activesupport (6.1.5)
+      concurrent-ruby (~> 1.0, >= 1.0.2)
+      i18n (>= 1.6, < 2)
+      minitest (>= 5.1)
+      tzinfo (~> 2.0)
+      zeitwerk (~> 2.3)
+    addressable (2.8.0)
+      public_suffix (>= 2.0.2, < 5.0)
+    algoliasearch (1.27.5)
+      httpclient (~> 2.8, >= 2.8.3)
+      json (>= 1.5.1)
+    atomos (0.1.3)
+    claide (1.1.0)
+    cocoapods (1.11.3)
+      addressable (~> 2.8)
+      claide (>= 1.0.2, < 2.0)
+      cocoapods-core (= 1.11.3)
+      cocoapods-deintegrate (>= 1.0.3, < 2.0)
+      cocoapods-downloader (>= 1.4.0, < 2.0)
+      cocoapods-plugins (>= 1.0.0, < 2.0)
+      cocoapods-search (>= 1.0.0, < 2.0)
+      cocoapods-trunk (>= 1.4.0, < 2.0)
+      cocoapods-try (>= 1.1.0, < 2.0)
+      colored2 (~> 3.1)
+      escape (~> 0.0.4)
+      fourflusher (>= 2.3.0, < 3.0)
+      gh_inspector (~> 1.0)
+      molinillo (~> 0.8.0)
+      nap (~> 1.0)
+      ruby-macho (>= 1.0, < 3.0)
+      xcodeproj (>= 1.21.0, < 2.0)
+    cocoapods-core (1.11.3)
+      activesupport (>= 5.0, < 7)
+      addressable (~> 2.8)
+      algoliasearch (~> 1.0)
+      concurrent-ruby (~> 1.1)
+      fuzzy_match (~> 2.0.4)
+      nap (~> 1.0)
+      netrc (~> 0.11)
+      public_suffix (~> 4.0)
+      typhoeus (~> 1.0)
+    cocoapods-deintegrate (1.0.5)
+    cocoapods-downloader (1.6.3)
+    cocoapods-plugins (1.0.0)
+      nap
+    cocoapods-search (1.0.1)
+    cocoapods-trunk (1.6.0)
+      nap (>= 0.8, < 2.0)
+      netrc (~> 0.11)
+    cocoapods-try (1.2.0)
+    colored2 (3.1.2)
+    concurrent-ruby (1.1.10)
+    escape (0.0.4)
+    ethon (0.15.0)
+      ffi (>= 1.15.0)
+    ffi (1.15.5)
+    fourflusher (2.3.1)
+    fuzzy_match (2.0.4)
+    gh_inspector (1.1.3)
+    httpclient (2.8.3)
+    i18n (1.10.0)
+      concurrent-ruby (~> 1.0)
+    json (2.6.1)
+    minitest (5.15.0)
+    molinillo (0.8.0)
+    nanaimo (0.3.0)
+    nap (1.1.0)
+    netrc (0.11.0)
+    public_suffix (4.0.7)
+    rexml (3.2.5)
+    ruby-macho (2.5.1)
+    typhoeus (1.4.0)
+      ethon (>= 0.9.0)
+    tzinfo (2.0.4)
+      concurrent-ruby (~> 1.0)
+    xcodeproj (1.21.0)
+      CFPropertyList (>= 2.3.3, < 4.0)
+      atomos (~> 0.1.3)
+      claide (>= 1.0.2, < 2.0)
+      colored2 (~> 3.1)
+      nanaimo (~> 0.3.0)
+      rexml (~> 3.2.4)
+    zeitwerk (2.5.4)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  cocoapods (~> 1.11, >= 1.11.2)
+
+RUBY VERSION
+   ruby 2.7.4p191
+
+BUNDLED WITH
+   2.2.27

__tests__/App-test.js

+/**
+ * @format
+ */
+
+import 'react-native';
+import React from 'react';
+import App from '../App';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  renderer.create(<App />);
+});

android/app/BUCK

+# To learn about Buck see [Docs](https://buckbuild.com/).
+# To run your application with Buck:
+# - install Buck
+# - `npm start` - to start the packager
+# - `cd android`
+# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"`
+# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck
+# - `buck install -r android/app` - compile, install and run application
+#
+
+load(":build_defs.bzl", "create_aar_targets", "create_jar_targets")
+
+lib_deps = []
+
+create_aar_targets(glob(["libs/*.aar"]))
+
+create_jar_targets(glob(["libs/*.jar"]))
+
+android_library(
+    name = "all-libs",
+    exported_deps = lib_deps,
+)
+
+android_library(
+    name = "app-code",
+    srcs = glob([
+        "src/main/java/**/*.java",
+    ]),
+    deps = [
+        ":all-libs",
+        ":build_config",
+        ":res",
+    ],
+)
+
+android_build_config(
+    name = "build_config",
+    package = "com.better_you",
+)
+
+android_resource(
+    name = "res",
+    package = "com.better_you",
+    res = "src/main/res",
+)
+
+android_binary(
+    name = "app",
+    keystore = "//android/keystores:debug",
+    manifest = "src/main/AndroidManifest.xml",
+    package_type = "debug",
+    deps = [
+        ":app-code",
+    ],
+)

android/app/build_defs.bzl

+"""Helper definitions to glob .aar and .jar targets"""
+
+def create_aar_targets(aarfiles):
+    for aarfile in aarfiles:
+        name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
+        lib_deps.append(":" + name)
+        android_prebuilt_aar(
+            name = name,
+            aar = aarfile,
+        )
+
+def create_jar_targets(jarfiles):
+    for jarfile in jarfiles:
+        name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
+        lib_deps.append(":" + name)
+        prebuilt_jar(
+            name = name,
+            binary_jar = jarfile,
+        )

android/app/proguard-rules.pro

+# Add project specific ProGuard rules here.
+# By default, the flags in this file are appended to flags specified
+# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
+# You can edit the include path and order by changing the proguardFiles
+# directive in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# Add any project specific keep options here:

android/app/src/debug/AndroidManifest.xml

+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+
+    <application
+        android:usesCleartextTraffic="true"
+        tools:targetApi="28"
+        tools:ignore="GoogleAppIndexingWarning">
+        <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" android:exported="false" />
+    </application>
+</manifest>

android/app/src/debug/java/com/better_you/ReactNativeFlipper.java

+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * <p>This source code is licensed under the MIT license found in the LICENSE file in the root
+ * directory of this source tree.
+ */
+package com.better_you;
+
+import android.content.Context;
+import com.facebook.flipper.android.AndroidFlipperClient;
+import com.facebook.flipper.android.utils.FlipperUtils;
+import com.facebook.flipper.core.FlipperClient;
+import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
+import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
+import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
+import com.facebook.flipper.plugins.inspector.DescriptorMapping;
+import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
+import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
+import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
+import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
+import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
+import com.facebook.react.ReactInstanceEventListener;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.modules.network.NetworkingModule;
+import okhttp3.OkHttpClient;
+
+public class ReactNativeFlipper {
+  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
+    if (FlipperUtils.shouldEnableFlipper(context)) {
+      final FlipperClient client = AndroidFlipperClient.getInstance(context);
+
+      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
+      client.addPlugin(new ReactFlipperPlugin());
+      client.addPlugin(new DatabasesFlipperPlugin(context));
+      client.addPlugin(new SharedPreferencesFlipperPlugin(context));
+      client.addPlugin(CrashReporterPlugin.getInstance());
+
+      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
+      NetworkingModule.setCustomClientBuilder(
+          new NetworkingModule.CustomClientBuilder() {
+            @Override
+            public void apply(OkHttpClient.Builder builder) {
+              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
+            }
+          });
+      client.addPlugin(networkFlipperPlugin);
+      client.start();
+
+      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
+      // Hence we run if after all native modules have been initialized
+      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
+      if (reactContext == null) {
+        reactInstanceManager.addReactInstanceEventListener(
+            new ReactInstanceEventListener() {
+              @Override
+              public void onReactContextInitialized(ReactContext reactContext) {
+                reactInstanceManager.removeReactInstanceEventListener(this);
+                reactContext.runOnNativeModulesQueueThread(
+                    new Runnable() {
+                      @Override
+                      public void run() {
+                        client.addPlugin(new FrescoFlipperPlugin());
+                      }
+                    });
+              }
+            });
+      } else {
+        client.addPlugin(new FrescoFlipperPlugin());
+      }
+    }
+  }
+}

android/app/src/main/AndroidManifest.xml

+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+  package="com.better_you">
+
+    <uses-permission android:name="android.permission.INTERNET" />
+
+    <application
+      android:name=".MainApplication"
+      android:label="@string/app_name"
+      android:icon="@mipmap/ic_launcher"
+      android:roundIcon="@mipmap/ic_launcher_round"
+      android:allowBackup="false"
+      android:theme="@style/AppTheme">
+      <activity
+        android:name=".MainActivity"
+        android:label="@string/app_name"
+        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
+        android:launchMode="singleTask"
+        android:windowSoftInputMode="adjustResize"
+        android:exported="true">
+        <intent-filter>
+            <action android:name="android.intent.action.MAIN" />
+            <category android:name="android.intent.category.LAUNCHER" />
+        </intent-filter>
+      </activity>
+    </application>
+</manifest>

android/app/src/main/java/com/better_you/MainActivity.java

+package com.better_you;
+
+import com.facebook.react.ReactActivity;
+import com.facebook.react.ReactActivityDelegate;
+import com.facebook.react.ReactRootView;
+
+public class MainActivity extends ReactActivity {
+
+  /**
+   * Returns the name of the main component registered from JavaScript. This is used to schedule
+   * rendering of the component.
+   */
+  @Override
+  protected String getMainComponentName() {
+    return "better_you";
+  }
+
+  /**
+   * Returns the instance of the {@link ReactActivityDelegate}. There the RootView is created and
+   * you can specify the rendered you wish to use (Fabric or the older renderer).
+   */
+  @Override
+  protected ReactActivityDelegate createReactActivityDelegate() {
+    return new MainActivityDelegate(this, getMainComponentName());
+  }
+
+  public static class MainActivityDelegate extends ReactActivityDelegate {
+    public MainActivityDelegate(ReactActivity activity, String mainComponentName) {
+      super(activity, mainComponentName);
+    }
+
+    @Override
+    protected ReactRootView createRootView() {
+      ReactRootView reactRootView = new ReactRootView(getContext());
+      // If you opted-in for the New Architecture, we enable the Fabric Renderer.
+      reactRootView.setIsFabric(BuildConfig.IS_NEW_ARCHITECTURE_ENABLED);
+      return reactRootView;
+    }
+  }
+}

android/app/src/main/java/com/better_you/MainApplication.java

+package com.better_you;
+
+import android.app.Application;
+import android.content.Context;
+import com.facebook.react.PackageList;
+import com.facebook.react.ReactApplication;
+import com.wenkesj.voice.VoicePackage;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+import com.facebook.react.config.ReactFeatureFlags;
+import com.facebook.soloader.SoLoader;
+import com.better_you.newarchitecture.MainApplicationReactNativeHost;
+import java.lang.reflect.InvocationTargetException;
+import java.util.List;
+
+public class MainApplication extends Application implements ReactApplication {
+
+  private final ReactNativeHost mReactNativeHost =
+      new ReactNativeHost(this) {
+        @Override
+        public boolean getUseDeveloperSupport() {
+          return BuildConfig.DEBUG;
+        }
+
+        @Override
+        protected List<ReactPackage> getPackages() {
+          @SuppressWarnings("UnnecessaryLocalVariable")
+          List<ReactPackage> packages = new PackageList(this).getPackages();
+          // Packages that cannot be autolinked yet can be added manually here, for example:
+          //packages.add(new VoicePackage());
+          return packages;
+        }
+
+        @Override
+        protected String getJSMainModuleName() {
+          return "index";
+        }
+      };
+
+  private final ReactNativeHost mNewArchitectureNativeHost =
+      new MainApplicationReactNativeHost(this);
+
+  @Override
+  public ReactNativeHost getReactNativeHost() {
+    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
+      return mNewArchitectureNativeHost;
+    } else {
+      return mReactNativeHost;
+    }
+  }
+
+  @Override
+  public void onCreate() {
+    super.onCreate();
+    // If you opted-in for the New Architecture, we enable the TurboModule system
+    ReactFeatureFlags.useTurboModules = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED;
+    SoLoader.init(this, /* native exopackage */ false);
+    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+  }
+
+  /**
+   * Loads Flipper in React Native templates. Call this in the onCreate method with something like
+   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+   *
+   * @param context
+   * @param reactInstanceManager
+   */
+  private static void initializeFlipper(
+      Context context, ReactInstanceManager reactInstanceManager) {
+    if (BuildConfig.DEBUG) {
+      try {
+        /*
+         We use reflection here to pick up the class that initializes Flipper,
+        since Flipper library is not available in release mode
+        */
+        Class<?> aClass = Class.forName("com.better_you.ReactNativeFlipper");
+        aClass
+            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
+            .invoke(null, context, reactInstanceManager);
+      } catch (ClassNotFoundException e) {
+        e.printStackTrace();
+      } catch (NoSuchMethodException e) {
+        e.printStackTrace();
+      } catch (IllegalAccessException e) {
+        e.printStackTrace();
+      } catch (InvocationTargetException e) {
+        e.printStackTrace();
+      }
+    }
+  }
+}

android/app/src/main/java/com/better_you/newarchitecture/MainApplicationReactNativeHost.java

+package com.better_you.newarchitecture;
+
+import android.app.Application;
+import androidx.annotation.NonNull;
+import com.facebook.react.PackageList;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+import com.facebook.react.ReactPackageTurboModuleManagerDelegate;
+import com.facebook.react.bridge.JSIModulePackage;
+import com.facebook.react.bridge.JSIModuleProvider;
+import com.facebook.react.bridge.JSIModuleSpec;
+import com.facebook.react.bridge.JSIModuleType;
+import com.facebook.react.bridge.JavaScriptContextHolder;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.UIManager;
+import com.facebook.react.fabric.ComponentFactory;
+import com.facebook.react.fabric.CoreComponentsRegistry;
+import com.facebook.react.fabric.EmptyReactNativeConfig;
+import com.facebook.react.fabric.FabricJSIModuleProvider;
+import com.facebook.react.uimanager.ViewManagerRegistry;
+import com.better_you.BuildConfig;
+import com.better_you.newarchitecture.components.MainComponentsRegistry;
+import com.better_you.newarchitecture.modules.MainApplicationTurboModuleManagerDelegate;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * A {@link ReactNativeHost} that helps you load everything needed for the New Architecture, both
+ * TurboModule delegates and the Fabric Renderer.
+ *
+ * <p>Please note that this class is used ONLY if you opt-in for the New Architecture (see the
+ * `newArchEnabled` property). Is ignored otherwise.
+ */
+public class MainApplicationReactNativeHost extends ReactNativeHost {
+  public MainApplicationReactNativeHost(Application application) {
+    super(application);
+  }
+
+  @Override
+  public boolean getUseDeveloperSupport() {
+    return BuildConfig.DEBUG;
+  }
+
+  @Override
+  protected List<ReactPackage> getPackages() {
+    List<ReactPackage> packages = new PackageList(this).getPackages();
+    // Packages that cannot be autolinked yet can be added manually here, for example:
+    //     packages.add(new MyReactNativePackage());
+    // TurboModules must also be loaded here providing a valid TurboReactPackage implementation:
+    //     packages.add(new TurboReactPackage() { ... });
+    // If you have custom Fabric Components, their ViewManagers should also be loaded here
+    // inside a ReactPackage.
+    return packages;
+  }
+
+  @Override
+  protected String getJSMainModuleName() {
+    return "index";
+  }
+
+  @NonNull
+  @Override
+  protected ReactPackageTurboModuleManagerDelegate.Builder
+      getReactPackageTurboModuleManagerDelegateBuilder() {
+    // Here we provide the ReactPackageTurboModuleManagerDelegate Builder. This is necessary
+    // for the new architecture and to use TurboModules correctly.
+    return new MainApplicationTurboModuleManagerDelegate.Builder();
+  }
+
+  @Override
+  protected JSIModulePackage getJSIModulePackage() {
+    return new JSIModulePackage() {
+      @Override
+      public List<JSIModuleSpec> getJSIModules(
+          final ReactApplicationContext reactApplicationContext,
+          final JavaScriptContextHolder jsContext) {
+        final List<JSIModuleSpec> specs = new ArrayList<>();
+
+        // Here we provide a new JSIModuleSpec that will be responsible of providing the
+        // custom Fabric Components.
+        specs.add(
+            new JSIModuleSpec() {
+              @Override
+              public JSIModuleType getJSIModuleType() {
+                return JSIModuleType.UIManager;
+              }
+
+              @Override
+              public JSIModuleProvider<UIManager> getJSIModuleProvider() {
+                final ComponentFactory componentFactory = new ComponentFactory();
+                CoreComponentsRegistry.register(componentFactory);
+
+                // Here we register a Components Registry.
+                // The one that is generated with the template contains no components
+                // and just provides you the one from React Native core.
+                MainComponentsRegistry.register(componentFactory);
+
+                final ReactInstanceManager reactInstanceManager = getReactInstanceManager();
+
+                ViewManagerRegistry viewManagerRegistry =
+                    new ViewManagerRegistry(
+                        reactInstanceManager.getOrCreateViewManagers(reactApplicationContext));
+
+                return new FabricJSIModuleProvider(
+                    reactApplicationContext,
+                    componentFactory,
+                    new EmptyReactNativeConfig(),
+                    viewManagerRegistry);
+              }
+            });
+        return specs;
+      }
+    };
+  }
+}

android/app/src/main/java/com/better_you/newarchitecture/components/MainComponentsRegistry.java

+package com.better_you.newarchitecture.components;
+
+import com.facebook.jni.HybridData;
+import com.facebook.proguard.annotations.DoNotStrip;
+import com.facebook.react.fabric.ComponentFactory;
+import com.facebook.soloader.SoLoader;
+
+/**
+ * Class responsible to load the custom Fabric Components. This class has native methods and needs a
+ * corresponding C++ implementation/header file to work correctly (already placed inside the jni/
+ * folder for you).
+ *
+ * <p>Please note that this class is used ONLY if you opt-in for the New Architecture (see the
+ * `newArchEnabled` property). Is ignored otherwise.
+ */
+@DoNotStrip
+public class MainComponentsRegistry {
+  static {
+    SoLoader.loadLibrary("fabricjni");
+  }
+
+  @DoNotStrip private final HybridData mHybridData;
+
+  @DoNotStrip
+  private native HybridData initHybrid(ComponentFactory componentFactory);
+
+  @DoNotStrip
+  private MainComponentsRegistry(ComponentFactory componentFactory) {
+    mHybridData = initHybrid(componentFactory);
+  }
+
+  @DoNotStrip
+  public static MainComponentsRegistry register(ComponentFactory componentFactory) {
+    return new MainComponentsRegistry(componentFactory);
+  }
+}

android/app/src/main/java/com/better_you/newarchitecture/modules/MainApplicationTurboModuleManagerDelegate.java

+package com.better_you.newarchitecture.modules;
+
+import com.facebook.jni.HybridData;
+import com.facebook.react.ReactPackage;
+import com.facebook.react.ReactPackageTurboModuleManagerDelegate;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.soloader.SoLoader;
+import java.util.List;
+
+/**
+ * Class responsible to load the TurboModules. This class has native methods and needs a
+ * corresponding C++ implementation/header file to work correctly (already placed inside the jni/
+ * folder for you).
+ *
+ * <p>Please note that this class is used ONLY if you opt-in for the New Architecture (see the
+ * `newArchEnabled` property). Is ignored otherwise.
+ */
+public class MainApplicationTurboModuleManagerDelegate
+    extends ReactPackageTurboModuleManagerDelegate {
+
+  private static volatile boolean sIsSoLibraryLoaded;
+
+  protected MainApplicationTurboModuleManagerDelegate(
+      ReactApplicationContext reactApplicationContext, List<ReactPackage> packages) {
+    super(reactApplicationContext, packages);
+  }
+
+  protected native HybridData initHybrid();
+
+  native boolean canCreateTurboModule(String moduleName);
+
+  public static class Builder extends ReactPackageTurboModuleManagerDelegate.Builder {
+    protected MainApplicationTurboModuleManagerDelegate build(
+        ReactApplicationContext context, List<ReactPackage> packages) {
+      return new MainApplicationTurboModuleManagerDelegate(context, packages);
+    }
+  }
+
+  @Override
+  protected synchronized void maybeLoadOtherSoLibraries() {
+    if (!sIsSoLibraryLoaded) {
+      // If you change the name of your application .so file in the Android.mk file,
+      // make sure you update the name here as well.
+      SoLoader.loadLibrary("better_you_appmodules");
+      sIsSoLibraryLoaded = true;
+    }
+  }
+}

android/app/src/main/jni/Android.mk

+THIS_DIR := $(call my-dir)
+
+include $(REACT_ANDROID_DIR)/Android-prebuilt.mk
+
+# If you wish to add a custom TurboModule or Fabric component in your app you
+# will have to include the following autogenerated makefile.
+# include $(GENERATED_SRC_DIR)/codegen/jni/Android.mk
+include $(CLEAR_VARS)
+
+LOCAL_PATH := $(THIS_DIR)
+
+# You can customize the name of your application .so file here.
+LOCAL_MODULE := better_you_appmodules
+
+LOCAL_C_INCLUDES := $(LOCAL_PATH)
+LOCAL_SRC_FILES := $(wildcard $(LOCAL_PATH)/*.cpp)
+LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH)
+
+# If you wish to add a custom TurboModule or Fabric component in your app you
+# will have to uncomment those lines to include the generated source 
+# files from the codegen (placed in $(GENERATED_SRC_DIR)/codegen/jni)
+#
+# LOCAL_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni
+# LOCAL_SRC_FILES += $(wildcard $(GENERATED_SRC_DIR)/codegen/jni/*.cpp)
+# LOCAL_EXPORT_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni
+
+# Here you should add any native library you wish to depend on.
+LOCAL_SHARED_LIBRARIES := \
+  libfabricjni \
+  libfbjni \
+  libfolly_futures \
+  libfolly_json \
+  libglog \
+  libjsi \
+  libreact_codegen_rncore \
+  libreact_debug \
+  libreact_nativemodule_core \
+  libreact_render_componentregistry \
+  libreact_render_core \
+  libreact_render_debug \
+  libreact_render_graphics \
+  librrc_view \
+  libruntimeexecutor \
+  libturbomodulejsijni \
+  libyoga
+
+LOCAL_CFLAGS := -DLOG_TAG=\"ReactNative\" -fexceptions -frtti -std=c++17 -Wall
+
+include $(BUILD_SHARED_LIBRARY)

android/app/src/main/jni/MainApplicationModuleProvider.cpp

+#include "MainApplicationModuleProvider.h"
+
+#include <rncore.h>
+
+namespace facebook {
+namespace react {
+
+std::shared_ptr<TurboModule> MainApplicationModuleProvider(
+    const std::string moduleName,
+    const JavaTurboModule::InitParams &params) {
+  // Here you can provide your own module provider for TurboModules coming from
+  // either your application or from external libraries. The approach to follow
+  // is similar to the following (for a library called `samplelibrary`:
+  //
+  // auto module = samplelibrary_ModuleProvider(moduleName, params);
+  // if (module != nullptr) {
+  //    return module;
+  // }
+  // return rncore_ModuleProvider(moduleName, params);
+  return rncore_ModuleProvider(moduleName, params);
+}
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/MainApplicationModuleProvider.h

+#pragma once
+
+#include <memory>
+#include <string>
+
+#include <ReactCommon/JavaTurboModule.h>
+
+namespace facebook {
+namespace react {
+
+std::shared_ptr<TurboModule> MainApplicationModuleProvider(
+    const std::string moduleName,
+    const JavaTurboModule::InitParams &params);
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp

+#include "MainApplicationTurboModuleManagerDelegate.h"
+#include "MainApplicationModuleProvider.h"
+
+namespace facebook {
+namespace react {
+
+jni::local_ref<MainApplicationTurboModuleManagerDelegate::jhybriddata>
+MainApplicationTurboModuleManagerDelegate::initHybrid(
+    jni::alias_ref<jhybridobject>) {
+  return makeCxxInstance();
+}
+
+void MainApplicationTurboModuleManagerDelegate::registerNatives() {
+  registerHybrid({
+      makeNativeMethod(
+          "initHybrid", MainApplicationTurboModuleManagerDelegate::initHybrid),
+      makeNativeMethod(
+          "canCreateTurboModule",
+          MainApplicationTurboModuleManagerDelegate::canCreateTurboModule),
+  });
+}
+
+std::shared_ptr<TurboModule>
+MainApplicationTurboModuleManagerDelegate::getTurboModule(
+    const std::string name,
+    const std::shared_ptr<CallInvoker> jsInvoker) {
+  // Not implemented yet: provide pure-C++ NativeModules here.
+  return nullptr;
+}
+
+std::shared_ptr<TurboModule>
+MainApplicationTurboModuleManagerDelegate::getTurboModule(
+    const std::string name,
+    const JavaTurboModule::InitParams &params) {
+  return MainApplicationModuleProvider(name, params);
+}
+
+bool MainApplicationTurboModuleManagerDelegate::canCreateTurboModule(
+    std::string name) {
+  return getTurboModule(name, nullptr) != nullptr ||
+      getTurboModule(name, {.moduleName = name}) != nullptr;
+}
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h

+#include <memory>
+#include <string>
+
+#include <ReactCommon/TurboModuleManagerDelegate.h>
+#include <fbjni/fbjni.h>
+
+namespace facebook {
+namespace react {
+
+class MainApplicationTurboModuleManagerDelegate
+    : public jni::HybridClass<
+          MainApplicationTurboModuleManagerDelegate,
+          TurboModuleManagerDelegate> {
+ public:
+  // Adapt it to the package you used for your Java class.
+  static constexpr auto kJavaDescriptor =
+      "Lcom/better_you/newarchitecture/modules/MainApplicationTurboModuleManagerDelegate;";
+
+  static jni::local_ref<jhybriddata> initHybrid(jni::alias_ref<jhybridobject>);
+
+  static void registerNatives();
+
+  std::shared_ptr<TurboModule> getTurboModule(
+      const std::string name,
+      const std::shared_ptr<CallInvoker> jsInvoker) override;
+  std::shared_ptr<TurboModule> getTurboModule(
+      const std::string name,
+      const JavaTurboModule::InitParams &params) override;
+
+  /**
+   * Test-only method. Allows user to verify whether a TurboModule can be
+   * created by instances of this class.
+   */
+  bool canCreateTurboModule(std::string name);
+};
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/MainComponentsRegistry.cpp

+#include "MainComponentsRegistry.h"
+
+#include <CoreComponentsRegistry.h>
+#include <fbjni/fbjni.h>
+#include <react/renderer/componentregistry/ComponentDescriptorProviderRegistry.h>
+#include <react/renderer/components/rncore/ComponentDescriptors.h>
+
+namespace facebook {
+namespace react {
+
+MainComponentsRegistry::MainComponentsRegistry(ComponentFactory *delegate) {}
+
+std::shared_ptr<ComponentDescriptorProviderRegistry const>
+MainComponentsRegistry::sharedProviderRegistry() {
+  auto providerRegistry = CoreComponentsRegistry::sharedProviderRegistry();
+
+  // Custom Fabric Components go here. You can register custom
+  // components coming from your App or from 3rd party libraries here.
+  //
+  // providerRegistry->add(concreteComponentDescriptorProvider<
+  //        AocViewerComponentDescriptor>());
+  return providerRegistry;
+}
+
+jni::local_ref<MainComponentsRegistry::jhybriddata>
+MainComponentsRegistry::initHybrid(
+    jni::alias_ref<jclass>,
+    ComponentFactory *delegate) {
+  auto instance = makeCxxInstance(delegate);
+
+  auto buildRegistryFunction =
+      [](EventDispatcher::Weak const &eventDispatcher,
+         ContextContainer::Shared const &contextContainer)
+      -> ComponentDescriptorRegistry::Shared {
+    auto registry = MainComponentsRegistry::sharedProviderRegistry()
+                        ->createComponentDescriptorRegistry(
+                            {eventDispatcher, contextContainer});
+
+    auto mutableRegistry =
+        std::const_pointer_cast<ComponentDescriptorRegistry>(registry);
+
+    mutableRegistry->setFallbackComponentDescriptor(
+        std::make_shared<UnimplementedNativeViewComponentDescriptor>(
+            ComponentDescriptorParameters{
+                eventDispatcher, contextContainer, nullptr}));
+
+    return registry;
+  };
+
+  delegate->buildRegistryFunction = buildRegistryFunction;
+  return instance;
+}
+
+void MainComponentsRegistry::registerNatives() {
+  registerHybrid({
+      makeNativeMethod("initHybrid", MainComponentsRegistry::initHybrid),
+  });
+}
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/MainComponentsRegistry.h

+#pragma once
+
+#include <ComponentFactory.h>
+#include <fbjni/fbjni.h>
+#include <react/renderer/componentregistry/ComponentDescriptorProviderRegistry.h>
+#include <react/renderer/componentregistry/ComponentDescriptorRegistry.h>
+
+namespace facebook {
+namespace react {
+
+class MainComponentsRegistry
+    : public facebook::jni::HybridClass<MainComponentsRegistry> {
+ public:
+  // Adapt it to the package you used for your Java class.
+  constexpr static auto kJavaDescriptor =
+      "Lcom/better_you/newarchitecture/components/MainComponentsRegistry;";
+
+  static void registerNatives();
+
+  MainComponentsRegistry(ComponentFactory *delegate);
+
+ private:
+  static std::shared_ptr<ComponentDescriptorProviderRegistry const>
+  sharedProviderRegistry();
+
+  static jni::local_ref<jhybriddata> initHybrid(
+      jni::alias_ref<jclass>,
+      ComponentFactory *delegate);
+};
+
+} // namespace react
+} // namespace facebook

android/app/src/main/jni/OnLoad.cpp

+#include <fbjni/fbjni.h>
+#include "MainApplicationTurboModuleManagerDelegate.h"
+#include "MainComponentsRegistry.h"
+
+JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) {
+  return facebook::jni::initialize(vm, [] {
+    facebook::react::MainApplicationTurboModuleManagerDelegate::
+        registerNatives();
+    facebook::react::MainComponentsRegistry::registerNatives();
+  });
+}

android/app/src/main/res/drawable/rn_edit_text_material.xml

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Copyright (C) 2014 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<inset xmlns:android="http://schemas.android.com/apk/res/android"
+       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
+       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
+       android:insetTop="@dimen/abc_edit_text_inset_top_material"
+       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">
+
+    <selector>
+        <!-- 
+          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
+          The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
+          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'
+
+          <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
+
+          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.
+        -->
+        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
+        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
+    </selector>
+
+</inset>

android/app/src/main/res/values/strings.xml

+<resources>
+    <string name="app_name">Better You</string>
+</resources>

android/app/src/main/res/values/styles.xml

+<resources>
+
+    <!-- Base application theme. -->
+    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
+        <!-- Customize your theme here. -->
+        <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
+    </style>
+
+</resources>

android/build.gradle

+import org.apache.tools.ant.taskdefs.condition.Os
+
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+
+buildscript {
+    ext {
+        buildToolsVersion = "31.0.0"
+        minSdkVersion = 21
+        compileSdkVersion = 31
+        targetSdkVersion = 31
+
+        if (System.properties['os.arch'] == "aarch64") {
+            // For M1 Users we need to use the NDK 24 which added support for aarch64
+            ndkVersion = "24.0.8215888"
+        } else if (Os.isFamily(Os.FAMILY_WINDOWS)) {
+            // For Android Users, we need to use NDK 23, otherwise the build will
+            // fail due to paths longer than the OS limit
+            ndkVersion = "23.1.7779620"
+        } else {
+            // Otherwise we default to the side-by-side NDK version from AGP.
+            ndkVersion = "21.4.7075529"
+        }
+    }
+    repositories {
+        google()
+        mavenCentral()
+    }
+    dependencies {
+        classpath("com.android.tools.build:gradle:7.0.4")
+        classpath("com.facebook.react:react-native-gradle-plugin")
+        classpath("de.undercouch:gradle-download-task:4.1.2")
+        // NOTE: Do not place your application dependencies here; they belong
+        // in the individual module build.gradle files
+    }
+}
+
+allprojects {
+    repositories {
+        maven {
+            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
+            url("$rootDir/../node_modules/react-native/android")
+        }
+        maven {
+            // Android JSC is installed from npm
+            url("$rootDir/../node_modules/jsc-android/dist")
+        }
+        mavenCentral {
+            // We don't want to fetch react-native from Maven Central as there are
+            // older versions over there.
+            content {
+                excludeGroup "com.facebook.react"
+            }
+        }
+        google()
+        maven { url 'https://www.jitpack.io' }
+    }
+}

android/gradle.properties

+# Project-wide Gradle settings.
+
+# IDE (e.g. Android Studio) users:
+# Gradle settings configured through the IDE *will override*
+# any settings specified in this file.
+
+# For more details on how to configure your build environment visit
+# http://www.gradle.org/docs/current/userguide/build_environment.html
+
+# Specifies the JVM arguments used for the daemon process.
+# The setting is particularly useful for tweaking memory settings.
+# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
+org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
+
+# When configured, Gradle will run in incubating parallel mode.
+# This option should only be used with decoupled projects. More details, visit
+# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
+# org.gradle.parallel=true
+
+# AndroidX package structure to make it clearer which packages are bundled with the
+# Android operating system, and which are packaged with your app's APK
+# https://developer.android.com/topic/libraries/support-library/androidx-rn
+android.useAndroidX=true
+# Automatically convert third-party libraries to use AndroidX
+android.enableJetifier=true
+
+# Version of flipper SDK to use with React Native
+FLIPPER_VERSION=0.125.0
+
+# Use this property to specify which architecture you want to build.
+# You can also override it from the CLI using
+# ./gradlew <task> -PreactNativeArchitectures=x86_64
+reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
+
+# Use this property to enable support to the new architecture.
+# This will allow you to use TurboModules and the Fabric render in
+# your application. You should enable this flag either if you want
+# to write custom TurboModules/Fabric components OR use libraries that
+# are providing them.
+newArchEnabled=false

android/gradle/wrapper/gradle-wrapper.properties

+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-all.zip
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

android/gradlew

+#!/bin/sh
+
+#
+# Copyright © 2015-2021 the original authors.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      https://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+
+##############################################################################
+#
+#   Gradle start up script for POSIX generated by Gradle.
+#
+#   Important for running:
+#
+#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
+#       noncompliant, but you have some other compliant shell such as ksh or
+#       bash, then to run this script, type that shell name before the whole
+#       command line, like:
+#
+#           ksh Gradle
+#
+#       Busybox and similar reduced shells will NOT work, because this script
+#       requires all of these POSIX shell features:
+#         * functions;
+#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
+#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
+#         * compound commands having a testable exit status, especially «case»;
+#         * various built-in commands including «command», «set», and «ulimit».
+#
+#   Important for patching:
+#
+#   (2) This script targets any POSIX shell, so it avoids extensions provided
+#       by Bash, Ksh, etc; in particular arrays are avoided.
+#
+#       The "traditional" practice of packing multiple parameters into a
+#       space-separated string is a well documented source of bugs and security
+#       problems, so this is (mostly) avoided, by progressively accumulating
+#       options in "$@", and eventually passing that to Java.
+#
+#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
+#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
+#       see the in-line comments for details.
+#
+#       There are tweaks for specific operating systems such as AIX, CygWin,
+#       Darwin, MinGW, and NonStop.
+#
+#   (3) This script is generated from the Groovy template
+#       https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       within the Gradle project.
+#
+#       You can find Gradle at https://github.com/gradle/gradle/.
+#
+##############################################################################
+
+# Attempt to set APP_HOME
+
+# Resolve links: $0 may be a link
+app_path=$0
+
+# Need this for daisy-chained symlinks.
+while
+    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
+    [ -h "$app_path" ]
+do
+    ls=$( ls -ld "$app_path" )
+    link=${ls#*' -> '}
+    case $link in             #(
+      /*)   app_path=$link ;; #(
+      *)    app_path=$APP_HOME$link ;;
+    esac
+done
+
+APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit
+
+APP_NAME="Gradle"
+APP_BASE_NAME=${0##*/}
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Use the maximum available, or set MAX_FD != -1 to use that value.
+MAX_FD=maximum
+
+warn () {
+    echo "$*"
+} >&2
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+} >&2
+
+# OS specific support (must be 'true' or 'false').
+cygwin=false
+msys=false
+darwin=false
+nonstop=false
+case "$( uname )" in                #(
+  CYGWIN* )         cygwin=true  ;; #(
+  Darwin* )         darwin=true  ;; #(
+  MSYS* | MINGW* )  msys=true    ;; #(
+  NONSTOP* )        nonstop=true ;;
+esac
+
+CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+
+
+# Determine the Java command to use to start the JVM.
+if [ -n "$JAVA_HOME" ] ; then
+    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
+        # IBM's JDK on AIX uses strange locations for the executables
+        JAVACMD=$JAVA_HOME/jre/sh/java
+    else
+        JAVACMD=$JAVA_HOME/bin/java
+    fi
+    if [ ! -x "$JAVACMD" ] ; then
+        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+else
+    JAVACMD=java
+    which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+fi
+
+# Increase the maximum file descriptors if we can.
+if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
+    case $MAX_FD in #(
+      max*)
+        MAX_FD=$( ulimit -H -n ) ||
+            warn "Could not query maximum file descriptor limit"
+    esac
+    case $MAX_FD in  #(
+      '' | soft) :;; #(
+      *)
+        ulimit -n "$MAX_FD" ||
+            warn "Could not set maximum file descriptor limit to $MAX_FD"
+    esac
+fi
+
+# Collect all arguments for the java command, stacking in reverse order:
+#   * args from the command line
+#   * the main class name
+#   * -classpath
+#   * -D...appname settings
+#   * --module-path (only if needed)
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
+
+# For Cygwin or MSYS, switch paths to Windows format before running java
+if "$cygwin" || "$msys" ; then
+    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
+    CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
+
+    JAVACMD=$( cygpath --unix "$JAVACMD" )
+
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    for arg do
+        if
+            case $arg in                                #(
+              -*)   false ;;                            # don't mess with options #(
+              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
+                    [ -e "$t" ] ;;                      #(
+              *)    false ;;
+            esac
+        then
+            arg=$( cygpath --path --ignore --mixed "$arg" )
+        fi
+        # Roll the args list around exactly as many times as the number of
+        # args, so each arg winds up back in the position where it started, but
+        # possibly modified.
+        #
+        # NB: a `for` loop captures its iteration list before it begins, so
+        # changing the positional parameters here affects neither the number of
+        # iterations, nor the values presented in `arg`.
+        shift                   # remove old arg
+        set -- "$@" "$arg"      # push replacement arg
+    done
+fi
+
+# Collect all arguments for the java command;
+#   * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of
+#     shell script including quotes and variable substitutions, so put them in
+#     double quotes to make sure that they get re-expanded; and
+#   * put everything else in single quotes, so that it's not re-expanded.
+
+set -- \
+        "-Dorg.gradle.appname=$APP_BASE_NAME" \
+        -classpath "$CLASSPATH" \
+        org.gradle.wrapper.GradleWrapperMain \
+        "$@"
+
+# Use "xargs" to parse quoted args.
+#
+# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
+#
+# In Bash we could simply go:
+#
+#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
+#   set -- "${ARGS[@]}" "$@"
+#
+# but POSIX shell has neither arrays nor command substitution, so instead we
+# post-process each arg (as a line of input to sed) to backslash-escape any
+# character that might be a shell metacharacter, then use eval to reverse
+# that process (while maintaining the separation between arguments), and wrap
+# the whole thing up as a single "set" statement.
+#
+# This will of course break if any of these variables contains a newline or
+# an unmatched quote.
+#
+
+eval "set -- $(
+        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
+        xargs -n1 |
+        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
+        tr '\n' ' '
+    )" '"$@"'
+
+exec "$JAVACMD" "$@"

android/gradlew.bat

+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+
+@if "%DEBUG%" == "" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%" == "" set DIRNAME=.
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if "%ERRORLEVEL%" == "0" goto execute
+
+echo.
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto execute
+
+echo.
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
+
+:end
+@rem End local scope for the variables with windows NT shell
+if "%ERRORLEVEL%"=="0" goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+exit /b 1
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

android/link-assets-manifest.json

+{
+  "migIndex": 1,
+  "data": [
+    {
+      "path": "src/assets/fonts/Poppins-Bold.ttf",
+      "sha1": "974b66074f1e265c0d203a4e2989c6120af3bc55"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Light.ttf",
+      "sha1": "107454fb84957d1ea4bd4c0335377df253eb2258"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Medium.ttf",
+      "sha1": "6575dbf38e9e61beec498e2be61c89d43399db24"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Regular.ttf",
+      "sha1": "dd48971530e3f19f7067ad80ce6c215365fe7269"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-SemiBold.ttf",
+      "sha1": "33cccb49029917a6175e7e7a754e296d518c2710"
+    }
+  ]
+}

android/settings.gradle

+rootProject.name = 'better_you'
+include ':@react-native-voice_voice'
+project(':@react-native-voice_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-voice/voice/android')
+include ':@react-native-voice_voice'
+project(':@react-native-voice_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-voice/voice/android')
+include ':@react-native-voice_voice'
+project(':@react-native-voice_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-voice/voice/android')
+include ':@react-native-community_voice'
+project(':@react-native-community_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/voice/android')
+apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
+include ':app'
+includeBuild('../node_modules/react-native-gradle-plugin')
+
+
+include ':react-native-vector-icons'
+project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
+
+include ':@react-native-voice_voice', ':app'
+project(':@react-native-voice_voice').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-voice/voice/android')
+
+if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") {
+    include(":ReactAndroid")
+    project(":ReactAndroid").projectDir = file('../node_modules/react-native/ReactAndroid')
+}

app.json

+{
+  "name": "better_you",
+  "displayName": "better_you"
+}
\ No newline at end of file

babel.config.js

+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+};

index.js

+/**
+ * @format
+ */
+
+import {AppRegistry} from 'react-native';
+import App from './App';
+import {name as appName} from './app.json';
+
+AppRegistry.registerComponent(appName, () => App);

ios/Podfile

+require_relative '../node_modules/react-native/scripts/react_native_pods'
+require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
+
+platform :ios, '11.0'
+install! 'cocoapods', :deterministic_uuids => false
+
+target 'better_you' do
+  config = use_native_modules!
+
+  # Flags change depending on the env values.
+  flags = get_default_flags()
+
+  use_react_native!(
+    :path => config[:reactNativePath],
+    # to enable hermes on iOS, change `false` to `true` and then install pods
+    :hermes_enabled => flags[:hermes_enabled],
+    :fabric_enabled => flags[:fabric_enabled],
+    # An absolute path to your application root.
+    :app_path => "#{Pod::Config.instance.installation_root}/.."
+  )
+
+  pod 'react-native-voice', :path => '../node_modules/@react-native-community/voice'
+
+  target 'better_youTests' do
+    inherit! :complete
+    # Pods for testing
+  end
+
+  # Enables Flipper.
+  #
+  # Note that if you have use_frameworks! enabled, Flipper will not work and
+  # you should disable the next line.
+  use_flipper!()
+
+  post_install do |installer|
+    react_native_post_install(installer)
+    __apply_Xcode_12_5_M1_post_install_workaround(installer)
+  end
+end

ios/better_you.xcodeproj/xcshareddata/xcschemes/better_you.xcscheme

+<?xml version="1.0" encoding="UTF-8"?>
+<Scheme
+   LastUpgradeVersion = "1210"
+   version = "1.3">
+   <BuildAction
+      parallelizeBuildables = "YES"
+      buildImplicitDependencies = "YES">
+      <BuildActionEntries>
+         <BuildActionEntry
+            buildForTesting = "YES"
+            buildForRunning = "YES"
+            buildForProfiling = "YES"
+            buildForArchiving = "YES"
+            buildForAnalyzing = "YES">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+               BuildableName = "better_you.app"
+               BlueprintName = "better_you"
+               ReferencedContainer = "container:better_you.xcodeproj">
+            </BuildableReference>
+         </BuildActionEntry>
+      </BuildActionEntries>
+   </BuildAction>
+   <TestAction
+      buildConfiguration = "Debug"
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      shouldUseLaunchSchemeArgsEnv = "YES">
+      <Testables>
+         <TestableReference
+            skipped = "NO">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "00E356ED1AD99517003FC87E"
+               BuildableName = "better_youTests.xctest"
+               BlueprintName = "better_youTests"
+               ReferencedContainer = "container:better_you.xcodeproj">
+            </BuildableReference>
+         </TestableReference>
+      </Testables>
+   </TestAction>
+   <LaunchAction
+      buildConfiguration = "Debug"
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      launchStyle = "0"
+      useCustomWorkingDirectory = "NO"
+      ignoresPersistentStateOnLaunch = "NO"
+      debugDocumentVersioning = "YES"
+      debugServiceExtension = "internal"
+      allowLocationSimulation = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+            BuildableName = "better_you.app"
+            BlueprintName = "better_you"
+            ReferencedContainer = "container:better_you.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+   </LaunchAction>
+   <ProfileAction
+      buildConfiguration = "Release"
+      shouldUseLaunchSchemeArgsEnv = "YES"
+      savedToolIdentifier = ""
+      useCustomWorkingDirectory = "NO"
+      debugDocumentVersioning = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
+            BuildableName = "better_you.app"
+            BlueprintName = "better_you"
+            ReferencedContainer = "container:better_you.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+   </ProfileAction>
+   <AnalyzeAction
+      buildConfiguration = "Debug">
+   </AnalyzeAction>
+   <ArchiveAction
+      buildConfiguration = "Release"
+      revealArchiveInOrganizer = "YES">
+   </ArchiveAction>
+</Scheme>

ios/better_you/AppDelegate.h

+#import <React/RCTBridgeDelegate.h>
+#import <UIKit/UIKit.h>
+
+@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate>
+
+@property (nonatomic, strong) UIWindow *window;
+
+@end

ios/better_you/AppDelegate.mm

+#import "AppDelegate.h"
+
+#import <React/RCTBridge.h>
+#import <React/RCTBundleURLProvider.h>
+#import <React/RCTRootView.h>
+
+#import <React/RCTAppSetupUtils.h>
+
+#if RCT_NEW_ARCH_ENABLED
+#import <React/CoreModulesPlugins.h>
+#import <React/RCTCxxBridgeDelegate.h>
+#import <React/RCTFabricSurfaceHostingProxyRootView.h>
+#import <React/RCTSurfacePresenter.h>
+#import <React/RCTSurfacePresenterBridgeAdapter.h>
+#import <ReactCommon/RCTTurboModuleManager.h>
+
+#import <react/config/ReactNativeConfig.h>
+
+@interface AppDelegate () <RCTCxxBridgeDelegate, RCTTurboModuleManagerDelegate> {
+  RCTTurboModuleManager *_turboModuleManager;
+  RCTSurfacePresenterBridgeAdapter *_bridgeAdapter;
+  std::shared_ptr<const facebook::react::ReactNativeConfig> _reactNativeConfig;
+  facebook::react::ContextContainer::Shared _contextContainer;
+}
+@end
+#endif
+
+@implementation AppDelegate
+
+- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
+{
+  RCTAppSetupPrepareApp(application);
+
+  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
+
+#if RCT_NEW_ARCH_ENABLED
+  _contextContainer = std::make_shared<facebook::react::ContextContainer const>();
+  _reactNativeConfig = std::make_shared<facebook::react::EmptyReactNativeConfig const>();
+  _contextContainer->insert("ReactNativeConfig", _reactNativeConfig);
+  _bridgeAdapter = [[RCTSurfacePresenterBridgeAdapter alloc] initWithBridge:bridge contextContainer:_contextContainer];
+  bridge.surfacePresenter = _bridgeAdapter.surfacePresenter;
+#endif
+
+  UIView *rootView = RCTAppSetupDefaultRootView(bridge, @"better_you", nil);
+
+  if (@available(iOS 13.0, *)) {
+    rootView.backgroundColor = [UIColor systemBackgroundColor];
+  } else {
+    rootView.backgroundColor = [UIColor whiteColor];
+  }
+
+  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
+  UIViewController *rootViewController = [UIViewController new];
+  rootViewController.view = rootView;
+  self.window.rootViewController = rootViewController;
+  [self.window makeKeyAndVisible];
+  return YES;
+}
+
+- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
+{
+#if DEBUG
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
+#else
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+#endif
+}
+
+#if RCT_NEW_ARCH_ENABLED
+
+#pragma mark - RCTCxxBridgeDelegate
+
+- (std::unique_ptr<facebook::react::JSExecutorFactory>)jsExecutorFactoryForBridge:(RCTBridge *)bridge
+{
+  _turboModuleManager = [[RCTTurboModuleManager alloc] initWithBridge:bridge
+                                                             delegate:self
+                                                            jsInvoker:bridge.jsCallInvoker];
+  return RCTAppSetupDefaultJsExecutorFactory(bridge, _turboModuleManager);
+}
+
+#pragma mark RCTTurboModuleManagerDelegate
+
+- (Class)getModuleClassFromName:(const char *)name
+{
+  return RCTCoreModulesClassProvider(name);
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:(const std::string &)name
+                                                      jsInvoker:(std::shared_ptr<facebook::react::CallInvoker>)jsInvoker
+{
+  return nullptr;
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:(const std::string &)name
+                                                     initParams:
+                                                         (const facebook::react::ObjCTurboModule::InitParams &)params
+{
+  return nullptr;
+}
+
+- (id<RCTTurboModule>)getModuleInstanceFromClass:(Class)moduleClass
+{
+  return RCTAppSetupDefaultModuleFromClass(moduleClass);
+}
+
+#endif
+
+@end

ios/better_you/Images.xcassets/AppIcon.appiconset/Contents.json

+{
+  "images" : [
+    {
+      "idiom" : "iphone",
+      "scale" : "2x",
+      "size" : "20x20"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "3x",
+      "size" : "20x20"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "2x",
+      "size" : "29x29"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "3x",
+      "size" : "29x29"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "2x",
+      "size" : "40x40"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "3x",
+      "size" : "40x40"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "2x",
+      "size" : "60x60"
+    },
+    {
+      "idiom" : "iphone",
+      "scale" : "3x",
+      "size" : "60x60"
+    },
+    {
+      "idiom" : "ios-marketing",
+      "scale" : "1x",
+      "size" : "1024x1024"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

ios/better_you/Images.xcassets/Contents.json

+{
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/better_you/Info.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>en</string>
+	<key>CFBundleDisplayName</key>
+	<string>better_you</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>1.0</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>1</string>
+	<key>LSRequiresIPhoneOS</key>
+	<true/>
+	<key>NSAppTransportSecurity</key>
+	<dict>
+		<key>NSExceptionDomains</key>
+		<dict>
+			<key>localhost</key>
+			<dict>
+				<key>NSExceptionAllowsInsecureHTTPLoads</key>
+				<true/>
+			</dict>
+		</dict>
+	</dict>
+	<key>NSLocationWhenInUseUsageDescription</key>
+	<string/>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIRequiredDeviceCapabilities</key>
+	<array>
+		<string>armv7</string>
+	</array>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UIViewControllerBasedStatusBarAppearance</key>
+	<false/>
+	<key>UIAppFonts</key>
+	<array>
+		<string>Poppins-Bold.ttf</string>
+		<string>Poppins-Light.ttf</string>
+		<string>Poppins-Medium.ttf</string>
+		<string>Poppins-Regular.ttf</string>
+		<string>Poppins-SemiBold.ttf</string>
+	</array>
+</dict>
+</plist>

ios/better_you/LaunchScreen.storyboard

+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="15702" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <device id="retina4_7" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15704"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
+                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="better_you" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="GJd-Yh-RWb">
+                                <rect key="frame" x="0.0" y="202" width="375" height="43"/>
+                                <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Powered by React Native" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="MN2-I3-ftu">
+                                <rect key="frame" x="0.0" y="626" width="375" height="21"/>
+                                <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                        </subviews>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
+                        <constraints>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="bottom" secondItem="MN2-I3-ftu" secondAttribute="bottom" constant="20" id="OZV-Vh-mqD"/>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="GJd-Yh-RWb" secondAttribute="centerX" id="Q3B-4B-g5h"/>
+                            <constraint firstItem="MN2-I3-ftu" firstAttribute="centerX" secondItem="Bcu-3y-fUS" secondAttribute="centerX" id="akx-eg-2ui"/>
+                            <constraint firstItem="MN2-I3-ftu" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" id="i1E-0Y-4RG"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="bottom" multiplier="1/3" constant="1" id="moa-c2-u7t"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" symbolic="YES" id="x7j-FC-K8j"/>
+                        </constraints>
+                        <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="52.173913043478265" y="375"/>
+        </scene>
+    </scenes>
+</document>

ios/better_you/main.m

+#import <UIKit/UIKit.h>
+
+#import "AppDelegate.h"
+
+int main(int argc, char *argv[])
+{
+  @autoreleasepool {
+    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
+  }
+}

ios/better_youTests/Info.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>en</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>$(PRODUCT_NAME)</string>
+	<key>CFBundlePackageType</key>
+	<string>BNDL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>1.0</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>1</string>
+</dict>
+</plist>

ios/better_youTests/better_youTests.m

+#import <UIKit/UIKit.h>
+#import <XCTest/XCTest.h>
+
+#import <React/RCTLog.h>
+#import <React/RCTRootView.h>
+
+#define TIMEOUT_SECONDS 600
+#define TEXT_TO_LOOK_FOR @"Welcome to React"
+
+@interface better_youTests : XCTestCase
+
+@end
+
+@implementation better_youTests
+
+- (BOOL)findSubviewInView:(UIView *)view matching:(BOOL (^)(UIView *view))test
+{
+  if (test(view)) {
+    return YES;
+  }
+  for (UIView *subview in [view subviews]) {
+    if ([self findSubviewInView:subview matching:test]) {
+      return YES;
+    }
+  }
+  return NO;
+}
+
+- (void)testRendersWelcomeScreen
+{
+  UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController];
+  NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];
+  BOOL foundElement = NO;
+
+  __block NSString *redboxError = nil;
+#ifdef DEBUG
+  RCTSetLogFunction(
+      ^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) {
+        if (level >= RCTLogLevelError) {
+          redboxError = message;
+        }
+      });
+#endif
+
+  while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {
+    [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
+    [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];
+
+    foundElement = [self findSubviewInView:vc.view
+                                  matching:^BOOL(UIView *view) {
+                                    if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {
+                                      return YES;
+                                    }
+                                    return NO;
+                                  }];
+  }
+
+#ifdef DEBUG
+  RCTSetLogFunction(RCTDefaultLogFunction);
+#endif
+
+  XCTAssertNil(redboxError, @"RedBox error: %@", redboxError);
+  XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);
+}
+
+@end

ios/link-assets-manifest.json

+{
+  "migIndex": 1,
+  "data": [
+    {
+      "path": "src/assets/fonts/Poppins-Bold.ttf",
+      "sha1": "974b66074f1e265c0d203a4e2989c6120af3bc55"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Light.ttf",
+      "sha1": "107454fb84957d1ea4bd4c0335377df253eb2258"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Medium.ttf",
+      "sha1": "6575dbf38e9e61beec498e2be61c89d43399db24"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-Regular.ttf",
+      "sha1": "dd48971530e3f19f7067ad80ce6c215365fe7269"
+    },
+    {
+      "path": "src/assets/fonts/Poppins-SemiBold.ttf",
+      "sha1": "33cccb49029917a6175e7e7a754e296d518c2710"
+    }
+  ]
+}

metro.config.js

+/**
+ * Metro configuration for React Native
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ */
+
+module.exports = {
+  transformer: {
+    getTransformOptions: async () => ({
+      transform: {
+        experimentalImportSupport: false,
+        inlineRequires: true,
+      },
+    }),
+  },
+};

package.json

+{
+  "name": "better_you",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "android": "react-native run-android",
+    "ios": "react-native run-ios",
+    "start": "react-native start",
+    "test": "jest",
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "@alan-ai/alan-sdk-react-native": "^1.15.0",
+    "@react-native-async-storage/async-storage": "^1.17.3",
+    "@react-native-voice/voice": "^3.2.4",
+    "@react-navigation/core": "^6.2.1",
+    "@react-navigation/native": "^6.0.10",
+    "@react-navigation/native-stack": "^6.6.2",
+    "@react-navigation/stack": "^6.2.1",
+    "axios": "^0.27.2",
+    "react": "17.0.2",
+    "react-native": "0.68.1",
+    "react-native-gifted-chat": "^1.0.4",
+    "react-native-onboarding-swiper": "^1.2.0",
+    "react-native-safe-area-context": "^4.2.4",
+    "react-native-screens": "^3.13.1",
+    "react-native-uuid": "^2.0.1",
+    "react-native-vector-icons": "^9.2.0",
+    "unix-timestamp": "^1.0.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.17.9",
+    "@babel/runtime": "^7.17.9",
+    "@react-native-community/eslint-config": "^3.0.1",
+    "babel-jest": "^28.0.0",
+    "eslint": "^8.14.0",
+    "jest": "^28.0.0",
+    "metro-react-native-babel-preset": "^0.70.2",
+    "react-test-renderer": "17.0.2"
+  },
+  "jest": {
+    "preset": "react-native"
+  }
+}

react-native.config.js

+module.exports = {
+    project: {
+        ios:{},
+        android:{}
+    },
+    assets:['./src/assets/fonts/'],
+}
\ No newline at end of file

src/api.js

+import axios from "axios";
+
+const RASA_BASE = "http://127.0.0.1:5005/webhooks/rest/webhook/"
+const SENTI_BASE = "http://127.0.0.1:8000/"
+
+export async function sendToRasa (body){
+    return axios({
+        url:RASA_BASE,
+        method: "POST",
+        data: body
+    })
+}
+
+export async function predict (body){
+    return axios({
+        url:`${SENTI_BASE}/test`,
+        method: "POST",
+        data: body
+    })
+}
+
+export async function getChats (id){
+    return axios({
+        url:`${SENTI_BASE}/chats/${id}`,
+        method:"GET"
+    })
+}
\ No newline at end of file

src/assets/images/chatbotImage.js

+export const IMAGE={
+    chatbot:"data:image/jpeg;base64,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"
+}
\ No newline at end of file

src/assets/utils/UnixConverter.js

+
+const timestamp = require('unix-timestamp');
+
+export function unixConvertion(val){
+    return timestamp.toDate(val)
+}
\ No newline at end of file

src/components/chatbot/ChatHeader.js

+import { useNavigation } from "@react-navigation/core";
+import React from "react";
+import { View, Text, StyleSheet, TouchableOpacity, Image } from "react-native";
+import Icon from "react-native-vector-icons/FontAwesome5";
+import { COLOR } from '../../themes';
+
+export const ChatHeader = ({onPress}) => {
+    const navigation = useNavigation();
+	return (
+		<View style={styles.container}>
+			<TouchableOpacity style={styles.backButton}>
+            <Icon name="angle-left" size={30}/>
+			</TouchableOpacity>
+			<View style={styles.profileOptions}>
+				<TouchableOpacity style={styles.profile}>
+					<Image style={styles.image} source={require('../../assets/images/chatbot.png')} />
+                    <View style={styles.usernameAndOnlineStatus}>
+						<Text style={styles.username}>Chatbot</Text>
+						<Text style={styles.onlineStatus}>AI Automated chatbot</Text>
+					</View>
+				</TouchableOpacity>
+				<View style={styles.options}>
+					{/* <TouchableOpacity
+						style={{ paddingHorizontal: 5 }}
+					>
+						<Icon
+							name="phone"
+							size={30}
+							color={COLOR.white}
+						/>
+					</TouchableOpacity> */}
+					<TouchableOpacity onPress={onPress} style={{ paddingHorizontal: 20 }}>
+						<Icon
+							name="file-contract"
+							size={30}
+							color={COLOR.white}
+						/>
+					</TouchableOpacity>
+				</View>
+			</View>
+		</View>
+	);
+};
+
+const styles = StyleSheet.create({
+	container: {
+		flexDirection: "row",
+		backgroundColor: COLOR.primary,
+		paddingTop: 10,
+		paddingBottom: 10,
+	},
+	backButton: {
+		alignSelf: "center",
+		paddingHorizontal: 10,
+	},
+	profileOptions: {
+		flex: 1,
+		flexDirection: "row",
+		justifyContent: "space-between",
+		alignItems: "center",
+		paddingHorizontal: 10,
+	},
+	profile: {
+		flexDirection: "row",
+		alignItems: "center",
+		borderColor: COLOR.white,
+		flex: 4,
+	},
+	image: {
+		height: 65,
+		width: 65,
+		borderRadius: 32.5,
+	},
+	usernameAndOnlineStatus: {
+		flexDirection: "column",
+		justifyContent: "center",
+		paddingHorizontal: 10,
+	},
+	username: {
+		color: COLOR.white,
+		fontSize: 18,
+		fontWeight: "bold",
+	},
+	onlineStatus: {
+		color: COLOR.white,
+		fontSize: 16,
+	},
+	options: {
+		flex: 1,
+		flexDirection: "row",
+		justifyContent: "flex-end",
+		alignItems: "center",
+	},
+});

src/components/chatbot/react-native.confiig.js

+module.exports = {
+    dependencies: {
+      'react-native-vector-icons': {
+        platforms: {
+          ios: null,
+        },
+      },
+    },
+  };
\ No newline at end of file

src/screens/Chatbot.js

+import axios from 'axios';
+import React, { useCallback, useEffect, useState } from 'react'
+import { Text, View, Animated, StyleSheet, TouchableOpacity, Image, Modal} from 'react-native'
+import { Bubble, GiftedChat, InputToolbar, Send } from 'react-native-gifted-chat';
+import { getChats, predict, sendToRasa } from '../api';
+import { ChatHeader } from '../components/chatbot/ChatHeader'
+import uuid from 'react-native-uuid';
+import {IMAGE} from '../assets/images/chatbotImage'
+import { COLOR, FONT } from '../themes';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
+import { unixConvertion } from '../assets/utils/UnixConverter';
+import { useRef } from 'react';
+
+export const Chatbot = () => {
+  const [messages, setMessages] = useState([]);
+  const [start, setStart] = useState(true);
+  const [end, setEnd] = useState(false);
+  const [predictResult, setPredictResault] = useState("");
+  const [visible, setVisible] = useState(false);
+
+  //Control the popup modal
+  const ModalPoup = ({visible, children}) => {
+  const [showModal, setShowModal] = useState(visible);
+  const scaleValue = useRef(new Animated.Value(0)).current;
+
+  useEffect(() => {
+    toggleModal();
+  }, [visible]);
+
+  const toggleModal = () => {
+    if (visible) {
+      setShowModal(true);
+      Animated.spring(scaleValue, {
+        toValue: 1,
+        duration: 300,
+        useNativeDriver: true,
+      }).start();
+    } else {
+      setTimeout(() => setShowModal(false), 200);
+      Animated.timing(scaleValue, {
+        toValue: 0,
+        duration: 300,
+        useNativeDriver: true,
+      }).start();
+    }
+  };
+  return (
+    <Modal transparent visible={showModal}>
+      <View style={styles.modalBackGround}>
+        <Animated.View
+          style={[styles.modalContainer, {transform: [{scale: scaleValue}]}]}>
+          {children}
+        </Animated.View>
+      </View>
+    </Modal>
+  );
+};
+
+
+
+  const BOT_USER = {
+    _id: 2,
+    name: 'FAQ Bot',
+    avatar: IMAGE.chatbot
+  };
+  const USER = {
+    _id:1,
+    name: 'USER',
+  };
+
+  const BOT_MSG = [{
+    _id: uuid.v4(),
+    text: `Hi! I am the AI chatbot 🤖 \n\nHow may I help you with today?`,
+    createdAt: new Date(),
+    user: BOT_USER
+  }]
+
+  useEffect(() => {
+    getChatForUser();
+    setStart(true);
+  }, [])
+
+  //get chat for  specific user
+const getChatForUser=async() => {
+    try{
+      const res = await getChats(USER._id)
+      const filter1 = res.data[0].events
+
+      //Filter the User and Bot messaages
+      const chats = filter1.filter((n)=>{
+        return (n.event == "user" || n.event=="bot") && n
+      }) 
+      console.log(chats)
+      let conv = [];
+      chats.map((c)=>{
+        if(c.event=="bot"){
+          const chat = {
+           ...c,
+           _id:uuid.v4(),
+           createdAt:new Date(unixConvertion(c.timestamp)),
+           user: BOT_USER
+           }
+           conv.push(chat)
+        }
+        else{
+          const chat = {
+            ...c,
+            _id:uuid.v4(),
+            createdAt:new Date(unixConvertion(c.timestamp)),
+            user:USER
+          }
+          conv.push(chat)
+        }
+      }
+      )
+      console.log(conv)
+      setMessages(conv.concat(BOT_MSG));
+    }
+    catch(err){
+      console.log(err)
+    }
+  }
+
+
+  const onSend = useCallback(async(msg = []) => {
+
+    console.log(msg[0].text);
+    setMessages(previousMessages => (GiftedChat.append(previousMessages, msg)));
+    try{
+      const req = {message:msg[0].text, sender: USER._id}
+      const res = await sendToRasa(req);
+      let reply = [];
+      res.data.map((d)=>{
+        console.log(d.text);
+         const rp = {
+          _id:uuid.v4(),
+          text: d.text,
+          createdAt: new Date(),
+          user: BOT_USER
+          }
+          reply.push(rp)
+      }
+      )
+      setMessages(prev=> prev.concat(reply));
+
+      //send for prediction
+      const prediction =  await predict({"start": start, "text":msg[0].text, "end":end});
+      console.log(prediction.data.overall);
+      setPredictResault(prediction.data.overall)
+      setStart(false); 
+    }
+    catch(err){
+      console.log(err)
+    }
+  }, [])
+
+
+  //Customize bubbles
+  const renderBubble = (props)=>{
+    return(
+    <Bubble
+      {...props}
+      wrapperStyle={{
+        right:{
+          backgroundColor: COLOR.primary
+        },
+        left:{
+          backgroundColor: COLOR.white
+        }
+      }}
+      textStyle={{
+        right:{
+          fontFamily:FONT.Regular,
+          color:COLOR.white,
+          fontSize:14,
+        },
+        left:{
+          fontFamily:FONT.Regular,
+          fontSize:14,
+          color:COLOR.greyFont
+        }
+      }}
+    />
+    )
+  }
+
+
+  //Change the send button
+  const renderSend = (props) => {
+    return(
+      <Send {...props}>
+        <View>
+          <MaterialCommunityIcons name='send-circle' size={42} style={{marginBottom:5, marginRight:5}} color={COLOR.primary}/>
+        </View>
+      </Send>
+    )
+
+  }
+
+  return (
+    <View style={{flex:1}}>
+    {/* Popup Modal */}
+     <ModalPoup visible={visible}>
+        <View style={{alignItems: 'center'}}>
+          <View style={styles.header}>
+            <TouchableOpacity onPress={() => setVisible(false)}>
+              <Image
+                source={require('../assets/images/close.png')}
+                style={{height: 30, width: 30}}
+              />
+            </TouchableOpacity>
+          </View>
+        </View>
+        <View style={{alignItems: 'center'}}>
+          <Image
+            source={require('../assets/images/chatbot.png')}
+            style={{height: 150, width: 150, marginVertical: 10}}
+          />
+        </View>
+
+        <Text style={{marginVertical: 10, fontSize: 22, textAlign: 'center', color:COLOR.greyFont, fontFamily:FONT.SemiBold}}>
+          Completed
+        </Text>
+        <Text style={{fontSize: 15, textAlign: 'center', color:COLOR.greyFont, fontFamily:FONT.Regular}}>
+          Overall Emotion: {predictResult.overalEmotion}
+        </Text>
+        <Text style={{fontSize: 15, textAlign: 'center', color:COLOR.greyFont, fontFamily:FONT.Regular}}>
+          Overall Score: {predictResult.overalScore}
+        </Text>
+      </ModalPoup>
+
+    <ChatHeader onPress={() => setVisible(true)}/>
+
+    <GiftedChat
+      messages={messages.reverse()}
+      onSend={msg => onSend(msg)}
+      user={USER}
+      alwaysShowSend={true}
+      renderAvatarOnTop={true}
+      renderBubble={renderBubble}
+      renderSend={renderSend}
+      scrollToBottom
+      textStyle={{color:'black'}}
+      renderInputToolbar={(props)=>{
+        return <InputToolbar {...props}
+        containerStyle={{borderTopWidth:1.5, borderTopColor:COLOR.primary}}
+        textInputStyle={{color:COLOR.greyFont}}/>
+        }}
+    />
+    </View>
+  )
+}
+
+
+
+
+
+const styles = StyleSheet.create({
+  modalBackGround: {
+    flex: 1,
+    backgroundColor: 'rgba(0,0,0,0.5)',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  modalContainer: {
+    width: '80%',
+    backgroundColor: 'white',
+    paddingHorizontal: 20,
+    paddingVertical: 30,
+    borderRadius: 20,
+    elevation: 20,
+  },
+  header: {
+    width: '100%',
+    height: 40,
+    alignItems: 'flex-end',
+    justifyContent: 'center',
+  },
+});
\ No newline at end of file

src/screens/Home.js

+//import liraries
+import { useNavigation } from '@react-navigation/core';
+import React, { Component } from 'react';
+import { View, Text, StyleSheet, Button } from 'react-native';
+import { FONT } from '../themes';
+
+// create a component
+export const Home = () => {
+    const navigation = useNavigation();
+    return (
+        <View style={styles.container}>
+            <Text style={{fontSize:20, fontFamily:FONT.Regular}}>Home</Text>
+            <Button title="Chatbot" onPress={()=> navigation.navigate('Chatbot')}/>
+            {/* <Button title="Alan" onPress={()=> navigation.navigate('VoiceConversation')}/> */}
+        </View>
+    );
+};
+
+// define your styles
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        fontFamily:FONT.Regular,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: '#2c3e50',
+    },
+});
+

src/screens/Onboard.js

+import React from 'react';
+import { Image, View, StyleSheet, TouchableOpacity, Text, Button } from 'react-native';
+import Onboarding from 'react-native-onboarding-swiper';
+import { useNavigation } from '@react-navigation/core';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { COLOR } from '../themes';
+
+
+const Square = ({ isLight, selected }) => {
+  let backgroundColor;
+  let width;
+  if (isLight) {
+    backgroundColor = selected ? COLOR.primary : 'rgba(0, 0, 0, 0.3)';
+    width = selected ? 40 : 8
+  } else {
+    backgroundColor = selected ? COLOR.primary : 'rgba(255, 255, 255, 0.5)';
+  }
+  return (
+    <View
+      style={{
+        width,
+        height: 8,
+        marginHorizontal:1,
+        borderRadius:8,
+        backgroundColor,
+      }}
+    />
+  );
+};
+
+const Done = ({ isLight, ...props }) => {
+    const navigation = useNavigation();
+  return (  <TouchableOpacity {...props} onPress={async ()=>{
+  // await AsyncStorage.setItem('hasOnboarded',true
+  // );
+  navigation.navigate('Home')
+       }
+    }>
+    <View style={{
+        backgroundColor: COLOR.primary,
+        alignItems: 'center', 
+        justifyContent: 'center',
+        paddingVertical:"3%",
+        paddingHorizontal:"10%",
+        marginRight:15,
+        borderRadius: 20
+      }}
+    >
+      <Text style={{ color: COLOR.white,fontSize:16 }}>Get Start</Text>
+    </View>
+  </TouchableOpacity>
+);
+    }
+const Skip = ({ ...props}) =>{
+    const navigation = useNavigation();
+  return(
+  <TouchableOpacity {...props} onPress={async ()=>{
+    await AsyncStorage.setItem('hasOnboarded', JSON.stringify({
+    hasOnboarded:true
+  }));
+  navigation.navigate('Home')
+  }}>
+  <View style={{
+      backgroundColor: COLOR.white,
+      alignItems: 'center', 
+      justifyContent: 'center',
+      paddingVertical:"3%",
+      paddingHorizontal:"10%",
+      marginLeft:15,
+      borderRadius: 20
+    }}
+  >
+    <Text style={{ color: COLOR.primary,fontSize:16, fontWeight:"bold"}}>Skip</Text>
+  </View>
+</TouchableOpacity>
+)};
+
+
+const Next = ({ isLight, ...props }) => (
+    <TouchableOpacity {...props}>
+  <View style={{
+      backgroundColor: COLOR.primary,
+      alignItems: 'center', 
+      justifyContent: 'center',
+      paddingVertical:"3%",
+      paddingHorizontal:"10%",
+      marginRight:15,
+      borderRadius: 20
+    }}
+  >
+    <Text style={{ color: COLOR.white,fontSize:16 }}>Next</Text>
+  </View>
+</TouchableOpacity>
+  );
+
+export const Onboard = () => (
+  <Onboarding
+    DotComponent={Square}
+    NextButtonComponent={Next}
+    SkipButtonComponent={Skip}
+    DoneButtonComponent={Done}
+    bottomBarColor={COLOR.white}
+    subTitleStyles={{fontSize:14,marginTop:-60,paddingHorizontal:10}}
+    titleStyles={{fontWeight:"bold", fontSize:24, marginTop:-120}} // set default color for the title
+    pages={[
+      {
+        backgroundColor: COLOR.backgroundOnBoard,
+        image: <Image style={styles.image} source={require('../assets/images/onboard1.jpg')} />,
+        title: "Buy & Selling",
+        subtitle: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
+
+      },
+      {
+        backgroundColor: COLOR.backgroundOnBoard,
+        image: <Image style={styles.image} source={require('../assets/images/onboard2.jpg')} />,
+        title: 'From Anywhere ',
+        subtitle: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
+      },
+      {
+        backgroundColor: COLOR.backgroundOnBoard,
+        image: <Image style={[styles.image]} source={require('../assets/images/onboard3.jpg')} />,
+        title: 'Real State',
+        subtitle: "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
+      },
+    ]}
+  />
+);
+
+const styles = StyleSheet.create({
+    image:{
+        width:"100%",
+        height:"75%",
+        margin:0
+    },
+    button:{
+        backgroundColor:COLOR.white,
+    }
+})
\ No newline at end of file

src/screens/VoiceConversation.js

+import React, {useEffect, useState} from 'react';
+import {
+  View,
+  StyleSheet,
+  TextInput,
+  TouchableOpacity,
+  ScrollView,
+  Text,
+  ToastAndroid,
+  ImageBackground,
+} from 'react-native';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
+import {COLOR, FONT} from '../themes';
+import Voice from '`@react-native-community/voice`';
+import {sendToRasa} from '../api/';
+import {IMAGE} from '../assets/images/chatbotImage';
+import Tts from 'react-native-tts';
+import Lottie from 'lottie-react-native';
+import {LogBox} from 'react-native';
+
+export function VoiceConversation() {
+  LogBox.ignoreLogs(['new NativeEventEmitter']); // Ignore log notification by message
+  LogBox.ignoreAllLogs(); //Ignore all log notifications
+  Tts.setDefaultRate(0.4);
+
+  const [pitch, setPitch] = useState('');
+  const [error, setError] = useState('');
+  const [end, setEnd] = useState(true);
+  const [started, setStarted] = useState(false);
+  const [reply, setReply] = useState('Hey, How are you?');
+  const [results, setResults] = useState(['Hi']);
+  const [partialResults, setPartialResults] = useState([]);
+
+  const BOT_USER = {
+    _id: 2,
+    name: 'FAQ Bot',
+    avatar: IMAGE.chatbot,
+  };
+  const USER = {
+    _id: 1,
+    name: 'USER',
+  };
+
+  const onSpeechStart = e => {
+    setStarted(true);
+  };
+  const onSpeechEnd = () => {
+    setStarted(false);
+    setEnd(true);
+    setStarted(false);
+  };
+  const onSpeechError = e => {
+    setError(JSON.stringify(e.error));
+  };
+  const onSpeechResults = e => {
+    console.log(e.value[0]);
+    setResults(e.value[0]);
+    getReply(e.value[0]);
+  };
+  const onSpeechPartialResults = e => {
+    setPartialResults(e.value);
+  };
+  const onSpeechVolumeChanged = e => {
+    setPitch(e.value);
+  };
+
+  useEffect(() => {
+    Voice.onSpeechStart = onSpeechStart;
+    Voice.onSpeechEnd = onSpeechEnd;
+    Voice.onSpeechError = onSpeechError;
+    Voice.onSpeechResults = onSpeechResults;
+    Voice.onSpeechPartialResults = onSpeechPartialResults;
+    Voice.onSpeechVolumeChanged = onSpeechVolumeChanged;
+
+    return () => {
+      stopSpeechRecognizing();
+    };
+  }, []);
+
+  const getReply = async text => {
+    console.log('hit');
+    try {
+      const res = await sendToRasa({message: text, sender: USER._id});
+      console.log(res)
+      if(res.data.length>0){
+        setReply(res.data[0].text);    
+      Tts.getInitStatus().then(() => {
+        Tts.speak(res.data[0].text, {
+          androidParams: {
+            KEY_PARAM_PAN: -1,
+            KEY_PARAM_VOLUME: 0.5,
+            KEY_PARAM_STREAM: 'STREAM_MUSIC',
+          },
+        });
+      });
+    }else{
+      Tts.getInitStatus().then(() => {
+        Tts.speak("Cannot understand you", {
+          androidParams: {
+            KEY_PARAM_PAN: -1,
+            KEY_PARAM_VOLUME: 0.5,
+            KEY_PARAM_STREAM: 'STREAM_MUSIC',
+          },
+        });
+      });
+    }
+      Tts.addEventListener('tts-finish', (event) => startSpeechRecognizing());
+    } catch (err) {
+      ToastAndroid.show(err, ToastAndroid.LONG);
+    }
+  };
+  const startSpeechRecognizing = async () => {
+    setPitch('');
+    setError('');
+    setStarted(true);
+    // setReply('');
+    setResults([]);
+    setPartialResults([]);
+    setEnd(false);
+    try {
+      await Voice.start('en-US', {
+        EXTRA_SPEECH_INPUT_MINIMUM_LENGTH_MILLIS: 10000,
+      });
+    } catch (e) {
+      console.error(e);
+    }
+  };
+  const stopSpeechRecognizing = async () => {
+    try {
+      await Voice.stop();
+      setStarted(false);
+    } catch (e) {
+      console.error(e);
+    }
+  };
+  return (
+    <View style={styles.container}>
+    <ImageBackground style={styles.image} 
+      resizeMode='cover' 
+      source={require('../assets/images/voice_background.jpg')}
+      imageStyle={{opacity:0.25}}
+      >
+      <View style={styles.hBox1}>
+      <Text style={{fontFamily:FONT.SemiBold, fontSize:30,padding:5, backgroundColor:'white', borderRadius:50}}>Start the Conversation</Text>
+      </View>
+      <View style={styles.hBox2}>
+        {/* {partialResults.map((result, index) => {
+          return (
+            <Text key={`partial-result-${index}`} style={styles.message}>
+              {results}
+            </Text>
+          );
+        })} */}
+        <Text style={[styles.message, {color: COLOR.primary, padding:5, backgroundColor:'white', borderRadius:50}]}>{reply}</Text>
+      </View>
+      <View style={styles.hBox3}>
+      <Text style={styles.message}>Hi</Text>
+        <TouchableOpacity onPress={startSpeechRecognizing}>
+          <View style={{position: 'relative', alignItems:'center', paddingBottom:10}}>
+          
+            {started ? (
+              <Lottie
+                style={styles.checkAnimation}
+                source={require('../assets/lottie/mic_animation.json')}
+                autoPlay
+                resizeMode="cover"
+                loop={true}
+                speed={1}
+              />
+            ) : (
+              <View style={{borderRadius:140, width:'100%', backgroundColor: COLOR.primary}}>
+              <MaterialCommunityIcons
+                name="microphone"
+                color={COLOR.white}
+                size={90}
+              />
+              </View>
+                
+            )}
+          </View>
+        </TouchableOpacity>
+      </View>
+      </ImageBackground>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  checkAnimation: {
+    width: '95%',
+    height: '95%',
+    marginLeft: 7,
+    marginTop: 10,
+  },
+  container: {
+    flex: 1,
+    padding: 20,
+    backgroundColor:'white',
+    flexDirection: 'column',
+  },
+  hBox1: {
+    flex: 2,
+    alignItems:'center',
+    // backgroundColor: 'red',
+  },
+  hBox2: {
+    flex: 3,
+    // backgroundColor: 'darkorange',
+    justifyContent: 'center',
+    alignItems: 'center',
+    flexDirection: 'column',
+  },
+  hBox3: {
+    flex: 2,
+    // backgroundColor: 'green',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  message: {
+    fontFamily: FONT.SemiBold,
+    fontSize: 30,
+    color: 'black',
+  },
+  image:{
+    flex:1,
+    justifyContent:'center'
+  }
+});

src/themes/index.js

+export const COLOR = {
+    primary: '#12cdc2',
+    onPrimary: '#fff',
+    surface: '#fff',
+    onSurface: '#000',
+    backgroundOnBoard: 'white',
+    white:"white",
+    greyFont:'#2e2e2e'
+  };
+
+  export const FONT = {
+    Regular: "Poppins-Regular",
+    Bold: 'Poppins-Bold',
+    Light:'Poppins-Light',
+    Medium:'Poppins-Medium',
+    SemiBold:'Poppins-SemiBold'
+  }
\ No newline at end of file