popov/mwitnessing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix show more evens click error

Browse Source
This commit is contained in:
Dobromir Popov
2024-04-23 20:57:57 +03:00
parent 1d38805dfe
commit ef27309b27
1 changed files with 66 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
components/calendar/avcalendar.tsx
View File

@ -274,6 +274,56 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
setIsModalOpen(false);
};
const eventStyleGetter = (event, start, end, isSelected) => {
//console.log("eventStyleGetter: " + event);
let backgroundColor = '#3174ad'; // default color for calendar events - #3174ad
if (currentView === 'agenda') {
return { style: {} }
}
if (event.type === "assignment") {
//event.title = event.publisher.name; //ToDo: add other publishers names
}
if (event.type === "availability") {
}
if (event.isFromPreviousAssignment) { //ToDo: does it work?
// orange-500 from Tailwind CSS
backgroundColor = '#f56565';
}
if (event.isFromPreviousMonth) {
//gray
backgroundColor = '#a0aec0';
}
if (event.isActive) {
switch (event.type) {
case 'assignment':
backgroundColor = event.isConfirmed ? '#48bb78' : '#f6e05e'; // green-500 and yellow-300 from Tailwind CSS
break;
case 'recurring':
backgroundColor = '#63b3ed'; // blue-300 from Tailwind CSS
break;
default: // availability
//backgroundColor = '#a0aec0'; // gray-400 from Tailwind CSS
break;
}
} else {
backgroundColor = '#a0aec0'; // Default color for inactive events
}
return {
style: {
backgroundColor,
opacity: 0.8,
color: 'white',
border: '0px',
display: 'block',
}
};
}
// Custom Components
const EventWrapper = ({ event, style }) => {
const [isHovered, setIsHovered] = useState(false);
let eventStyle = {
@ -391,55 +441,6 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
);
};
const eventStyleGetter = (event, start, end, isSelected) => {
//console.log("eventStyleGetter: " + event);
let backgroundColor = '#3174ad'; // default color for calendar events - #3174ad
if (currentView === 'agenda') {
return { style: {} }
}
if (event.type === "assignment") {
//event.title = event.publisher.name; //ToDo: add other publishers names
}
if (event.type === "availability") {
}
if (event.isFromPreviousAssignment) { //ToDo: does it work?
// orange-500 from Tailwind CSS
backgroundColor = '#f56565';
}
if (event.isFromPreviousMonth) {
//gray
backgroundColor = '#a0aec0';
}
if (event.isActive) {
switch (event.type) {
case 'assignment':
backgroundColor = event.isConfirmed ? '#48bb78' : '#f6e05e'; // green-500 and yellow-300 from Tailwind CSS
break;
case 'recurring':
backgroundColor = '#63b3ed'; // blue-300 from Tailwind CSS
break;
default: // availability
//backgroundColor = '#a0aec0'; // gray-400 from Tailwind CSS
break;
}
} else {
backgroundColor = '#a0aec0'; // Default color for inactive events
}
return {
style: {
backgroundColor,
opacity: 0.8,
color: 'white',
border: '0px',
display: 'block',
}
};
}
// Custom Toolbar Component
const CustomToolbar = ({ onNavigate, label, onView, view }) => {
return (
@ -472,6 +473,17 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
);
};
const CustomEventAgenda = ({
event
}) => (
<span>
<em style={{ color: 'black' }}>{event.title}</em>
<p>{event.desc}</p>
</span>
);
return (
<> <div {...handlers} className="flex flex-col"
>
@ -497,10 +509,15 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
components={{
event: EventWrapper,
toolbar: CustomToolbar,
view: CustomEventAgenda,
agenda: {
event: CustomEventAgenda
},
// ... other custom components
}}
eventPropGetter={(eventStyleGetter)}
date={date}
showAllEvents={true}
onNavigate={setDate}
className="rounded-lg shadow-lg"
/>