feat(app-auth): add retrieval of auth status on startup

commitlint.config.js

@@ -1,6 +1,7 @@
 const apps = ["all", "app", "functions", "firestore", "database"]
 const scopes = [
     "config",
+    "auth",
     "login",
     "signup",
     "dashboard",

packages/game-app/src/_shared/auth/index.ts

@@ -0,0 +1,4 @@
+import { reducer, actions, name } from "./slice";
+import saga from "./saga";
+
+export { reducer, actions, name, saga };

packages/game-app/src/_shared/auth/saga.ts

@@ -0,0 +1,28 @@
+import { call, put, takeEvery } from "redux-saga/effects";
+import { actions, User } from "./slice";
+import firebase from "firebase/app";
+import "firebase/auth";
+
+function getCurrentUser(): Promise<User | null> {
+  return new Promise<User | null>((resolve) => {
+    firebase.auth().onAuthStateChanged((user) => {
+      if (user) {
+        resolve({
+          id: user.uid,
+          email: user.email!,
+        });
+      } else {
+        resolve(null);
+      }
+    });
+  });
+}
+
+function* initializeAuthSaga() {
+  const user: User | null = yield call(getCurrentUser);
+  yield put(actions.setLoggedUser(user));
+}
+
+export default function* authSaga() {
+  yield takeEvery(actions.initialize, initializeAuthSaga);
+}

packages/game-app/src/_shared/auth/slice.ts

@@ -0,0 +1,49 @@
+import { createSelector, createSlice, PayloadAction } from "@reduxjs/toolkit";
+
+export interface User {
+  id: string;
+  email: string;
+}
+
+export interface State {
+  isInitialized: boolean;
+  loggedUser: User | null;
+}
+
+const initialState = {
+  isInitialized: false,
+  loggedUser: null,
+} as State;
+
+const slice = createSlice({
+  name: "auth",
+  initialState: initialState,
+  reducers: {
+    setLoggedUser(state, action: PayloadAction<User | null>) {
+      state.isInitialized = true;
+      state.loggedUser = action.payload;
+    },
+    initialize(state, action: PayloadAction<undefined>) {
+      state.isInitialized = false;
+      state.loggedUser = null;
+    },
+  },
+});
+
+const getCurrentUser = createSelector(
+  (state: { [name]: State }) => state[name],
+  (authState) => authState.loggedUser
+);
+
+const isInitialized = createSelector(
+  (state: { [name]: State }) => state[name],
+  (authState) => authState.isInitialized
+);
+
+export const reducer = slice.reducer;
+export const actions = slice.actions;
+export const name = slice.name;
+export const selectors = {
+  getCurrentUser,
+  isInitialized,
+};

packages/game-app/src/_shared/index.ts

@@ -1,14 +1,11 @@
-import {buildStore} from "./store";
-import firebase from "firebase";
+import { buildStore } from "./store";
 import CONFIG from "@pipeline/app-config";
-import 'firebase/analytics';
-import 'firebase/auth';
-import 'firebase/firestore';
-import 'firebase/database';
-import { initializeI18n } from './i18n/index';
+import firebase from "firebase/app";
+import "firebase/analytics";
+import { initializeI18n } from "./i18n";
+import { actions as authActions } from "./auth";
 
 export function bootstrap() {
-
   initializeI18n();
 
   firebase.initializeApp({
@@ -25,10 +22,7 @@ export function bootstrap() {
 
   const store = buildStore();
 
-  store.dispatch({type: 'test'});
-  // For sage test
-  store.dispatch({type: 'ping'});
+  store.dispatch(authActions.initialize());
 
   return store;
-
 }

packages/game-app/src/_shared/store/reducers.ts

@@ -1,7 +1,9 @@
-import {name as i18nName, reducer as i18nReducer} from '@pipeline/i18n';
+import { name as i18nName, reducer as i18nReducer } from "@pipeline/i18n";
+import { name as authName, reducer as authReducer } from "@pipeline/auth";
 
 const reducers = {
-  [i18nName]: i18nReducer
+  [i18nName]: i18nReducer,
+  [authName]: authReducer,
 };
 
 export default reducers;

packages/game-app/src/_shared/store/rootSaga.ts

@@ -1,21 +1,11 @@
-import {Saga} from 'redux-saga';
-import {all, call, put, spawn, takeEvery} from 'redux-saga/effects'
-
-function* testSaga() {
-  yield put({type: 'pong'});
-}
-
-function * testSagaRunner(){
-  yield takeEvery('ping', testSaga);
-}
+import { Saga } from "redux-saga";
+import { all, call, spawn } from "redux-saga/effects";
+import { saga as authSaga } from "@pipeline/auth";
 
 export default function* rootSaga() {
-  const sagas: Saga[] = [
-    testSagaRunner
-  ];
-
+  const sagas: Saga[] = [authSaga];
   yield all(
-    sagas.map(saga =>
+    sagas.map((saga) =>
       spawn(function* () {
         while (true) {
           try {
@@ -25,7 +15,7 @@ export default function* rootSaga() {
             console.log(e);
           }
         }
-      }),
-    ),
+      })
+    )
   );
 }

packages/game-app/tsconfig.paths.json

@@ -5,7 +5,8 @@
       "@assets/*": ["src/assets/*"],
       "@pipeline/app-config": ["src/_shared/config"],      
       "@pipeline/i18n": ["src/_shared/i18n"],
-      "@pipeline/routing": ["src/_shared/routing"]
+      "@pipeline/routing": ["src/_shared/routing"],
+      "@pipeline/auth": ["src/_shared/auth"]
     }
   }
 }