WMS-851 | RemoteConfig (#22)

* Add RemoteConfig helpers

* Fix format

* Rename remoteConfig to firebase and improve readme

* Remove extra line

* Main README entry

* Fix format issues

* Bump version to 1.1.0

README.md

@@ -47,6 +47,11 @@ In order to integrate this package into your project there are some extra change
 - Install the [Auth0 SPA SDK](https://github.com/auth0/auth0-spa-js)
 - If your application isn't using `Effect` yet you can use `Auth.performEffects` to convert them on the fly. Otherwise, it's recommended to use `Effects.MainHelper`
 
+### Firebase
+
+- Install the [Firebase JavaScript SDK](https://firebase.google.com/docs/web/setup)
+- Initialize firebase with your Firebase project configuration
+
 ### Rollbar
 
 - Make sure your model includes `appConfig.environment`. `codeVersion`, `rollbarToken` and `url`;

firebase/README.md

@@ -0,0 +1,33 @@
+# Paack's Firebase Elm Library
+
+## Remote Config
+
+Remote Config is a parameter storage that is used by some apps to toggle features and make visual changes without needing to deploy updates.
+
+The suggested use is to send the parameters using ports and store them into `AppConfig`.
+
+Example usage:
+
+```ts
+import firebase from 'firebase/app';
+import { getConfigValue } from '@PaackEng/frontend-elm-kit/firebase/remoteConfig';
+
+async function sendConfigs(elmApp, firebaseAppConfig) {
+  const firebaseApp = firebase.initializeApp(firebaseAppConfig);
+  const remoteConfig = firebaseApp.remoteConfig();
+
+  await remoteConfig.fetchAndActivate();
+
+  // read "exampleConfig" parameter as a json object
+  const exampleConfig = await getConfigValue(
+    remoteConfig,
+    'exampleConfig',
+    'object',
+  );
+
+  elmApp.ports.fromHostToElm.send({
+    tag: 'RemoteConfig',
+    data: { exampleConfig },
+  });
+}
+```

firebase/remoteConfig.ts

@@ -0,0 +1,22 @@
+import { RemoteConfig, Type, Value } from './types';
+
+export async function getConfigValue(
+  remoteConfig: RemoteConfig,
+  key: string,
+  type: Type,
+): Promise<Value> {
+  const remoteValue = remoteConfig.getValue(key);
+
+  switch (type) {
+    case 'string':
+      return remoteValue.asString();
+    case 'number':
+      return remoteValue.asNumber();
+    case 'boolean':
+      return remoteValue.asBoolean();
+    case 'object':
+      return JSON.parse(remoteValue.asString());
+    default:
+      return null;
+  }
+}

firebase/types.ts

@@ -0,0 +1,7 @@
+import firebase from 'firebase';
+
+export type RemoteConfig = firebase.remoteConfig.RemoteConfig;
+
+export type Type = 'string' | 'number' | 'boolean' | 'object';
+
+export type Value = string | number | boolean | null;

package.json

@@ -1,13 +1,14 @@
 {
   "name": "@PaackEng/frontend-elm-kit",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "",
   "main": "",
   "private": false,
   "files": [
     "elm",
     "prettier",
     "auth0",
+    "firebase",
     "eslintconfig.json",
     "tsconfig.json"
   ],
@@ -35,7 +36,8 @@
     "@types/elm": "^0.19.0"
   },
   "peerDependencies": {
-    "elm": "^0.19.1-5"
+    "elm": "^0.19.1-5",
+    "firebase": "^8.6.3"
   },
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^4.24.0",