EN · DE · RU · FR · ES
← Index · ← File index · ← Prev · Next → · 📄 source

#2610: index.jsx

projectforge-webapp/src/components/base/dynamicLayout/index.jsx React component, projectforge-webapp/src/components/base/dynamicLayout/index.jsx 137 lines · 117 code · 9 comments · 11 blank
Purpose: React webapp: index.jsx. index.jsx is part of the ProjectForge open-source project management application.

Source (first 100 lines)

import PropTypes from 'prop-types';
import React from 'react';
import { buttonPropType, menuItemPropType } from '../../../utilities/propTypes';
import DynamicActionGroup from './action/DynamicActionGroup';
import renderLayout from './components/DynamicRenderer';
import {
    defaultValues as dynamicLayoutContextDefaultValues,
    DynamicLayoutContext,
} from './context';
import history from '../../../utilities/history';
import DynamicPageMenu from './DynamicPageMenu';
import { Button } from '../../design';

function DynamicLayout(
    {
        children,
        ui,
        callAction = dynamicLayoutContextDefaultValues.callAction,
        data = {},
        options = dynamicLayoutContextDefaultValues.options,
        setData = dynamicLayoutContextDefaultValues.setData,
        setVariables = dynamicLayoutContextDefaultValues.setVariables,
        validationErrors = [],
        variables = {},
        ...props
    },
) {
    // Destructure the 'ui' prop.
    const {
        actions,
        layout,
        layoutBelowActions,
        title,
        pageMenu,
        historyBackButton,
    } = ui;

    const {
        disableLayoutRendering,
        displayPageMenu,
        setBrowserTitle,
        showActionButtons,
    } = options;

    const [previousTitle, setPreviousTitle] = React.useState(document.title);

    // Set the document title when a title for the page is specified and the option
    // setBrowserTitle is true.
    React.useEffect(() => {
        if (setBrowserTitle && title) {
            setPreviousTitle(document.title);
            document.title = `ProjectForge - ${title}`;

            return () => {
                document.title = previousTitle;
            };
        }

        return () => undefined;
    }, [setBrowserTitle, title]);

    // Render PageMenu if the option displayPageMenu is true.
    const menu = React.useMemo(() => (
        displayPageMenu && <DynamicPageMenu menu={pageMenu} title={title} />
    ), [displayPageMenu, pageMenu, title]);

    // Render ActionGroup if actions were found in the ui object.
    const actionGroup = React.useMemo(() => (
        actions && showActionButtons && <DynamicActionGroup actions={actions} />
    ), [actions, showActionButtons]);

    return (
        <DynamicLayoutContext.Provider
            /* eslint-disable-next-line react/jsx-no-constructed-context-values */
            value={{
                ...dynamicLayoutContextDefaultValues,
                ui,
                options,
                renderLayout,
                callAction,
                data,
                setData,
                setVariables,
                validationErrors,
                variables,
                ...props,
            }}
        >
            {menu}
            {children}
            {!disableLayoutRendering && renderLayout(layout)}
            {actionGroup}
            {!disableLayoutRendering && renderLayout(layoutBelowActions)}
            {historyBackButton
            && (
                <Button
                    onClick={history.goBack}
                >
                    <span id="back">{historyBackButton}</span>
                </Button>

Git History

3685edd6c lift to react 18 wip
1e8b61f8e Migration stuff in progress... dynamicLayout.layoutBelowActions (below action buttons in edit pages).
41bd5b6a8 Changes of npm-updates-2 restored.
d2d755876 Merge branch 'npm-updates-2' of github.com:micromata/projectforge into develop
033629f77 fix typescript eslint bugs

3685edd6c

lift to react 18 wip
3685edd6c9f0dfd4582dbeb01c05491c254ccb84
diff --git a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
index f6c1b3a6e..639813b94 100644
--- a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
+++ b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
@@ -15,7 +15,13 @@ function DynamicLayout(
     {
         children,
         ui,
-        options,
+        callAction = dynamicLayoutContextDefaultValues.callAction,
+        data = {},
+        options = dynamicLayoutContextDefaultValues.options,
+        setData = dynamicLayoutContextDefaultValues.setData,
+        setVariables = dynamicLayoutContextDefaultValues.setVariables,
+        validationErrors = [],
+        variables = {},
         ...props
     },
 ) {
@@ -71,6 +77,12 @@ function DynamicLayout(
                 ui,
                 options,
                 renderLayout,
+                callAction,
+                data,
+                setData,
+                setVariables,
+                validationErrors,
+                variables,
                 ...props,
             }}
         >
@@ -122,15 +134,4 @@ DynamicLayout.propTypes = {
     variables: PropTypes.shape({}),
 };
 
-DynamicLayout.defaultProps = {
-    callAction: dynamicLayoutContextDefaultValues.callAction,
-    children: undefined,
-    data: {},
-    options: dynamicLayoutContextDefaultValues.options,
-    setData: dynamicLayoutContextDefaultValues.setData,
-    setVariables: dynamicLayoutContextDefaultValues.setVariables,
-    validationErrors: [],
-    variables: {},
-};
-
 export default DynamicLayout;

1e8b61f8e

Migration stuff in progress... dynamicLayout.layoutBelowActions (below action buttons in edit pages).
1e8b61f8ee2af14cc3cf3c1ac5831acc0f10f763
diff --git a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
index 8fc6de9a7..f6c1b3a6e 100644
--- a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
+++ b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
@@ -23,6 +23,7 @@ function DynamicLayout(
     const {
         actions,
         layout,
+        layoutBelowActions,
         title,
         pageMenu,
         historyBackButton,
@@ -77,6 +78,7 @@ function DynamicLayout(
             {children}
             {!disableLayoutRendering && renderLayout(layout)}
             {actionGroup}
+            {!disableLayoutRendering && renderLayout(layoutBelowActions)}
             {historyBackButton
             && (
                 <Button
@@ -94,6 +96,7 @@ DynamicLayout.propTypes = {
     ui: PropTypes.shape({
         actions: PropTypes.arrayOf(buttonPropType),
         layout: PropTypes.instanceOf(Array),
+        layoutBelowActions: PropTypes.instanceOf(Array),
         title: PropTypes.string,
         pageMenu: PropTypes.arrayOf(menuItemPropType),
         historyBackButton: PropTypes.string,

41bd5b6a8

Changes of npm-updates-2 restored.
41bd5b6a8fab788ef726e4c8b22d3946bb6f7b22
diff --git a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
index ee7c12b91..8fc6de9a7 100644
--- a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
+++ b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
@@ -62,14 +62,6 @@ function DynamicLayout(
         actions && showActionButtons && <DynamicActionGroup actions={actions} />
     ), [actions, showActionButtons]);
 
-    const dynamicLayoutContextValue = React.useMemo(() => ({
-        ...dynamicLayoutContextDefaultValues,
-        ui,
-        options,
-        renderLayout,
-        ...props,
-    }), [ui, options, renderLayout, props]);
-
     return (
         <DynamicLayoutContext.Provider
             /* eslint-disable-next-line react/jsx-no-constructed-context-values */

d2d755876

Merge branch 'npm-updates-2' of github.com:micromata/projectforge into develop
033629f77
fix typescript eslint bugs
033629f77d479c13decda21b11734d8e97a658cd
diff --git a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
index 003619862..8fc6de9a7 100644
--- a/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
+++ b/projectforge-webapp/src/components/base/dynamicLayout/index.jsx
@@ -49,8 +49,7 @@ function DynamicLayout(
             };
         }
 
-        return () => {
-        };
+        return () => undefined;
     }, [setBrowserTitle, title]);
 
     // Render PageMenu if the option displayPageMenu is true.