Feature/add only necessary default boards on login

src/components/Account/Login/Login.actions.js

@@ -1,6 +1,10 @@
 import API from '../../../api';
 import { LOGIN_SUCCESS, LOGOUT } from './Login.constants';
-import { addBoards } from '../../Board/Board.actions';
+import {
+  addBoards,
+  cleanAllBoards,
+  addNecessaryDefaultBoardsFor
+} from '../../Board/Board.actions';
 import {
   changeVoice,
   changePitch,
@@ -15,6 +19,7 @@ import {
 } from '../../App/App.actions';
 import { getVoiceURI } from '../../../i18n';
 import { isCordova, isElectron } from '../../../cordova-util';
+import { isRemoteIdChecker } from '../../../helpers';
 
 export function loginSuccess(payload) {
   return dispatch => {
@@ -166,14 +171,23 @@ export function login({ email, password, activatedData }, type = 'local') {
           .map(async id => {
             let board = null;
             try {
-              board = await API.getBoard(id);
+              if (isRemoteIdChecker(id)) board = await API.getBoard(id);
             } catch (e) {}
             return board;
           })
           .filter(b => b !== null)
       );
-
+      dispatch(cleanAllBoards());
       dispatch(addBoards(apiBoards));
+      const userDefaultBoardsIncluded =
+        currentCommunicator.defaultBoardsIncluded;
+      if (userDefaultBoardsIncluded) {
+        userDefaultBoardsIncluded.forEach(({ homeBoard }) => {
+          dispatch(addNecessaryDefaultBoardsFor(homeBoard));
+        });
+      } else {
+        dispatch(addNecessaryDefaultBoardsFor(currentCommunicator.rootBoard));
+      }
       if (type === 'local') {
         dispatch(
           disableTour({

src/components/Board/Board.actions.js

@@ -38,7 +38,8 @@ import {
   DOWNLOAD_IMAGES_FAILURE,
   DOWNLOAD_IMAGES_STARTED,
   DOWNLOAD_IMAGE_SUCCESS,
-  DOWNLOAD_IMAGE_FAILURE
+  DOWNLOAD_IMAGE_FAILURE,
+  CLEAN_ALL_BOARDS
 } from './Board.constants';
 
 import API from '../../api';
@@ -54,7 +55,7 @@ import {
   verifyAndUpsertCommunicator
 } from '../Communicator/Communicator.actions';
 import { isAndroid, writeCvaFile } from '../../cordova-util';
-import { DEFAULT_BOARDS } from '../../helpers';
+import { ALL_DEFAULT_BOARDS, DEFAULT_BOARDS } from '../../helpers';
 import history from './../../history';
 import { improvePhraseAbortController } from '../../api/api';
 
@@ -151,6 +152,7 @@ export function changeDefaultBoard(selectedBoardNameOnJson) {
 
     const switchActiveBoard = homeBoardId => {
       if (homeBoardId) {
+        dispatch(addNecessaryDefaultBoardsFor(homeBoardId));
         const goTo = `/board/${homeBoardId}`;
 
         dispatch(switchBoard(homeBoardId));
@@ -498,6 +500,10 @@ export function getApiMyBoards() {
     })
       .then(res => {
         dispatch(getApiMyBoardsSuccess(res));
+        const newBoards = res.data;
+        newBoards?.forEach(({ id }) => {
+          dispatch(addNecessaryDefaultBoardsFor(id));
+        });
         return res;
       })
       .catch(err => {
@@ -821,3 +827,59 @@ export function updateApiObjects(
       });
   };
 }
+
+export function cleanAllBoards() {
+  return {
+    type: CLEAN_ALL_BOARDS
+  };
+}
+
+export function addNecessaryDefaultBoardsFor(boardIdToAdd) {
+  return (dispatch, getState) => {
+    const checkedBoardsIds = [];
+    const addNecessaryBoards = ({ dispatch, getState, necessaryBoardId }) => {
+      const board = getState().board.boards.find(
+        board => board?.id === necessaryBoardId
+      );
+      const checkLoadBoards = board => {
+        checkedBoardsIds.push(board.id);
+        board.tiles.forEach(tile => {
+          if (
+            tile.loadBoard
+            // !getState().board.boards.some(board => board.id === tile.loadBoard)
+          ) {
+            if (!checkedBoardsIds.includes(tile.loadBoard)) {
+              addNecessaryBoards({
+                dispatch,
+                getState,
+                necessaryBoardId: tile.loadBoard
+              });
+            }
+          }
+        });
+      };
+      if (board) {
+        checkLoadBoards(board);
+        return;
+      }
+
+      ALL_DEFAULT_BOARDS.some(defaultBoard => {
+        if (defaultBoard.id === necessaryBoardId) {
+          dispatch(addBoards([defaultBoard]));
+          checkLoadBoards(defaultBoard);
+          return true;
+        }
+        return false;
+      });
+    };
+    try {
+      addNecessaryBoards({
+        dispatch,
+        getState,
+        necessaryBoardId: boardIdToAdd
+      });
+    } catch (e) {
+      console.error(e);
+    }
+  };
+}

src/components/Board/Board.constants.js

@@ -19,6 +19,7 @@ export const CHANGE_IMPROVED_PHRASE = 'cboard/Board/CHANGE_IMPROVED_PHRASE';
 export const CHANGE_LIVE_MODE = 'cboard/Board/CHANGE_LIVE_MODE';
 export const HISTORY_REMOVE_BOARD = 'cboard/Board/HISTORY_REMOVE_BOARD';
 export const UNMARK_BOARD = 'cboard/Board/UNMARK_BOARD';
+export const CLEAN_ALL_BOARDS = 'cboard/Board/CLEAN_ALL_BOARDS';
 export const CREATE_API_BOARD_SUCCESS = 'cboard/Board/CREATE_API_BOARD_SUCCESS';
 export const CREATE_API_BOARD_FAILURE = 'cboard/Board/CREATE_API_BOARD_FAILURE';
 export const CREATE_API_BOARD_STARTED = 'cboard/Board/CREATE_API_BOARD_STARTED';

src/components/Board/Board.container.js

@@ -47,7 +47,8 @@ import {
   downloadImages,
   createApiBoard,
   upsertApiBoard,
-  changeDefaultBoard
+  changeDefaultBoard,
+  addNecessaryDefaultBoardsFor
 } from './Board.actions';
 import {
   addBoardCommunicator,
@@ -70,6 +71,7 @@ import {
   IS_BROWSING_FROM_APPLE_TOUCH,
   IS_BROWSING_FROM_SAFARI
 } from '../../constants';
+import { ALL_DEFAULT_BOARDS, isRemoteIdChecker } from '../../helpers';
 //import { isAndroid } from '../../cordova-util';
 
 const ogv = require('ogv');
@@ -220,7 +222,8 @@ export class BoardContainer extends Component {
       changeBoard,
       userData,
       history,
-      getApiObjects
+      getApiObjects,
+      addNecessaryDefaultBoardsFor
       //downloadImages
     } = this.props;
 
@@ -273,9 +276,14 @@ export class BoardContainer extends Component {
 
     if (!boardExists) {
       // try the root board
-      boardExists = boards.find(b => b.id === communicator.rootBoard);
+      const homeBoard = communicator.rootBoard;
+      if (ALL_DEFAULT_BOARDS.map(({ id }) => id).includes(homeBoard))
+        addNecessaryDefaultBoardsFor(homeBoard);
+      boardExists = boards.find(b => b.id === homeBoard);
       if (!boardExists) {
-        boardExists = boards.find(b => b.id !== '');
+        if (isRemoteIdChecker(homeBoard))
+          boardExists = this.tryRemoteBoard(homeBoard);
+        if (!boardExists) boardExists = boards.find(b => b.id !== '');
       }
     }
     const boardId = boardExists.id;
@@ -868,8 +876,22 @@ export class BoardContainer extends Component {
     };
 
     if (tile.loadBoard) {
+      const loadBoardFinder = loadBoardSearched => {
+        const findBoardOnStore = boardId =>
+          this.props.boards.find(b => b.id === boardId);
+
+        const nextBoard = findBoardOnStore(loadBoardSearched);
+        if (nextBoard) return nextBoard;
+        if (
+          ALL_DEFAULT_BOARDS.map(({ id }) => id).includes(loadBoardSearched)
+        ) {
+          addNecessaryDefaultBoardsFor(loadBoardSearched);
+          const nextBoard = findBoardOnStore(loadBoardFinder);
+          if (nextBoard) return nextBoard;
+        }
+      };
       const nextBoard =
-        boards.find(b => b.id === tile.loadBoard) ||
+        loadBoardFinder(tile.loadBoard) ||
         // If the board id is invalid, try falling back to a board
         // with the right name.
         boards.find(b => b.name === tile.label);
@@ -1736,7 +1758,8 @@ const mapDispatchToProps = {
   createApiBoard,
   upsertApiBoard,
   changeDefaultBoard,
-  verifyAndUpsertCommunicator
+  verifyAndUpsertCommunicator,
+  addNecessaryDefaultBoardsFor
 };
 
 export default connect(

src/components/Board/Board.reducer.js

@@ -36,7 +36,8 @@ import {
   GET_API_MY_BOARDS_STARTED,
   DOWNLOAD_IMAGES_STARTED,
   DOWNLOAD_IMAGE_SUCCESS,
-  DOWNLOAD_IMAGE_FAILURE
+  DOWNLOAD_IMAGE_FAILURE,
+  CLEAN_ALL_BOARDS
 } from './Board.constants';
 import { LOGOUT, LOGIN_SUCCESS } from '../Account/Login/Login.constants';
 
@@ -50,7 +51,8 @@ const initialState = {
   images: [],
   isFixed: false,
   isLiveMode: false,
-  improvedPhrase: ''
+  improvedPhrase: '',
+  unnecesaryDefaultBoardsRemoved: false
 };
 
 function reconcileBoards(localBoard, remoteBoard) {
@@ -249,7 +251,12 @@ function boardReducer(state = initialState, action) {
           board => action.boardId.indexOf(board.id) === -1
         )
       };
-
+    case CLEAN_ALL_BOARDS:
+      return {
+        ...state,
+        boards: [],
+        unnecesaryDefaultBoardsRemoved: true
+      };
     case CREATE_TILE:
       return {
         ...state,

src/components/Board/__tests__/Board.reducer.test.js

@@ -53,7 +53,8 @@ const initialState = {
   isFixed: false,
   images: [],
   isLiveMode: false,
-  improvedPhrase: ''
+  improvedPhrase: '',
+  unnecesaryDefaultBoardsRemoved: false
 };
 
 describe('reducer', () => {

src/helpers.js

@@ -5,6 +5,16 @@ export const DEFAULT_BOARDS = {
   advanced: boards.advanced,
   picSeePal: picSeePal
 };
+let advancedCopy = JSON.parse(JSON.stringify(DEFAULT_BOARDS.advanced));
+let picSeePalCopy = JSON.parse(JSON.stringify(DEFAULT_BOARDS.picSeePal));
+
+export const ALL_DEFAULT_BOARDS = [...advancedCopy, ...picSeePalCopy];
+
+export const SHORT_ID_MAX_LENGTH = 14;
+
+export const isRemoteIdChecker = id => {
+  return !(id.length < SHORT_ID_MAX_LENGTH);
+};
 
 export const dataURLtoFile = (dataurl, filename, checkExtension = false) => {
   // https://stackoverflow.com/a/38936042