feat: implement Conditional Resource Grouping (#2679)

Co-authored-by: CarteiraTech <[email protected]> Co-authored-by: Duong Duc Anh <[email protected]> Answers long standing request for alternative resource grouping
jquense · Nov 21, 2024 · d52f836 · d52f836
1 parent 9f082fb
commit d52f836
Show file tree

Hide file tree

Showing 9 changed files with 651 additions and 129 deletions.
diff --git a/src/Calendar.js b/src/Calendar.js
@@ -1,28 +1,28 @@
+import clsx from 'clsx'
 import PropTypes from 'prop-types'
 import React from 'react'
 import { uncontrollable } from 'uncontrollable'
-import clsx from 'clsx'
 import {
   accessor,
+  views as componentViews,
   dateFormat,
   dateRangeFormat,
   DayLayoutAlgorithmPropType,
-  views as componentViews,
 } from './utils/propTypes'
 
-import { notify } from './utils/helpers'
-import { navigate, views } from './utils/constants'
 import { mergeWithDefaults } from './localizer'
+import NoopWrapper from './NoopWrapper'
+import Toolbar from './Toolbar'
+import { navigate, views } from './utils/constants'
+import { notify } from './utils/helpers'
 import message from './utils/messages'
 import moveDate from './utils/move'
 import VIEWS from './Views'
-import Toolbar from './Toolbar'
-import NoopWrapper from './NoopWrapper'
 
-import omit from 'lodash/omit'
 import defaults from 'lodash/defaults'
-import transform from 'lodash/transform'
 import mapValues from 'lodash/mapValues'
+import omit from 'lodash/omit'
+import transform from 'lodash/transform'
 import { wrapAccessor } from './utils/accessors'
 
 function viewNames(_views) {
@@ -632,6 +632,13 @@ class Calendar extends React.Component {
      */
     enableAutoScroll: PropTypes.bool,
 
+    /**
+     * Determines the layout of resource groups in the calendar.
+     * When `true`, resources will be grouped by date in the week view.
+     * When `false`, resources will be grouped by week.
+     */
+    resourceGroupingLayout: PropTypes.bool,
+
     /**
      * Specify a specific culture code for the Calendar.
      *
@@ -1008,6 +1015,7 @@ class Calendar extends React.Component {
       toolbar,
       events,
       backgroundEvents,
+      resourceGroupingLayout,
       style,
       className,
       elementProps,
@@ -1071,6 +1079,7 @@ class Calendar extends React.Component {
           onSelectSlot={this.handleSelectSlot}
           onShowMore={onShowMore}
           doShowMoreDrillDown={doShowMoreDrillDown}
+          resourceGroupingLayout={resourceGroupingLayout}
         />
       </div>
     )