Skip to content

Commit 6cf45d5

Browse files
committed
Updated react scheduler sample to latest version.
1 parent 49c4711 commit 6cf45d5

13 files changed

+56
-28474
lines changed

package-lock.json

-28,354
This file was deleted.

package.json

+6-12
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,15 @@
11
{
2-
"name": "react-breadcrumb",
2+
"name": "scheduling-dashboard",
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@syncfusion/ej2-react-navigations": "^20.1.57",
7-
"@syncfusion/ej2-react-schedule": "^20.1.57",
8-
"@testing-library/jest-dom": "^5.16.4",
9-
"@testing-library/react": "^13.2.0",
6+
"@syncfusion/ej2-react-schedule": "^27.1.53",
7+
"@testing-library/jest-dom": "^5.17.0",
8+
"@testing-library/react": "^13.4.0",
109
"@testing-library/user-event": "^13.5.0",
11-
"@types/jest": "^27.5.1",
12-
"@types/node": "^16.11.36",
13-
"@types/react": "^18.0.9",
14-
"@types/react-dom": "^18.0.5",
15-
"react": "^18.1.0",
16-
"react-dom": "^18.1.0",
10+
"react": "^18.3.1",
11+
"react-dom": "^18.3.1",
1712
"react-scripts": "5.0.1",
18-
"typescript": "^4.7.2",
1913
"web-vitals": "^2.1.4"
2014
},
2115
"scripts": {

public/index.html

-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@
99
name="description"
1010
content="Web site created using create-react-app"
1111
/>
12-
<link href="https://cdn.syncfusion.com/ej2/material.css" rel="stylesheet">
1312
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
1413
<!--
1514
manifest.json provides metadata used when your web app is installed on a

src/App.css

+10-37
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,11 @@
1-
.App {
2-
text-align: center;
3-
}
1+
@import "../node_modules/@syncfusion/ej2-base/styles/bootstrap5.css";
2+
@import "../node_modules/@syncfusion/ej2-buttons/styles/bootstrap5.css";
3+
@import "../node_modules/@syncfusion/ej2-calendars/styles/bootstrap5.css";
4+
@import "../node_modules/@syncfusion/ej2-dropdowns/styles/bootstrap5.css";
5+
@import "../node_modules/@syncfusion/ej2-inputs/styles/bootstrap5.css";
6+
@import "../node_modules/@syncfusion/ej2-lists/styles/bootstrap5.css";
7+
@import "../node_modules/@syncfusion/ej2-navigations/styles/bootstrap5.css";
8+
@import "../node_modules/@syncfusion/ej2-popups/styles/bootstrap5.css";
9+
@import "../node_modules/@syncfusion/ej2-splitbuttons/styles/bootstrap5.css";
10+
@import "../node_modules/@syncfusion/ej2-react-schedule/styles/bootstrap5.css";
411

5-
.App-logo {
6-
height: 40vmin;
7-
pointer-events: none;
8-
}
9-
10-
@media (prefers-reduced-motion: no-preference) {
11-
.App-logo {
12-
animation: App-logo-spin infinite 20s linear;
13-
}
14-
}
15-
16-
.App-header {
17-
background-color: #282c34;
18-
min-height: 100vh;
19-
display: flex;
20-
flex-direction: column;
21-
align-items: center;
22-
justify-content: center;
23-
font-size: calc(10px + 2vmin);
24-
color: white;
25-
}
26-
27-
.App-link {
28-
color: #61dafb;
29-
}
30-
31-
@keyframes App-logo-spin {
32-
from {
33-
transform: rotate(0deg);
34-
}
35-
to {
36-
transform: rotate(360deg);
37-
}
38-
}

src/App.js

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import React from 'react';
2+
import './App.css';
3+
import { ScheduleComponent, Day, Week, WorkWeek, Month, Agenda, Inject } from '@syncfusion/ej2-react-schedule';
4+
5+
function App() {
6+
const data = [
7+
{
8+
Id: 1,
9+
Subject: 'Paris',
10+
StartTime: new Date(2023, 1, 15, 10, 0),
11+
EndTime: new Date(2023, 1, 15, 12, 30),
12+
},
13+
{
14+
Id: 2,
15+
Subject: 'Germany',
16+
StartTime: new Date(2023, 1, 17, 12, 0),
17+
EndTime: new Date(2023, 1, 17, 13, 30),
18+
},
19+
{
20+
Id: 3,
21+
Subject: 'England',
22+
StartTime: new Date(2023, 1, 13, 9, 0),
23+
EndTime: new Date(2023, 1, 13, 11, 0),
24+
},
25+
];
26+
27+
const eventSettings = { dataSource: data }
28+
29+
return (
30+
<div className="App">
31+
<ScheduleComponent height='550px' selectedDate={new Date(2023, 1, 15)} eventSettings={eventSettings}>
32+
<Inject services={[Day, Week, WorkWeek, Month, Agenda]} />
33+
</ScheduleComponent>
34+
</div>
35+
);
36+
}
37+
38+
export default App;

src/App.test.tsx renamed to src/App.test.js

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import React from 'react';
21
import { render, screen } from '@testing-library/react';
32
import App from './App';
43

src/App.tsx

-31
This file was deleted.

src/index.css

-2
Original file line numberDiff line numberDiff line change
@@ -11,5 +11,3 @@ code {
1111
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
1212
monospace;
1313
}
14-
15-

src/index.tsx renamed to src/index.js

+1-6
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,8 @@ import ReactDOM from 'react-dom/client';
33
import './index.css';
44
import App from './App';
55
import reportWebVitals from './reportWebVitals';
6-
import { registerLicense } from '@syncfusion/ej2-base';
76

8-
registerLicense('ORg4AjUWIQA/Gnt2VVhhQlFaclhJWHxMYVF2R2FJeFRycF9FaEwgOX1dQl9hSXpTcEVmWn9feHVRQWY=');
9-
10-
const root = ReactDOM.createRoot(
11-
document.getElementById('root') as HTMLElement
12-
);
7+
const root = ReactDOM.createRoot(document.getElementById('root'));
138
root.render(
149
<React.StrictMode>
1510
<App />

src/react-app-env.d.ts

-1
This file was deleted.

src/reportWebVitals.ts renamed to src/reportWebVitals.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
import { ReportHandler } from 'web-vitals';
2-
3-
const reportWebVitals = (onPerfEntry?: ReportHandler) => {
1+
const reportWebVitals = onPerfEntry => {
42
if (onPerfEntry && onPerfEntry instanceof Function) {
53
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
64
getCLS(onPerfEntry);
File renamed without changes.

tsconfig.json

-26
This file was deleted.

0 commit comments

Comments
 (0)