WEBAPP: Возможность установки произвольного заголовка приложения из панели

app/app.js

@@ -86,6 +86,9 @@ const Workspace = ({ panels = [], selectedPanel, children } = {}) => {
     //Подключение к контексту навигации
     const { navigateRoot, navigatePanel } = useContext(NavigationCtx);
 
+    //Подключение к контексту приложения
+    const { appState } = useContext(ApplicationСtx);
+
     //Отработка действия навигации домой
     const handleHomeNavigate = () => navigateRoot();
 
@@ -98,6 +101,7 @@ const Workspace = ({ panels = [], selectedPanel, children } = {}) => {
             {...P8P_APP_WORKSPACE_CONFIG_PROPS}
             panels={panels}
             selectedPanel={selectedPanel}
+            caption={appState.appBarTitle}
             onHomeNavigate={handleHomeNavigate}
             onItemNavigate={handleItemNavigate}
         >

app/components/p8p_app_workspace.js

@@ -47,7 +47,7 @@ const STYLES = {
 //-----------
 
 //Рабочее пространство
-const P8PAppWorkspace = ({ children, panels = [], selectedPanel, closeCaption, homeCaption, onHomeNavigate, onItemNavigate } = {}) => {
+const P8PAppWorkspace = ({ children, panels = [], selectedPanel, caption, closeCaption, homeCaption, onHomeNavigate, onItemNavigate } = {}) => {
     //Собственное состояния
     const [open, setOpen] = useState(false);
 
@@ -86,7 +86,7 @@ const P8PAppWorkspace = ({ children, panels = [], selectedPanel, closeCaption, h
                         <Icon>{open ? "chevron_left" : "menu"}</Icon>
                     </IconButton>
                     <Typography variant="h6" noWrap component="div">
-                        {selectedPanel?.caption}
+                        {caption || selectedPanel?.caption}
                     </Typography>
                 </Toolbar>
             </AppBar>
@@ -120,6 +120,7 @@ P8PAppWorkspace.propTypes = {
     children: PropTypes.element,
     panels: PropTypes.arrayOf(P8P_PANELS_MENU_PANEL_SHAPE).isRequired,
     selectedPanel: P8P_PANELS_MENU_PANEL_SHAPE,
+    caption: PropTypes.string,
     closeCaption: PropTypes.string.isRequired,
     homeCaption: PropTypes.string.isRequired,
     onHomeNavigate: PropTypes.func,

app/context/application.js

@@ -56,6 +56,9 @@ export const ApplicationContext = ({ errors, displaySizeGetter, guidGenerator, c
     //Установка списка панелей
     const setPanels = panels => dispatch({ type: APP_AT.LOAD_PANELS, payload: panels });
 
+    //Установка заголовка в шапке приложения
+    const setAppBarTitle = appBarTitle => dispatch({ type: APP_AT.SET_APP_BAR_TITLE, payload: appBarTitle });
+
     //Поиск раздела по имени
     const findPanelByName = name => state.panels.find(panel => panel.name == name);
 
@@ -169,6 +172,7 @@ export const ApplicationContext = ({ errors, displaySizeGetter, guidGenerator, c
     return (
         <ApplicationСtx.Provider
             value={{
+                setAppBarTitle,
                 findPanelByName,
                 pOnlineShowTab,
                 pOnlineShowUnit,

app/context/application_reducer.js

@@ -12,12 +12,14 @@ const APP_AT = {
     SET_URL_BASE: "SET_URL_BASE", //Установка базового URL приложения
     LOAD_PANELS: "LOAD_PANELS", //Загрузка списка панелей
     SET_INITIALIZED: "SET_INITIALIZED", //Установка флага инициализированности приложения
-    SET_DISPLAY_SIZE: "SET_DISPLAY_SIZE" //Установка текущего типового размера экрана
+    SET_DISPLAY_SIZE: "SET_DISPLAY_SIZE", //Установка текущего типового размера экрана
+    SET_APP_BAR_TITLE: "SET_APP_BAR_TITLE" //Установка заголовка в шапке приложения
 };
 
 //Состояние приложения по умолчанию
 const INITIAL_STATE = displaySizeGetter => ({
     displaySize: displaySizeGetter(),
+    appBarTitle: "",
     urlBase: "",
     panels: [],
     panelsLoaded: false,
@@ -46,6 +48,8 @@ const handlers = {
     [APP_AT.SET_INITIALIZED]: state => ({ ...state, initialized: true }),
     //Установка текущего типового размера экрана
     [APP_AT.SET_DISPLAY_SIZE]: (state, { payload }) => ({ ...state, displaySize: payload }),
+    //Установка заголовка в шапке приложения
+    [APP_AT.SET_APP_BAR_TITLE]: (state, { payload }) => ({ ...state, appBarTitle: payload }),
     //Обработчик по умолчанию
     DEFAULT: state => state
 };

app/context/navigation.js

@@ -41,7 +41,7 @@ export const NavigationContext = ({ children }) => {
     const navigate = useNavigate();
 
     //Подключение к контексту приложения
-    const { findPanelByName } = useContext(ApplicationСtx);
+    const { findPanelByName, setAppBarTitle } = useContext(ApplicationСtx);
 
     //Проверка наличия параметров запроса
     const isNavigationSearch = () => (location.search ? true : false);
@@ -65,6 +65,8 @@ export const NavigationContext = ({ children }) => {
     const navigateTo = ({ path, search, state, replace = false }) => {
         //Если указано куда переходить
         if (path) {
+            //Сброс кастомного заголовка
+            setAppBarTitle("");
             //Переходим к адресу
             if (state) navigate(path, { state: JSON.stringify(state), replace });
             else navigate({ pathname: path, search: queryString.stringify(search), replace });