Discourage inline project data

[khattakdev]

The project inline data approach leads to TypeScript errors:

From @SergeyMaltsev

we recommend to not use that approach with project inline data, but use Pro
component and pass its ref to the BryntumSchedulerPro
Using project inside config may also result in some problems for sharing project between multiple products
So best is use separate component for storing project and pass its ref where you want it

The docs such as calendars and Project Inline Data uses inline approach. Should be updated

Reference Demo: https://bryntum.com/products/schedulerpro/examples/frameworks/react-vite/inline-data/dist/

[SergeyMaltsev]

resourcesData, assignmendsData and other are legacy properties, which should not be used.

For the moment this is a valid approach:

Declare projectProps

import { BryntumSchedulerProProjectModelProps } from '@bryntum/schedulerpro-react-thin';

export const projectProps: BryntumSchedulerProProjectModelProps = {

    resources : [
        { id : 1, name : 'Linda' },
        { id : 2, name : 'Olivia' }
    ],

    dependencies : [
        { fromEvent : 1, toEvent : 2 }
    ],

    assignments : [
        { 'event' : 1, 'resource' : 1 },
        { 'event' : 2, 'resource' : 2 }
    ],

    events : [
        { id : 1, name : 'Proof-read docs', startDate : '2022-01-01T10:00', endDate : '2022-01-02T13:00' },
        { id : 2, name : 'Release docs', startDate : '2022-01-09T15:00', endDate : '2022-01-10T16:00' }
    ],
}

Use a separate project component and pass a reference to Scheduler

import { FunctionComponent, useRef } from 'react';
import { BryntumSchedulerPro, BryntumSchedulerProProjectModel } from '@bryntum/schedulerpro-react-thin';
import { projectProps, schedulerproProps } from './SchedulerProConfig';
import './App.scss';

const App: FunctionComponent = () => {
    const projectRef = useRef<BryntumSchedulerProProjectModel>(null);
    const schedulerProRef = useRef<BryntumSchedulerPro>(null);

    return <>
        <BryntumSchedulerProProjectModel
            ref={projectRef}
            {...projectProps}
        />
        <BryntumSchedulerPro
            ref={schedulerProRef}
            project={projectRef}
            {...schedulerproProps}
        />
    </>;
};

export default App;