Add resource #423

TeaBough · 2017-06-02T10:49:13Z

I've created this PR, that serve the same purpose as #373. The difference is that the logic of the resource is done directly in the TimeGrid instead of creating a ResourceGrid which DRY things up and allow to enjoy resource in the week view as well.

jquense · 2017-06-19T16:02:03Z

🎉 thanks for picking this up!

jquense

Mind posting some screens as well to get an idea of it? We'll probably have to tweak the styles for when tehre are lots of resources to allow horizontal scrolling

jquense · 2017-06-19T16:02:43Z

src/TimeGrid.js

@@ -174,10 +176,14 @@ export default class TimeGrid extends Component {

    let gutterRef = ref => this._gutters[1] = ref && findDOMNode(ref);

+    let eventsRendered = resources ?


resources && resources.length ?

jquense · 2017-06-19T16:03:31Z

src/TimeGrid.js

+      return resources.map((resource, id) => {
+
+        let eventsToDisplay = daysEvents.filter(
+            event => event.resourceId === resource.id


Like the events I don't want to be prescriptive about the shape of the data in resources so can we add accessor props for these fields like we do with startAccessor, et al?

jquense · 2017-06-19T16:04:27Z

src/TimeGrid.js


        </div>
      </div>
    );
  }
+  renderEventsWithResource(range, events, today, resources) {


can this method be joined with renderEvents I'd be worried the common code will diverge unintentionally

XVincentX · 2017-09-21T11:59:20Z

@TeaBough Is this still happening?

TeaBough · 2017-09-21T12:02:00Z

I couldn't work on it during the french summer. But I think I can work on this this weekend !

XVincentX · 2017-09-21T13:16:00Z

I think this feature would be a significant game changer here 👍

TeaBough · 2017-09-23T11:06:50Z

@XVincentX @jquense I've finally updated this PR

jquense · 2017-09-23T12:26:38Z

Awesome thanks! I'll try and review asap

jquense · 2017-10-02T15:06:19Z

looks great! Can you rebase? The one concern i see here is that with a few resources the rendering hangs for a few seconds as you switch to the tab. I'm not sure what it is that is causing it, it may just be the number of divs being rendered as the grid since I see the same thing with or without any events.

TeaBough · 2017-10-02T16:53:31Z

I've rebased

rvignesh89 · 2017-10-21T11:48:09Z

This is great! Exactly what I've been looking for. @jquense any chance that this will be added soon?

arthurmmedeiros · 2017-11-08T01:18:28Z

Hey guys,
When is this feature going to be added to the master?

ksloan · 2017-11-12T02:22:38Z

Any updates?

samlll42-github · 2017-11-15T02:49:02Z

Looking forward to this as well. Happy to help moving this along if it requires some testing or updates....

jquense · 2017-11-15T04:38:34Z

If anyone wants to help, the last remaining thing is the performance concerns I noted in my comment. If anyone wants to take a crack at optimizing/testing that a bit

vongdarakia · 2017-11-17T08:57:17Z

There's a slight performance issue, but it's a not a big deal for me. It's still way faster than other calendars out there. They often do an HTTP request (page refresh). I'd really like to see this feature out though. It'd be very helpful! Thanks for all the hard work @jquense and @TeaBough!

frehner

React.PropTypes won't work in React16, and the rest of this file just uses PropTypes

frehner · 2017-11-28T18:02:12Z

src/DayColumn.js

@@ -64,6 +64,7 @@ class DayColumn extends React.Component {
    dayWrapperComponent: elementType,
    eventComponent: elementType,
    eventWrapperComponent: elementType.isRequired,
+    resource: React.PropTypes.string


Need to remove React. here: just PropTypes.string

frehner · 2017-11-28T18:17:36Z

Here's a screenshot looking at the Chrome Dev Tool's performance tab when the resource example is created in Storybook.

I'm no expert, but it appears that there isn't anything new per se that this PR introduces that reduces performance, it's just the fact that you're now rendering N number of DayColumns (one per resource). I may be wrong, but if performance is a worry here then we'll either have to figure out a different way to do resources, or go into Day/Time Column components and optimize there.

Thoughts?

jquense · 2017-11-28T18:51:36Z

yeah it may just be the extra columns now. The issue is that it's gonna worse and worse the more resources you have. One solution may be to do something completely different layout wise, like full calendar: https://fullcalendar.io/scheduler/ something a bit more amenable to simpler layout.

another option is to maybe try and virtualize the TimeColumns so it's not rendering extra divs. We can also jsut try and reduce the amount of DOM elements rendered in the first place

frehner · 2017-11-28T22:21:54Z

I'm currently looking at a way of possibly just having one DayColumn component and just using styling to put the events into different columns... does that seem like a reasonable solution?

jquense · 2017-11-28T22:48:46Z

I'm up for whatever works and isnt too hacky :P

frehner · 2017-11-28T23:55:02Z

On second thought, changing the CSS works well when it comes to displaying the events, but would require more work when you consider creating events. Hmm. I'm not really sure what the best way to go about doing this is then, other than what has already been done here.

Perhaps just looking at optimizing TimeColumns to make them not so heavy...

XVincentX · 2018-01-03T11:37:25Z

Will this find its way in the master somehow? @TeaBough

TeaBough · 2018-01-03T13:31:18Z

@XVincentX I've rebased with master and removed React. from React.PropTypes. I don't know what else I can do to make this PR ready to merge...

jquense · 2018-01-03T13:32:33Z

if we can make CI green i'm ok merging for now. We really need to address the performance issues though

TeaBough · 2018-01-03T13:42:13Z

@jquense done

marwej · 2018-01-24T21:23:32Z

Any thoughts on when next version (including this) will be released? (Many thanks for a great package!)

f2net · 2018-07-27T09:07:21Z

Could you please add the new "resources" API in the documentation?
I'm looking at the source to understand it, but it would be great to have it documented.

Thank you,
Matteo

atul-vzn · 2021-05-26T21:59:41Z

Does anyone have a working example?

Thank you
Atul

justoverclockl · 2023-07-01T06:04:55Z

Could you please add the new "resources" API in the documentation? I'm looking at the source to understand it, but it would be great to have it documented.

Thank you, Matteo

any chance to know if this is implemented in 1.8.1? with a sort of documentation? thx!

TeaBough mentioned this pull request Jun 2, 2017

Add Resource view #373

Closed

3 tasks

TeaBough force-pushed the add_resource branch from 85918f2 to 46a3634 Compare June 2, 2017 16:31

jquense requested changes Jun 19, 2017

View reviewed changes

jquense mentioned this pull request Jul 26, 2017

Changing header for various views? #483

Closed

TeaBough force-pushed the add_resource branch from 46a3634 to 081a4ef Compare September 23, 2017 11:05

TeaBough force-pushed the add_resource branch 2 times, most recently from 15c3b68 to 7396dee Compare October 2, 2017 16:52

TeaBough force-pushed the add_resource branch from 7396dee to eaa5b93 Compare October 27, 2017 08:09

frehner mentioned this pull request Nov 28, 2017

Migrated to storybook3 with the necessary webpack config changes #628

Merged

frehner suggested changes Nov 28, 2017

View reviewed changes

TeaBough force-pushed the add_resource branch 2 times, most recently from 5ce0c96 to 02181b1 Compare January 3, 2018 13:28

Add resource

3aa2a33

TeaBough force-pushed the add_resource branch from 02181b1 to 3aa2a33 Compare January 3, 2018 13:40

jquense merged commit 0c0b17c into jquense:master Jan 3, 2018

tobiasandersen mentioned this pull request Jan 22, 2018

Multiple users in day view? #699

Closed

tobiasandersen mentioned this pull request Feb 6, 2018

Vertical Resource View #469

Closed

mikeyc7m mentioned this pull request Apr 23, 2018

Issue with all day events when using Resources #727

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add resource #423

Add resource #423

TeaBough commented Jun 2, 2017 •

edited

Loading

jquense commented Jun 19, 2017

jquense left a comment

jquense Jun 19, 2017

jquense Jun 19, 2017

jquense Jun 19, 2017

XVincentX commented Sep 21, 2017

TeaBough commented Sep 21, 2017

XVincentX commented Sep 21, 2017

TeaBough commented Sep 23, 2017

jquense commented Sep 23, 2017

jquense commented Oct 2, 2017

TeaBough commented Oct 2, 2017

rvignesh89 commented Oct 21, 2017

arthurmmedeiros commented Nov 8, 2017

ksloan commented Nov 12, 2017

samlll42-github commented Nov 15, 2017

jquense commented Nov 15, 2017

vongdarakia commented Nov 17, 2017 •

edited

Loading

frehner left a comment •

edited

Loading

frehner Nov 28, 2017

frehner commented Nov 28, 2017 •

edited

Loading

jquense commented Nov 28, 2017

frehner commented Nov 28, 2017

jquense commented Nov 28, 2017

frehner commented Nov 28, 2017 •

edited

Loading

XVincentX commented Jan 3, 2018

TeaBough commented Jan 3, 2018

jquense commented Jan 3, 2018

TeaBough commented Jan 3, 2018

marwej commented Jan 24, 2018

f2net commented Jul 27, 2018

atul-vzn commented May 26, 2021

justoverclockl commented Jul 1, 2023

		@@ -174,10 +176,14 @@ export default class TimeGrid extends Component {

		let gutterRef = ref => this._gutters[1] = ref && findDOMNode(ref);

		let eventsRendered = resources ?

Add resource #423

Add resource #423

Conversation

TeaBough commented Jun 2, 2017 • edited Loading

jquense commented Jun 19, 2017

jquense left a comment

Choose a reason for hiding this comment

jquense Jun 19, 2017

Choose a reason for hiding this comment

jquense Jun 19, 2017

Choose a reason for hiding this comment

jquense Jun 19, 2017

Choose a reason for hiding this comment

XVincentX commented Sep 21, 2017

TeaBough commented Sep 21, 2017

XVincentX commented Sep 21, 2017

TeaBough commented Sep 23, 2017

jquense commented Sep 23, 2017

jquense commented Oct 2, 2017

TeaBough commented Oct 2, 2017

rvignesh89 commented Oct 21, 2017

arthurmmedeiros commented Nov 8, 2017

ksloan commented Nov 12, 2017

samlll42-github commented Nov 15, 2017

jquense commented Nov 15, 2017

vongdarakia commented Nov 17, 2017 • edited Loading

frehner left a comment • edited Loading

Choose a reason for hiding this comment

frehner Nov 28, 2017

Choose a reason for hiding this comment

frehner commented Nov 28, 2017 • edited Loading

jquense commented Nov 28, 2017

frehner commented Nov 28, 2017

jquense commented Nov 28, 2017

frehner commented Nov 28, 2017 • edited Loading

XVincentX commented Jan 3, 2018

TeaBough commented Jan 3, 2018

jquense commented Jan 3, 2018

TeaBough commented Jan 3, 2018

marwej commented Jan 24, 2018

f2net commented Jul 27, 2018

atul-vzn commented May 26, 2021

justoverclockl commented Jul 1, 2023

TeaBough commented Jun 2, 2017 •

edited

Loading

vongdarakia commented Nov 17, 2017 •

edited

Loading

frehner left a comment •

edited

Loading

frehner commented Nov 28, 2017 •

edited

Loading

frehner commented Nov 28, 2017 •

edited

Loading