Blu Design System

Getting Started

In order to use this library

1- Install dependency

yarn add blu-design-lib-ui

npm i blu-design-lib-ui

2- Install dependencies:

yarn add @react-native-firebase/analytics
yarn add @react-native-firebase/app
yarn add @react-native-firebase/remote-config
yarn add lottie-react-native
yarn add react-native-svg

3- Make native configuration for firebase, read here

3- Add your project to firebase settings: You should communicate with blu-design-lib-ui administrator and give him the app bundle and app id for ios and android.

4- Add GoogleService-Info.plist

This should be located in /ios/GoogleService-Info.plist folder and follow the docs

In case you already have a firebase app, you should change the name of the file to GoogleService-Info-bludesign.plist

Also you need to configure in ios/[Project]/AppDelegate.swift

 // Configure primary Firebase app
 FirebaseApp.configure()
 //New code below
 if let path = Bundle.main.path(
    forResource: "GoogleService-Info-bludesign",    ofType: "plist"),
let options = FirebaseOptions(contentsOfFile: path) {
     FirebaseApp.configure(
        name: "bludesign",
        options: options)
}

5- Add google-services.json

This should be located in /android/app/google-services.json folder and follow the docs

In case you already have a firebase app, you should change the name of the file to google-services-bludesign.json

Also you need to configure in android/app/src/main/java/com/[project]/MainApplication.kt

override fun onCreate() {
    super.onCreate()

    try {
      val options = FirebaseOptions.Builder()
        .setApplicationId("YOUR_SECONDARY_APP_ID")
        .setApiKey("YOUR_SECONDARY_API_KEY")
        .setProjectId("your-secondary-project")
        .build()
      FirebaseApp.initializeApp(this, options, "bludesign")
    } catch (e: Exception) {

    }

    loadReactNative(this)
  }

you could read more here

6- Add fonts to the project in react-native.config.js

module.exports = {
  assets: ['./node_modules/blu-design-lib-ui/lib/assets/fonts/'],
};

7- Run the command

npx react-native-asset

8- Build your app