EN · DE · RU · FR · ES

#2718: CalendarFilterSettings.jsx

projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx React component, projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx 453 lines · 431 code · 4 comments · 18 blank
Purpose: React webapp: CalendarFilterSettings.jsx. CalendarFilterSettings.jsx is part of the ProjectForge open-source project management application.

Source (first 100 lines)

import { faChevronDown, faCog, faEllipsis } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import PropTypes from 'prop-types';
import React, { useContext, useEffect, useState } from 'react';
import {
    Button,
    Col,
    Container,
    DropdownItem, DropdownMenu,
    DropdownToggle,
    Modal,
    ModalBody,
    ModalHeader, Navbar, NavLink,
    Row, UncontrolledDropdown,
    UncontrolledTooltip,
} from 'reactstrap';
import ObjectSelect from '../../../components/design/input/autoCompletion/ObjectSelect';
import CheckBox from '../../../components/design/input/CheckBox';
import style from '../../../components/design/input/Input.module.scss';
import ReactSelect from '../../../components/design/react-select/ReactSelect';
import { fetchJsonGet, fetchJsonPost, getServiceURL } from '../../../utilities/rest';
import prefix from '../../../utilities/prefix';
import { CalendarContext } from '../../page/calendar/CalendarContext';
import { Nav } from '../../../components/design';
import history from '../../../utilities/history';

/**
 * Settings of a calendar view: time sheet user, default calendar for new events, show holidays etc.
 */
