Skip to main content

provide-data

Description​

Provides new data for a branch

You should call this action to provide data for a branch.

Usage​

"provide-data": ({
  id: string | number,
  data: {
   tasks?: ITask[],
   links?: ILInk[],
   assignments?: IAssignment[]
  };
}) => boolean|void;

Parameters​

  • id - (required) the ID of the task for which data should be provided
  • data - (required) new data provided for a branch:
    • tasks - (optional) array of child tasks
    • links - (optional) array of links belonging to the branch
    • assignments - (optional) array of assignments for child tasks; merged into the existing assignments collection. Only takes effect when Gantt has been initialised with an assignments array (PRO Edition).
info

For handling the actions you can use the Event Bus methods

Example​

In the example below we listen to the request-data action with the help of the api.on() method, fetch the tasks branch data from the server and parse to the component calling the provide-data action.

import { useState, useEffect } from "react";
import { Gantt } from "@svar-ui/react-gantt";

const server = "https://some-server";

export default function App() {
  const [tasks, setTasks] = useState([]);
  const [links, setLinks] = useState([]);

  useEffect(() => {
    Promise.all([
      fetch(server + "/tasks").then(res => res.json()),
      fetch(server + "/links").then(res => res.json()),
    ]).then(([t, l]) => {
      setTasks(t);
      setLinks(l);
    });
  }, []);

  function init(api) {
    api.on("request-data", ev => {
      Promise.all([
        fetch(`${server}/tasks/${ev.id}`).then(res => res.json()),
        fetch(`${server}/links/${ev.id}`).then(res => res.json()),
      ]).then(([tasks, links]) => {
        api.exec("provide-data", {
          id: ev.id,
          data: {
            tasks,
            links,
          },
        });
      });
    });
  }

  return <Gantt init={init} tasks={tasks} links={links} />;
}

When the project uses resources, forward the matching assignments alongside the tasks and links so that resource columns and resource-load reflect the newly loaded branch:

api.on("request-data", ev => {
   restProvider
      .getData(ev.id, { assignments: true })
      .then(({ tasks, links, assignments }) => {
         api.exec("provide-data", {
            id: ev.id,
            data: { tasks, links, assignments },
         });
      });
});

Related articles: