ESB-245 - fetch root page dynamically instead of hardcoding 'homepage'

Dockerfile

@@ -5,7 +5,7 @@ LABEL name="Entando App Builder" \
       maintainer="dev@entando.com" \
       vendor="Entando Inc." \
       version="v${VERSION}" \
-      release="7.3.0" \
+      release="7.5.0" \
       summary="Entando App Builder" \
       description="The Entando App Builder is the front end environment to interact with the micro frontends, the WCMS, and other Entando components"
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@entando/app-builder",
-  "version": "7.3.0",
+  "version": "7.5.0",
   "author": "Entando",
   "homepage": "https://github.com/entando/app-builder",
   "license": "MIT",

src/api/pages.js

@@ -45,6 +45,13 @@ export const getPage = (pageCode, status = PAGE_STATUS_DRAFT) => makeRequest({
   ),
 });
 
+export const getRootPage = () => makeRequest({
+  uri: '/api/pages/utils/root',
+  method: METHODS.GET,
+  mockResponse: HOMEPAGE_PAYLOAD,
+  useAuthentication: true,
+});
+
 export const getPageSEO = pageCode => makeRequest({
   uri: `/api/plugins/seo/pages/${pageCode}`,
   method: METHODS.GET,
@@ -82,7 +89,7 @@ export const getPageChildren = pageCode => makeRequest({
 });
 
 export const getViewPages = () => makeRequest({
-  uri: '/api/pages/viewpages',
+  uri: '/api/pages/utils/viewpages',
   method: METHODS.GET,
   mockResponse: VIEWPAGES_PAYLOAD,
   contentType: 'application/json',
@@ -175,7 +182,7 @@ export const putPageStatus = (pageCode, status) => makeRequest({
 });
 
 export const getFreePages = () => makeRequest({
-  uri: '/api/pages/search/group/free',
+  uri: '/api/pages/utils/search/group/free',
   method: METHODS.GET,
   mockResponse: FREE_PAGES_PAYLOAD,
   useAuthentication: true,
@@ -199,7 +206,7 @@ export const putPageSettings = pageSettings => makeRequest({
 export const getSearchPages = (page = { page: 1, pageSize: 10 }, params = '') =>
   makeRequest(
     {
-      uri: `/api/pages/search${params}`,
+      uri: `/api/pages/utils/search${params}`,
       method: METHODS.GET,
       useAuthentication: true,
       mockResponse: SEARCH_PAGES,

src/state/pages/actions.js

@@ -4,7 +4,7 @@ import { addToast, addErrors, TOAST_SUCCESS, TOAST_ERROR } from '@entando/messag
 import { setPage } from 'state/pagination/actions';
 import {
   getPage, getPageChildren, setPagePosition, postPage, deletePage, getFreePages,
-  getPageSettings, putPage, putPageStatus, getViewPages, getSearchPages,
+  getPageSettings, putPage, putPageStatus, getViewPages, getSearchPages, getRootPage,
   putPageSettings, patchPage, getPageSEO, postPageSEO, putPageSEO, postClonePage,
 } from 'api/pages';
 import {
@@ -13,6 +13,7 @@ import {
   getChildrenMap,
   getSelectedPage,
   getAllPageTreeLoadedStatus,
+  getRootPageCode,
 } from 'state/pages/selectors';
 import { makeGetSelectedPageConfig } from 'state/page-config/selectors';
 import { setPublishedPageConfig } from 'state/page-config/actions';
@@ -21,9 +22,9 @@ import {
   MOVE_PAGE, SET_FREE_PAGES, SET_SELECTED_PAGE, REMOVE_PAGE, UPDATE_PAGE, SEARCH_PAGES,
   CLEAR_SEARCH, SET_REFERENCES_SELECTED_PAGE, CLEAR_TREE, BATCH_TOGGLE_EXPANDED, COLLAPSE_ALL,
   SET_DASHBOARD_PAGES,
-  SET_VIRTUAL_ROOT,
+  SET_VIRTUAL_ROOT, SET_ROOT_PAGE,
 } from 'state/pages/types';
-import { HOMEPAGE_CODE, PAGE_STATUS_DRAFT, PAGE_STATUS_PUBLISHED, PAGE_STATUS_UNPUBLISHED, SEO_ENABLED } from 'state/pages/const';
+import { PAGE_STATUS_DRAFT, PAGE_STATUS_PUBLISHED, PAGE_STATUS_UNPUBLISHED, SEO_ENABLED } from 'state/pages/const';
 import { history, ROUTE_PAGE_TREE, ROUTE_PAGE_CLONE, ROUTE_PAGE_ADD } from 'app-init/router';
 import { generateJsonPatch } from 'helpers/jsonPatch';
 import getSearchParam from 'helpers/getSearchParam';
@@ -176,6 +177,11 @@ export const setVirtualRoot = virtualRoot => ({
   payload: virtualRoot,
 });
 
+export const setRootPage = rootPageCode => ({
+  type: SET_ROOT_PAGE,
+  payload: rootPageCode,
+});
+
 const wrapApiCall = apiFunc => (...args) => async (dispatch) => {
   const response = await apiFunc(...args);
   const json = await response.json();
@@ -198,6 +204,22 @@ export const fetchIfPageExists = pageCode => new Promise((resolve) => {
   getPage(pageCode).then(response => resolve(response.ok)).catch(() => resolve(false));
 });
 
+let rootPageFetched = false;
+
+export const fetchRootPage = () => async (dispatch) => {
+  if (rootPageFetched) return;
+  try {
+    const response = await getRootPage();
+    const json = await response.json();
+    if (response.ok) {
+      dispatch(setRootPage(json.payload.code));
+      rootPageFetched = true;
+    }
+  } catch (e) {
+    // falls back to 'homepage' default in reducer
+  }
+};
+
 
 export const fetchViewPages = () => dispatch => new Promise((resolve) => {
   getViewPages().then((response) => {
@@ -240,8 +262,9 @@ export const sendDeletePage = (page, successRedirect = true) => async (dispatch)
   }
 };
 
-export const fetchPageTree = pageCode => async (dispatch) => {
-  if (pageCode === HOMEPAGE_CODE) {
+export const fetchPageTree = pageCode => async (dispatch, getState) => {
+  const rootPageCode = getRootPageCode(getState());
+  if (pageCode === rootPageCode) {
     const responses = await Promise.all([
       fetchPage(pageCode)(dispatch),
       fetchPageChildren(pageCode)(dispatch),
@@ -256,29 +279,30 @@ export const fetchPageTree = pageCode => async (dispatch) => {
 };
 
 
-export const handleExpandPage = (pageCode = HOMEPAGE_CODE, alwaysExpand) => (
+export const handleExpandPage = (pageCode, alwaysExpand) => (
   (dispatch, getState) => {
     const state = getState();
-    const pageStatus = getStatusMap(state)[pageCode];
+    const effectivePageCode = pageCode || getRootPageCode(state);
+    const pageStatus = getStatusMap(state)[effectivePageCode];
     const toExpand = (!pageStatus || !pageStatus.expanded);
     const toLoad = (toExpand && (!pageStatus || pageStatus.expanded === undefined));
     if (toLoad) {
-      dispatch(setPageLoading(pageCode));
-      return fetchPageTree(pageCode)(dispatch)
+      dispatch(setPageLoading(effectivePageCode));
+      return fetchPageTree(effectivePageCode)(dispatch, getState)
         .then((pages) => {
           dispatch(addPages(pages));
-          dispatch(setPageExpanded(pageCode, true));
-          dispatch(setPageLoaded(pageCode));
+          dispatch(setPageExpanded(effectivePageCode, true));
+          dispatch(setPageLoaded(effectivePageCode));
           if (
-            pageCode === APP_TOUR_HOMEPAGE_CODEREF &&
+            effectivePageCode === APP_TOUR_HOMEPAGE_CODEREF &&
             getAppTourProgress(state) !== APP_TOUR_CANCELLED
           ) {
             dispatch(setExistingPages(pages));
           }
         }).catch(() => {});
     }
     dispatch(setPageExpanded(
-      pageCode,
+      effectivePageCode,
       alwaysExpand !== undefined ? alwaysExpand : toExpand,
     ));
     return noopPromise();
@@ -320,7 +344,7 @@ const movePage = (pageCode, siblingCode, moveAbove) => (dispatch, getState) => {
   const siblingPage = getPagesMap(state)[siblingCode];
   const page = getPagesMap(state)[pageCode];
   const oldParentCode = page.parentCode;
-  const newParentCode = siblingPage.parentCode || HOMEPAGE_CODE;
+  const newParentCode = siblingPage.parentCode || getRootPageCode(state);
   const newSiblingChildren = getChildrenMap(state)[newParentCode]
     .filter(code => code !== pageCode);
   const newSiblingIndex = newSiblingChildren.indexOf(siblingCode);
@@ -564,8 +588,8 @@ export const fetchPageForm = pageCode => (dispatch, getState) => fetchPageInfo(p
   })
   .catch(() => {});
 
-export const loadSelectedPage = pageCode => dispatch =>
-  fetchPage(pageCode || getSearchParam('parentCode') || HOMEPAGE_CODE)(dispatch)
+export const loadSelectedPage = pageCode => (dispatch, getState) =>
+  fetchPage(pageCode || getSearchParam('parentCode') || getRootPageCode(getState()))(dispatch)
     .then((response) => {
       dispatch(setSelectedPage(response.payload));
       return response.payload;

src/state/pages/reducer.js

@@ -19,6 +19,7 @@ import {
   COLLAPSE_ALL,
   SET_DASHBOARD_PAGES,
   SET_VIRTUAL_ROOT,
+  SET_ROOT_PAGE,
 } from 'state/pages/types';
 
 // creates a map from an array
@@ -294,6 +295,14 @@ export const virtualRoot = (state = false, action = {}) => {
   }
 };
 
+export const rootPage = (state = 'homepage', action = {}) => {
+  switch (action.type) {
+    case SET_ROOT_PAGE:
+      return action.payload;
+    default: return state;
+  }
+};
+
 export default combineReducers({
   map: reducer,
   childrenMap,
@@ -305,4 +314,5 @@ export default combineReducers({
   search,
   dashboard,
   virtualRoot,
+  rootPage,
 });

src/state/pages/selectors.js

@@ -1,7 +1,7 @@
 import { createSelector } from 'reselect';
 
 import { getLocale } from 'state/locale/selectors';
-import { HOMEPAGE_CODE, PAGE_STATUS_PUBLISHED } from 'state/pages/const';
+import { PAGE_STATUS_PUBLISHED } from 'state/pages/const';
 import { getDomain } from '@entando/apimanager';
 import { PREVIEW_NAMESPACE } from 'ui/pages/config/const';
 import { get } from 'lodash';
@@ -17,6 +17,7 @@ export const getSelectedPage = state => state.pages.selected;
 export const getSearchPagesRaw = state => state.pages.search;
 export const getDashboardPages = state => state.pages.dashboard;
 export const getIsVirtualRootOn = state => state.pages.virtualRoot;
+export const getRootPageCode = state => state.pages.rootPage;
 
 export const getSearchPages = createSelector(
   [getSearchPagesRaw],
@@ -41,8 +42,8 @@ export const getFreePages = createSelector(
 
 
 // relies on the children map order
-const getPagesOrder = (pagesChildren) => {
-  const fifo = [HOMEPAGE_CODE];
+const getPagesOrder = (pagesChildren, rootPageCode) => {
+  const fifo = [rootPageCode];
   const sorted = [];
   while (fifo.length) {
     const curPageCode = fifo.pop();
@@ -56,10 +57,10 @@ const getPagesOrder = (pagesChildren) => {
   return sorted;
 };
 
-const isVisible = (pageCode, pages, pagesStatus) => {
+const isVisible = (pageCode, pages, pagesStatus, rootPageCode) => {
   let curPageCode = pageCode;
   if (pages[curPageCode]) {
-    while (curPageCode !== HOMEPAGE_CODE) {
+    while (curPageCode !== rootPageCode) {
       if (pages[curPageCode].parentCode) {
         curPageCode = pages[curPageCode].parentCode;
         if (pagesStatus[curPageCode] && !pagesStatus[curPageCode].expanded) {
@@ -72,11 +73,11 @@ const isVisible = (pageCode, pages, pagesStatus) => {
   return false;
 };
 
-const getDepth = (pages, pageCode) => {
+const getDepth = (pages, pageCode, rootPageCode) => {
   let curPageCode = pageCode;
   let depth = 0;
   if (pages[curPageCode]) {
-    while (curPageCode !== HOMEPAGE_CODE) {
+    while (curPageCode !== rootPageCode) {
       curPageCode = pages[curPageCode].parentCode;
       depth += 1;
     }
@@ -86,14 +87,14 @@ const getDepth = (pages, pageCode) => {
 
 // calculates the position map based on children map
 export const getPositionMap = createSelector(
-  [getChildrenMap],
-  childrenMap => Object.keys(childrenMap).reduce((acc, pageCode) => {
+  [getChildrenMap, getRootPageCode],
+  (childrenMap, rootPageCode) => Object.keys(childrenMap).reduce((acc, pageCode) => {
     const children = childrenMap[pageCode];
     children.forEach((childCode, i) => {
       acc[childCode] = i + 1;
     });
     return acc;
-  }, { homepage: 1 }),
+  }, { [rootPageCode]: 1 }),
 );
 
 
@@ -105,10 +106,13 @@ const PAGE_STATUS_DEFAULTS = {
 
 export const getPageTreePages = createSelector(
   [getPagesMap, getChildrenMap, getStatusMap, getTitlesMap, getLocale, getDefaultLanguage,
-    getIsVirtualRootOn],
-  (pages, pageChildren, pagesStatus, pagesTitles, locale, defaultLang, virtualRootOn) => (
-    getPagesOrder(pageChildren)
-      .filter(pageCode => isVisible(pageCode, pages, pagesStatus))
+    getIsVirtualRootOn, getRootPageCode],
+  (
+    pages, pageChildren, pagesStatus, pagesTitles, locale,
+    defaultLang, virtualRootOn, rootPageCode,
+  ) => (
+    getPagesOrder(pageChildren, rootPageCode)
+      .filter(pageCode => isVisible(pageCode, pages, pagesStatus, rootPageCode))
       .map((pageCode) => {
         const isEmpty = !(pageChildren[pageCode] && pageChildren[pageCode].length);
         let hasPublishedChildren = false;
@@ -125,15 +129,15 @@ export const getPageTreePages = createSelector(
             Object.keys(pagesTitles[pageCode]).find(langCode => pagesTitles[pageCode][langCode])
           ];
 
-        if (pageCode === HOMEPAGE_CODE && virtualRootOn) {
+        if (pageCode === rootPageCode && virtualRootOn) {
           title = 'Root';
         }
 
         return ({
           ...pages[pageCode],
           ...PAGE_STATUS_DEFAULTS,
           ...pagesStatus[pageCode],
-          depth: getDepth(pages, pageCode),
+          depth: getDepth(pages, pageCode, rootPageCode),
           isEmpty,
           hasPublishedChildren,
           parentStatus,

src/state/pages/types.js

@@ -17,3 +17,4 @@ export const COLLAPSE_ALL = 'pages/collapse-all-pages';
 export const SET_VIEWPAGES = 'pages/set-viewpages';
 export const SET_DASHBOARD_PAGES = 'pages/set-dashboard-pages';
 export const SET_VIRTUAL_ROOT = 'pages/set-virtual-root';
+export const SET_ROOT_PAGE = 'pages/set-root-page';

src/ui/app/MfeContainer.js

@@ -8,6 +8,7 @@ import { getLocale } from 'state/locale/selectors';
 import { getLoggedUserPermissions } from 'state/permissions/selectors';
 import { getDomain } from 'helpers/resourcePath';
 import { getSystemReport } from 'state/system/selectors';
+import { getRootPageCode } from 'state/pages/selectors';
 import { useDynamicResourceUrl } from 'hooks/useDynamicResourceUrl';
 import { selectCurrSystemConfigAdvancedSearch } from 'state/current-system-configuration/selectors';
 import { getUserPreferences } from 'state/user-preferences/selectors';
@@ -20,6 +21,7 @@ const MfeContainer = ({ id, history }) => {
   const currentSystemConfigurationAdvancedSearchOn =
   useSelector(selectCurrSystemConfigAdvancedSearch);
   const userPreferences = useSelector(getUserPreferences) || {};
+  const rootPageCode = useSelector(getRootPageCode);
 
   const mfeResourceBasePath = useDynamicResourceUrl(mfe.assetsBasePath);
 
@@ -35,6 +37,7 @@ const MfeContainer = ({ id, history }) => {
       systemReport,
       advancedSearchOn: currentSystemConfigurationAdvancedSearchOn,
       disableContentMenu: userPreferences.disableContentMenu,
+      rootPageCode,
     };
 
     if (JSON.stringify(entandoWindow.globals || {}) !== JSON.stringify(globals)) {
@@ -48,7 +51,7 @@ const MfeContainer = ({ id, history }) => {
     window.entando = entandoWindow;
   }, [history, locale, mfe.assetsBasePath, mfe.widgetName, permissions, systemReport,
     mfeResourceBasePath, currentSystemConfigurationAdvancedSearchOn,
-    userPreferences.disableContentMenu]);
+    userPreferences.disableContentMenu, rootPageCode]);
 
   const params = {
     config: {