Event Timeline - Resources

const event = [
  { resource: 'work' /** other properties */ },
  { resource: 'holidays' /** other properties */ },
];

const resources = [
  { name: 'Work', id: 'work' },
  { name: 'Holidays', id: 'holidays' },
];

<EventTimelinePremium events={events} resources={resources} />;

const resources = [
  {
    id: 'engineering',
    title: 'Engineering',
    children: [
      {
        id: 'frontend',
        title: 'Frontend',
        children: [
          { id: 'web-app', title: 'Web App' },
          { id: 'mobile-app', title: 'Mobile App' },
        ],
      },
    ],
  },
];

const resource = {
  // ...other properties
  areEventsDraggable: false,
};

const resource = {
  // ...other properties
  areEventsResizable: false,
  areEventsResizable: "start" // only the start edge is draggable.
  areEventsResizable: "end" // only the end edge is draggable.
};

const resource = {
  // ...other properties
  areEventsReadOnly: true,
};

const resourceModelStructure = {
  title: {
    getter: (resource) => resource.name,
  },
};

function Timeline() {
  return (
    <EventTimelinePremium
      resources={[{ name: 'Resource 1' /** ... */ }]}
      resourceModelStructure={resourceModelStructure}
    />
  );
}