function CalendarFilterSettings({
    onTimesheetUserChange,
    onShowBreaksChange,
    onDefaultCalendarChange,
    onGridSizeChange,
    onFirstHourChange,
    onVacationGroupsChange,
    onVacationUsersChange,
    refresh,
    defaultCalendarId,
    timesheetUser,
    otherTimesheetUsersEnabled,
    showBreaks,
    gridSize = '30',
    firstHour = '08',
    listOfDefaultCalendars,
    translations,
    vacationGroups = [],
    vacationUsers = [],
}) {
    // Modal dialog with calendars, vacations and other option such first hour of day etc.
    const [open, setOpen] = useState(false);

    const [defaultCalendar, setDefaultCalendar] = useState();

    useEffect(() => {
        setDefaultCalendar(listOfDefaultCalendars.find((it) => it.id === defaultCalendarId));
    }, [listOfDefaultCalendars, defaultCalendarId]);

    const { saveUpdateResponseInState } = useContext(CalendarContext);

    const loadVacationGroupsOptions = (search, callback) => {
        fetchJsonGet(
            'group/autosearch',
            { search },
            callback,
        );
    };

    const loadVacationUsersOptions = (search, callback) => {
        fetchJsonGet(
            'vacation/users',
            { search },
            callback,
        );
    };

    const handleTimesheetsCheckBoxChange = (event) => {
        const user = { id: event.target.checked ? 1 : -1 };
        fetchJsonGet(
            'calendar/changeTimesheetUser',
            { userId: user.id },
            (json) => {
                onTimesheetUserChange(user);
                saveUpdateResponseInState(json);
            },
        );
    };

    const handleShowBreaksChange = (event) => {
        const { checked } = event.target;
        fetchJsonGet(
            'calendar/changeShowBreaks',
            { showBreaks },
            (json) => {
                onShowBreaksChange(checked);
                saveUpdateResponseInState(json);
            },
        );
    };

Git History

8253835c0 Fix dependency conflicts and modernize SCSS: resolve npm install ERESOLVE errors
3490f27f1 fix calendar and timesheet page
3685edd6c lift to react 18 wip
2fbd0908f PFDay: hashCode, equals.
dcfc7c1a9 Old calendar moved to sub menu, ScriptingTask*, JiraUtils

8253835c0

Fix dependency conflicts and modernize SCSS: resolve npm install ERESOLVE errors
8253835c08967a626ea844cb72c79faae736efb1
diff --git a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
index 8bb0fa0f3..11e5241b6 100644
--- a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
+++ b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
@@ -1,5 +1,5 @@
 import { faChevronDown, faCog, faEllipsis } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome/index';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import PropTypes from 'prop-types';
 import React, { useContext, useEffect, useState } from 'react';
 import {

3490f27f1

fix calendar and timesheet page
3490f27f105c220263fa22ff716d907beb75c5a5
diff --git a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
index a54ce8226..8bb0fa0f3 100644
--- a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
+++ b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
@@ -236,7 +236,7 @@ function CalendarFilterSettings({
                                 {translations.more}
                             </UncontrolledTooltip>
                         </DropdownToggle>
-                        <DropdownMenu right>
+                        <DropdownMenu end>
                             <DropdownItem
                                 key="entry-item-calendar-settings"
                             >

3685edd6c

lift to react 18 wip
3685edd6c9f0dfd4582dbeb01c05491c254ccb84
diff --git a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
index e058696eb..a54ce8226 100644
--- a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
+++ b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
@@ -40,12 +40,12 @@ function CalendarFilterSettings({
     timesheetUser,
     otherTimesheetUsersEnabled,
     showBreaks,
-    gridSize,
-    firstHour,
+    gridSize = '30',
+    firstHour = '08',
     listOfDefaultCalendars,
     translations,
-    vacationGroups,
-    vacationUsers,
+    vacationGroups = [],
+    vacationUsers = [],
 }) {
     // Modal dialog with calendars, vacations and other option such first hour of day etc.
     const [open, setOpen] = useState(false);
@@ -450,15 +450,4 @@ CalendarFilterSettings.propTypes = {
     })),
 };
 
-CalendarFilterSettings.defaultProps = {
-    defaultCalendarId: undefined,
-    timesheetUser: undefined,
-    otherTimesheetUsersEnabled: undefined,
-    showBreaks: undefined,
-    gridSize: '30',
-    firstHour: '08',
-    vacationGroups: [],
-    vacationUsers: [],
-};
-
 export default (CalendarFilterSettings);

2fbd0908f

PFDay: hashCode, equals.
2fbd0908fa18e6f1d68366e2d370ad5c21b9eca1
diff --git a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
index 4cf5b7458..e058696eb 100644
--- a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
+++ b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
@@ -275,20 +275,6 @@ function CalendarFilterSettings({
                                     {translations['plugins.teamcal.calendar.listAndIcsExport.tooltip']}
                                 </UncontrolledTooltip>
                             </DropdownItem>
-                            <DropdownItem
-                                key="entry-item-old-calendar"
-                            >
-                                <NavLink
-                                    id="oldCalendar"
-                                    href="/wa/teamCalendar"
-                                    rel="noopener noreferrer"
-                                >
-                                    {translations['calendar.view.oldVersion'] || '[old version]'}
-                                </NavLink>
-                                <UncontrolledTooltip placement="left" target="oldCalendar">
-                                    {translations['calendar.view.oldVersion.tooltip']}
-                                </UncontrolledTooltip>
-                            </DropdownItem>
                         </DropdownMenu>
                     </UncontrolledDropdown>
                 </Nav>

dcfc7c1a9

Old calendar moved to sub menu, ScriptingTask*, JiraUtils
dcfc7c1a9688ba47b2f53e91270dd97e00f6a030
diff --git a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
index 4b4af08e6..4cf5b7458 100644
--- a/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
+++ b/projectforge-webapp/src/containers/panel/calendar/CalendarFilterSettings.jsx
@@ -275,6 +275,20 @@ function CalendarFilterSettings({
                                     {translations['plugins.teamcal.calendar.listAndIcsExport.tooltip']}
                                 </UncontrolledTooltip>
                             </DropdownItem>
+                            <DropdownItem
+                                key="entry-item-old-calendar"
+                            >
+                                <NavLink
+                                    id="oldCalendar"
+                                    href="/wa/teamCalendar"
+                                    rel="noopener noreferrer"
+                                >
+                                    {translations['calendar.view.oldVersion'] || '[old version]'}
+                                </NavLink>
+                                <UncontrolledTooltip placement="left" target="oldCalendar">
+                                    {translations['calendar.view.oldVersion.tooltip']}
+                                </UncontrolledTooltip>
+                            </DropdownItem>
                         </DropdownMenu>
                     </UncontrolledDropdown>
                 </Nav>
@@ -428,6 +442,8 @@ CalendarFilterSettings.propTypes = {
         'calendar.filter.vacation.groups.tooltip': PropTypes.string,
         'calendar.filter.vacation.users': PropTypes.string,
         'calendar.filter.vacation.users.tooltip': PropTypes.string,
+        'calendar.view.oldVersion': PropTypes.string,
+        'calendar.view.oldVersion.tooltip': PropTypes.string,
         'calendar.option.firstHour': PropTypes.string,
         'calendar.option.firstHour.tooltip': PropTypes.string,
         'calendar.option.gridSize': PropTypes.string,